search

microsoft / vscode-css-languageservice

CSS, LESS & SCSS language service extracted from VSCode to be reused, e.g in the Monaco editor.
MIT License
312 stars 176 forks source link

#74068 nth child specificity #369

Closed SStranks closed 9 months ago

SStranks commented 9 months ago

Fix issue #74068 "[css] Wrong selector specificity values with :nth-child(even) and :nth-child(odd)". This patches the specificity for the nth-child/nth-last-child psuedo-selector.

Debugging the code it seems the scanner/parser treats words 'even', 'odd', and 'n', as NodeType 16 (ElementNameSelector), which contributes to a false specificity.

'div:nth-child(n of li)' should produce a specificity of 0-1-2, but produces 0-1-4 suggesting all three arguments are treated as elements. If the 'n' has an integer prefix the correct specificity is produced however.

Rather than try to unpack the scanner/parser logic, the solution exploits the formula of the psuedo-selector by testing for the presence of " of " within the arguments string, "An+B [of S]?".

The specificity of the :nth-child(An+B [of S]?) pseudo-class is the specificity of a single pseudo-class plus, if S is specified, the specificity of the most specific complex selector in S

aeschli commented 9 months ago

Looks good! If you can run the fomatter on selectorPrinting.ts one more time that would be perfect.

SStranks commented 9 months ago

Looks good! If you can run the fomatter on selectorPrinting.ts one more time that would be perfect.

Amended

aeschli commented 9 months ago

Thanks a lot!