Skip to content

Fix generation of div:not(.foo) if .foo is never defined - #7815

Merged
RobinMalfait merged 3 commits into
masterfrom
fix-unrecognized-not-selector
Mar 17, 2022
Merged

RobinMalfait merged 3 commits into
masterfrom
fix-unrecognized-not-selector

Conversation

@RobinMalfait

Copy link
Copy Markdown
Contributor

This PR will fix an issue where some code never got generated.

E.g.:

@layer base {
  div:not(.foo) {
    background-color: pink;
  }
}
<div>I am a div</div>

You would expect that this div has a background color of pink, but that's not the case because we never generated the above css. This is because it contains a class that doesn't exist and therefore we never generated it.
It could happen that you forget about this code, and all of a sudden you use .foo in an unrelated spot. This means that all of a sudden this code doess get generated and now your div is pink.

This PR will fix that by making sure that this gets generated. We already generate non "on-demandable" code (always). For example div {} will always be generated.
To fix this, we ignore everything inside the :not when extracting classes, this results in div {} and doesn't contain any classes thus we generate it. Note, removal of :not() only happens when extract classes, the final result still contains the :not.

Fixes: #7750

@RobinMalfait
RobinMalfait requested a review from adamwathan March 11, 2022 12:31
@RobinMalfait
RobinMalfait merged commit 48728ed into master Mar 17, 2022
@RobinMalfait
RobinMalfait deleted the fix-unrecognized-not-selector branch March 17, 2022 15:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Not recognizing selector:not(.class-name) unless class-name exists in content

1 participant