kss.js script does not handle :not() pseudo class properly
- Dominant language
- JavaScript
- Stars
- 1.5k
- Forks
- 265
- PR merge metrics
- No merged PRs in 30d
Description
While implementing a 3rd party script as part of a component, I initially couldn't get the script to work right.
Some sleuthing later I found that the (S)CSS contained a rule `&:not(:first-child)`, which resulted in a rule `&:not(.pseudo-class-first-child)`.
Barring some special cases, thats always going to be true, which breaks stuff.
I solved the problem for myself by rewriting from `a { x &:not(:first-child) { y }}` to `a { y &:first-child { x }}`, but I can imagine there are other cases where such a solution is less feasible.
From the way kss-node seems to work I imagine conceptually simple solutions, like not generating 'unrequested' pseudo-classes are technically unfeasible, but maybe something can be done with comments, in the way linters use them to disable checks for specific parts of the code?
Contributor guide
No contributing guide indexed for this repository
Research direction
No file or test is identified in the report; start by tracing kss-node's handling of nested :not(:first-child) rules. Reproduce the reported transformation and define done as preserving the intended selector without breaking other pseudo-class cases, then add or run coverage for that case.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript
- Domain
- documentation, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 35/100