w3c / w3c/csswg-drafts

[cssom] "insert a CSS rule" should throw if given a valid rule *with* declarations

Open
#10,652 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

cssom-1
Dominant language
Bikeshed
Stars
4.9k
Forks
816
PR merge metrics
PR metrics pending

Description

As currently specified, "insert a CSS rule" invokes two parsing algos from Syntax:

  1. First, it invokes "parse a rule", which only succeeds if it finds exactly one valid rule in its input, and nothing else.
  2. If that fails, it invokes "parse a block's contents", and only pays attention to the declarations returned from the algo. (The algo returns a mixed list of rules and declaration lists.) If there are any valid declarations, it succeeds; otherwise it fails.

This means that content like @media (width: 100px) {...} --foo: bar; will fail the first check (extra stuff after the rule), then successfully pass the second and append the --foo: bar as a CSSNestedDeclaration object, ignoring the completely valid @media rule that preceded it.

(The algo also seems to be written against a slightly older version of the "parse a block's contents" algo, when it returned rules and declarations as separate lists. It's easy enough to parse what it means given the current return value, but it should probably be fixed.)

I think this should be changed to look at the whole return value, and only succeed if it returned exactly one item that is a list of declarations.

This means that (a) including valid rules mixed with declarations will fail, as I think we want, and (b) including invalid rules will even sometimes fail, if they show up between declarations. Like, --one: 1; @invalid; --two: 2; will produce two separate lists of declarations, each containing a single declaration. However, @invalid; --one: 1; won't trigger that, as it just returns a single list of declarations.

We could even adjust the Syntax algo to return errors (or at least the presence of them), so the CSSOM algo can consistently fail when an invalid rule is used.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the CSSOM “insert a CSS rule” algorithm and compare its calls to CSS Syntax’s “parse a rule” and “parse a block’s contents” algorithms. Trace the current mixed return value and verify the cases described in the issue, including valid rules with declarations and separated declaration lists. Done means the specification consistently rejects the stated invalid inputs and no longer relies on the older return-value description.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.