MadLittleMods / postcss-increase-specificity

Why? Dealing with CSS you can't remove(mainly from a 3rd party). Increases specificity of selectors.
MIT License
50 stars 16 forks source link

Does not recognize root element in some cases #23

Open whatisaphone opened 3 years ago

whatisaphone commented 3 years ago

It looks like this plugin tries not to break html selectors, but it doesn't handle more complex selectors containing html.

Test case:

Input:

html[data-whatintent=keyboard] .button:focus {}

Actual output:

:not(#\9):not(#\9):not(#\9) html[data-whatintent=keyboard] .button:focus {}

These styles never end up being applied because html has no parent element

Expected output:

html[data-whatintent=keyboard]:not(#\9):not(#\9):not(#\9) .button:focus {}

It should append stackableRoot to the root selector, instead of prepending

MadLittleMods commented 3 years ago

Thanks for the report @whatisaphone! Feel free to create a PR and add some tests to fix this :+1:

Relevant code:

bpartridge commented 2 years ago

Ran into this issue today - @whatisaphone did you ever end up finding a fix for this?

whatisaphone commented 2 years ago

Yes, I fixed the issue by quitting my job