css-minify icon indicating copy to clipboard operation
css-minify copied to clipboard

Pseudo-element selectors improperly minified

Open hamaluik opened this issue 3 years ago • 1 comments

It seems that psuedo-element selectors aren't being properly minified. Essentially, any selectors that begin with :: get the double colons minified to a single one :, which changes / invalidates the selector.

I came across this when using the ::backdrop psuedo-element. I would expect the following:

dialog::backdrop {
  backdrop-filter: blur(4px);
}

to minify down to:

dialog::backdrop{backdrop-filter:blur(4px)}

however, it instead minifies down to:

dialog:backdrop {backdrop-filter:blur(4px)}

(note the single :, which makes the selector not work at all. This happens across all of the optimization levels (Zero included).

hamaluik avatar Feb 08 '23 19:02 hamaluik

The problematic code is here: https://github.com/Mnwa/css-minify/blob/fe03929c8ded9085b502d796c5e18a77ae6777ad/css-minify/src/parsers/selector.rs#L52

css-minify completely disregards the number of colons (just checks that there are 1-2 colons preceding it) and then later on hardcodes serializing it with just one colon here: https://github.com/Mnwa/css-minify/blob/fe03929c8ded9085b502d796c5e18a77ae6777ad/css-minify/src/structure.rs#L141

I also discovered this problem when using zola and suddenly css-minify minifed the correct pseudo-element li::marker {} into the illegal li:marker {}.

@Mnwa Would you accept a PR fixing this problem?

vimpostor avatar Dec 22 '23 15:12 vimpostor

Hi! Thanks for you issue. Now it fixed

Mnwa avatar Aug 17 '24 13:08 Mnwa