Projects using this
September 24, 2025 · View on GitHub
CSS parsing tests #################
This repository contains implementation-independent test for CSS parsers, based
on the 2021 candidate recommandation draft of the CSS Syntax Level 3_
specification.
.. _CSS Syntax Level 3: https://www.w3.org/TR/2021/CRD-css-syntax-3-20211224/
The upstream repository for these tests is at https://github.com/SimonSapin/css-parsing-tests
Projects using this
CSS parsers using these tests:
tinycss2 <https://github.com/Kozea/tinycss2>_ (Python)rust-cssparser <https://github.com/servo/rust-cssparser>_ (Rust, used inServo <https://github.com/servo/servo>_)Crass <https://github.com/rgrove/crass>_ (Ruby)
Importing
The recommended way to use these tests in an implementation is to import them with git-subtree_.
.. _git-subtree: https://github.com/git/git/tree/master/contrib/subtree
To import the first time to a ./css-parsing-tests sub-directory,
run this from the top-level of a git repository::
git subtree add -P css-parsing-tests https://github.com/SimonSapin/css-parsing-tests.git main
Later, to merge changes made in the upstream repository, run::
git subtree pull -P css-parsing-tests https://github.com/SimonSapin/css-parsing-tests.git main
Test files
CSS Syntax specification describes a number of "functions".
Each .json file in this repository corresponds to such a function.
The files are encoded as UTF-8
and each contain a JSON array with an even number of items,
where each pair of items is one function input
associated with the expected result.
component_value_list.json
Tests Parse a list of component values <https://drafts.csswg.org/css-syntax-3/#parse-a-list-of-component-values>.
The Unicode input is represented by a JSON string,
the output as an array of component values as described below.
component_value_list.json
Tests Parse a component value <https://drafts.csswg.org/css-syntax-3/#parse-a-component-value>.
The Unicode input is represented by a JSON string,
the output as a component value.
declaration_list.json
Tests Parse a list of declarations <https://drafts.csswg.org/css-syntax-3/#parse-a-list-of-declarations>.
The Unicode input is represented by a JSON string,
the output as an array of declarations and at-rules_.
blocks_contents.json
Tests Parse a block’s contents <http://dev.w3.org/csswg/css-syntax-3/#parse-block-contents>.
The Unicode input is represented by a JSON string,
the output as an array of declarations, at-rules_ and qualified rules_.
one_declaration.json
Tests Parse a declaration <https://drafts.csswg.org/css-syntax-3/#parse-a-declaration>.
The Unicode input is represented by a JSON string,
the output as a declaration.
one_rule.json
Tests Parse a rule <https://drafts.csswg.org/css-syntax-3/#parse-a-rule>.
The Unicode input is represented by a JSON string,
the output as a qualified rule or at-rule_.
rule_list.json
Tests Parse a list of rules <https://drafts.csswg.org/css-syntax-3/#parse-a-list-of-rules>.
The Unicode input is represented by a JSON string,
the output as a list of qualified rules or at-rules_.
stylesheet.json
Tests Parse a stylesheet <https://drafts.csswg.org/css-syntax-3/#parse-a-stylesheet>.
The Unicode input is represented by a JSON string,
the output as a list of qualified rules or at-rules_.
stylesheet_bytes.json
Tests Parse a stylesheet <https://drafts.csswg.org/css-syntax-3/#parse-a-stylesheet>_
together with The input byte stream <https://drafts.csswg.org/css-syntax-3/#input-byte-stream>_.
The input is represented as a JSON object containing:
* A required ``css_bytes``, the input byte string,
represented as a JSON string where code points U+0000 to U+00FF
represent bytes of the same value.
* An optional ``protocol_encoding``,
a protocol encoding label as a JSON string, or null.
* An optional ``environment_encoding``,
an environment encoding label as a JSON string, or null.
* An optional ``comment`` that is ignored.
The output is represented a list of `qualified rules`_ or at-rules_.
color_*.json
Tests the <color> syntax defined in both in
CSS Color Level 3 <https://www.w3.org/TR/css-color-3/#colorunits>_ and
CSS Color Level 4 <https://www.w3.org/TR/css-color-4/#colorunits>_.
The Unicode input is represented by a JSON string,
the output as one of:
* null if the input is not a valid color in CSS syntax, or
* a string corresponding to the serialization of the result, as defined in
level 4.
An+B.json
Tests the An+B <https://drafts.csswg.org/css-syntax-3/#the-anb-type>_
syntax defined in CSS Syntax Level 3.
This differs <https://drafts.csswg.org/css-syntax-3/#changes>_ from the
nth grammar rule <https://www.w3.org/TR/selectors-3/#nth-child-pseudo>_
in Selectors Level 3 only in that
- characters and digits can be escaped in some cases.
The Unicode input is represented by a JSON string,
the output as null for invalid syntax,
or an array of two integers [A, B].
Result representation
AST nodes (the results of parsing) are represented in JSON as follow.
This representation was chosen to be compact
(and thus less annoying to write by hand)
while staying unambiguous.
For example, the difference between @import and \@import is not lost:
they are represented as ["at-keyword", "import"] and ["ident", "@import"],
respectively.
Rules and declarations
.. _at-rule: .. _at-rules: .. _qualified rule: .. _qualified rules: .. _declaration: .. _declarations:
At-rule
An array of length 4: the string "at-rule",
the name (value of the at-keyword) as a string,
the prelude as a nested array of component values_,
and the optional block as a nested array of component value, or null.
Qualified rule
An array of length 3: the string "qualified rule",
the prelude as a nested array of component values_,
and the block as a nested array of component value.
Declaration
An array of length 4: the string "declaration", the name as a string,
the value as a nested array of component values_,
and a the important flag as a boolean.
.. _component value: .. _component values:
Component values
{} block
An array of length N+1: the string "{}"
followed by the N component values_ of the block’s content.
[] block
An array of length N+1: the string "[]"
followed by the N component values_ of the block’s content.
() block
An array of length N+1: the string "()"
followed by the N component values_ of the block’s content.
Function
An array of length N+2: the string "function"
and the name of the function as a string
followed by the N component values_ of the function’s arguments.
Unmatched <}>
The array of two strings ["error", "}"].
Unmatched <]>
The array of two strings ["error", "]"].
Unmatched <)>
The array of two strings ["error", ")"].