ITADN

[css-syntax-patches-for-csstree] incorrect CSS syntax for cursor value

#1703Closedtyrasd 创建于 2025-10-21
T
tyrasdcommented
The value of the `cursor` CSS property for csstree is currently [defined here](https://github.com/csstools/postcss-plugins/blob/b89cff7/packages/css-syntax-patches-for-csstree/raw-data/csstree-properties.json#L576) as follows: ``` [ [ <url> | <url-set()> ] [ <x> <y> ]? ]#? [ auto | … ] ``` This does however not match the way the `cursor` css property is [defined](https://www.w3.org/TR/css-ui-3/#cursor) in CSS Level3 and accepted by browsers: The difference is that if the URL (or URL set) part is present, then the syntax above would not allow a comma between the URL part and the fallback-cursor, which is however required for the CSS rule to work in a browser. A simple example CSS: `url(example.png), auto` does not parse in csstree when using the definition from this repo. The version with the omitted comma (`url(example.png) auto`) parses using the above definition, but fails to be usable in Chrome <img height="60" alt="" src="https://github.com/user-attachments/assets/dade70cf-b829-45c6-9cf8-3cfa61cd7dc6" /> or Firefox <img height="70" alt="" src="https://github.com/user-attachments/assets/e30d5dac-4ce9-4531-80be-2cbe328090bc" />. As far as I can tell, the following would be the correct syntax to define the `cursor` CSS property: ``` [ [ <url> | <url-set()> ] [ <x> <y> ]? , ]* [ auto | … ] ``` PS: The same (incorrect) `#?` syntax to define the `cursor` property was also present in recent CSS Level4 drafts (e.g. in the version of [8 August 2025](https://web.archive.org/web/20251011223405/https://drafts.csswg.org/css-ui-4/#cursor)), where it was a mistake as well: see https://github.com/w3c/csswg-drafts/issues/13001.
关闭于 2025-11-11 2 条评论