Add check for syntax parsing and connectivity, fix missed syntaxes #597

lahmatiy · 2022-08-27T16:23:11Z

There are pretty common problems when updating CSS syntax dictionaries:

added/updated definition can't be parsed;
a new syntax has broken references to other definitions, i.e. a syntax definition it refers to is missed in dictionaries.

This PR adds new 2 types of examination:

every syntax definition can be parsed using CSS Units and Values rules (CSSTree is using as a parser);
all parsed syntax definitions has no broken references (i.e. <type> and <'property'>), i.e. refer to existing definitions only.

The new checking rules found issues (there are connectivity issues only, because parse errors are ignored in some cases, see bellow):

Check CSS syntax connectivity...
  css/at-rules.json "@document" prelude used missed syntax definition <url>
  css/at-rules.json "@font-face/src" used missed syntax definition <url>
  css/at-rules.json "@font-face/unicode-range" used missed syntax definition <unicode-range>
  css/at-rules.json "@import" prelude used missed syntax definition <url>
  css/at-rules.json "@import" prelude used missed syntax definition <declaration>
  css/at-rules.json "@namespace" prelude used missed syntax definition <url>
  css/properties.json "-moz-binding" used missed syntax definition <url>
  css/properties.json "cursor" used missed syntax definition <url>
  css/properties.json "cursor" used missed syntax definition <x>
  css/properties.json "cursor" used missed syntax definition <y>
  css/properties.json "offset-path" used missed syntax definition <url>
  css/selectors.json ":has" used missed syntax definition <forgiving-relative-selector-list>
  css/selectors.json ":is" used missed syntax definition <forgiving-selector-list>
  css/selectors.json ":lang" used missed syntax definition <language-code>
  css/selectors.json "::cue" used missed syntax definition <selector>
  css/selectors.json "::cue-region" used missed syntax definition <selector>
  css/syntaxes.json "attr()" used missed syntax definition <attr-name>
  css/syntaxes.json "attr()" used missed syntax definition <attr-fallback>
  css/syntaxes.json "clip-source" used missed syntax definition <url>
  css/syntaxes.json "filter-function-list" used missed syntax definition <url>
  css/syntaxes.json "image" used missed syntax definition <url>
  css/syntaxes.json "image-src" used missed syntax definition <url>
  css/syntaxes.json "keyframe-block" used missed syntax definition <declaration-list>
  css/syntaxes.json "mask-source" used missed syntax definition <url>
  css/syntaxes.json "page-body" used missed syntax definition <declaration>
  css/syntaxes.json "page-margin-box" used missed syntax definition <declaration-list>
  css/syntaxes.json "round()" used missed syntax definition <rounding-strategy>
  css/syntaxes.json "shape" used missed syntax definition <top>
  css/syntaxes.json "shape" used missed syntax definition <right>
  css/syntaxes.json "shape" used missed syntax definition <bottom>
  css/syntaxes.json "shape" used missed syntax definition <left>
  css/syntaxes.json "supports-decl" used missed syntax definition <declaration>
  css/syntaxes.json "target-counter()" used missed syntax definition <url>
  css/syntaxes.json "target-counters()" used missed syntax definition <url>
  css/syntaxes.json "target-text()" used missed syntax definition <url>

These issues were addressed in the PR as well:

Added missed definitions: <attr-name>, <attr-fallback>, <rounding-strategy>, <url>, <url-mofdifier>, <declaration>, <declaration-list>, <forgiving-relative-selector-list>, <forgiving-selector-list>
Renamed <unicode-range> into <urange> (see The Unicode-Range microsyntax and a record in change log)
Replaced <language-code> for [ <string> | <ident> ] since there is no a definition for language-code anywhere in the CSS specs, but a prose for :lang() claims that a value should be ident or string.
Replaced <selector> (used for ::cue / ::cue()) for <compound-selector>, since there is no <selector> definition (a "selector" meaning depends on context of use), but <compound-selector> looks pretty close to what is described in the spec.
Changed a part of cursor property syntax: <x> <y> -> <number> <number>, since there is no definitions for x and y. I think that that's an artefact of the legacy, because it's a pretty old definition and all other definitions have no such precision in a syntax part naming. Except for shape() (see below).
Changed a definition for <shape> which is using for deprecated clip property. So, the same here, it's an artefact of legacy. The syntax was extended to allow parameters with no comma, and shape definition was renamed into rect() according to the spec.

Some exceptions was added to the lint script, to avoid parse error warnings for now:

@charset at-rule: syntax should be @charset <string> (current syntax has no parse error, but can't be used for a syntax matching since incorrect)
ID selectors: syntax should be "#" <ident>
Universal selectors: syntax should be "*"
Adjacent sibling combinator: syntax should be "+"
::after, ::before, ::first-letter and ::first-line

All these exceptions can (should) be eliminated, but it should be discussed. The only reason these things have an invalid syntax that's more readable for humans when displaying on MDN. However, looks like currently mdn/data is not used for MDN, therefore may be no reason for such deviations from the specs now.

https://drafts.fxtf.org/css-masking/#clip-property

ramiy · 2022-10-09T20:42:09Z

<rounding-strategy> added in #605.

test/lint.js

+
+    try {
+      if (key.startsWith('@')) {
+        const prelude = syntax.trim().replace(/\{(.|\s)+\}/, '').match(/^@\S+\s+([^;\{]*)/)[1].trim() || null;


lahmatiy · 2023-05-30T02:09:37Z

Now it reports 5 new issues:

  css/at-rules.json "@font-palette-values" prelude used missed syntax definition <dashed-ident>
  css/at-rules.json "@font-palette-values/override-colors" used missed syntax definition <absolute-color-base>
  css/properties.json "animation-composition" used missed syntax definition <single-animation-composition>
  css/properties.json "font-palette" used missed syntax definition <palette-identifier>
  css/syntaxes.json "ray()" used missed syntax definition <ray-size>

lahmatiy · 2023-05-30T02:12:19Z

@teoli2003 Could you please comment on PR?

teoli2003 · 2023-12-28T11:34:19Z

Sorry, I missed this one.

We want to retire this repository, so we prefer not to add non-data features.

If you are using it and need help getting rid of it (by using w3c/webref) we would happily be available for a discussion. If your use case is not covered by w3c/webref, we would be happy to know about it.

lahmatiy · 2024-11-02T01:29:24Z

@teoli2003 I understand that you and other maintainers aim to minimize work on the mdn/data repository due to limited resources and prefer not to add non-data features. However, my proposed PR is not introducing a standalone feature but rather extending the existing linting process to prevent errors in the data.

Recently, I attempted to update to the latest version of mdn/data (2.12.1) in CSSTree and encountered issues due to errors in the data. The linter output, with the extensions from this PR, reports:

> node test/lint

api/inheritance.json
  Style – OK
  JSON Schema – OK

api/inheritance.schema.json
  Style – OK

css/at-rules.json
  Style – OK
  JSON Schema – OK
  Definition syntax check - OK

css/at-rules.schema.json
  Style – OK

css/definitions.json
  Style – OK

css/functions.json
  Style – OK
  JSON Schema – OK

css/functions.schema.json
  Style – OK

css/properties.json
  Style – OK
  JSON Schema – OK
  Definition syntax check - Failed with 1 error(s)

    Parse error of "text-wrap": Expect `'`
      <'text-wrap-mode> || <'text-wrap-style'>
    ------------------^

css/properties.schema.json
  Style – OK

css/selectors.json
  Style – OK
  JSON Schema – OK
  Definition syntax check - OK

css/selectors.schema.json
  Style – OK

css/syntaxes.json
  Style – OK
  JSON Schema – OK
  Definition syntax check - OK

css/syntaxes.schema.json
  Style – OK

css/types.json
  Style – OK
  JSON Schema – OK

css/types.schema.json
  Style – OK

css/units.json
  Style – OK
  JSON Schema – OK

css/units.schema.json
  Style – OK

l10n/css.json
  Style – OK

Check CSS syntax connectivity...
  css/at-rules.json "@font-palette-values/override-colors" used missed syntax definition <absolute-color-base>
  css/at-rules.json "@scope" prelude used missed syntax definition <scope-start>
  css/at-rules.json "@scope" prelude used missed syntax definition <scope-end>
  css/properties.json "animation-composition" used missed syntax definition <single-animation-composition>
  css/properties.json "font-palette" used missed syntax definition <palette-identifier>
  css/properties.json "offset-path" used missed syntax definition <offset-path>
  css/properties.json "offset-path" used missed syntax definition <coord-box>
  css/properties.json "position-anchor" used missed syntax definition <anchor-name>
  css/properties.json "position-area" used missed syntax definition <position-area>
  css/properties.json "position-try-fallbacks" used missed syntax definition <try-tactic>
  css/properties.json "position-try-order" used missed syntax definition <try-size>
  css/properties.json "stroke-dasharray" used missed syntax definition <dasharray>
  css/properties.json "stroke-opacity" used missed syntax definition <opacity>
  css/properties.json "white-space" used missed syntax definition <'white-space-trim'>

Lint check FAILED

Specifically, there is a mistake in the <'text-wrap'> syntax and 14 missing definitions. These issues could have been avoided with the proposed additions to the linter.

Regarding your suggestion to transition to w3c/webref, I have concerns about its ability to fully replace mdn/data for certain use cases. I have elaborated on these concerns in this comment: why w3c/webref can't replace mdn/data.

I also noticed a recent discussion about removing syntaxes from mdn/data, which mentions reaching out to me and CSSTree to collaborate on this issue. Unfortunately, this collaboration has not yet occurred.

I believe that integrating the proposed linting enhancements would improve the quality of the data and prevent future errors, ultimately reducing maintenance effort in the long run.

//cc @pepelsbey

skyclouds2001 · 2024-11-22T10:57:37Z

css/properties.json "white-space" used missed syntax definition <'white-space-trim'>

seems that white-space-trim is CSS Text 4 feature and havn't support by any browser yet

lahmatiy added 3 commits August 27, 2022 16:16

Add check for syntax parsing and connectivity, fix missed syntaxes

bdabb9a

Tweak syntaxes

8832f67

Update <'clip'> syntax according to the spec

958a5f4

https://drafts.fxtf.org/css-masking/#clip-property

github-actions bot added the idle Issues and pull requests with no activity for three months. label Jan 4, 2023

Merge branch 'main' into lint-syntaxes

cfe64e4

github-advanced-security bot found potential problems May 30, 2023

View reviewed changes

lahmatiy mentioned this pull request May 30, 2023

[PROJECT] mdn/data deprecation mdn/mdn#166

Open

github-actions bot removed the idle Issues and pull requests with no activity for three months. label May 30, 2023

github-actions bot added the idle Issues and pull requests with no activity for three months. label Jun 29, 2023

teoli2003 closed this Dec 28, 2023

lahmatiy mentioned this pull request Dec 5, 2024

Missed syntaxes in 2.13.0 #819

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add check for syntax parsing and connectivity, fix missed syntaxes #597

Add check for syntax parsing and connectivity, fix missed syntaxes #597

lahmatiy commented Aug 27, 2022

ramiy commented Oct 9, 2022

lahmatiy commented May 30, 2023 •

edited

Loading

lahmatiy commented May 30, 2023

teoli2003 commented Dec 28, 2023

lahmatiy commented Nov 2, 2024

skyclouds2001 commented Nov 22, 2024 •

edited

Loading

Add check for syntax parsing and connectivity, fix missed syntaxes #597

Add check for syntax parsing and connectivity, fix missed syntaxes #597

Conversation

lahmatiy commented Aug 27, 2022

ramiy commented Oct 9, 2022

lahmatiy commented May 30, 2023 • edited Loading

lahmatiy commented May 30, 2023

teoli2003 commented Dec 28, 2023

lahmatiy commented Nov 2, 2024

skyclouds2001 commented Nov 22, 2024 • edited Loading

lahmatiy commented May 30, 2023 •

edited

Loading

skyclouds2001 commented Nov 22, 2024 •

edited

Loading