`:where` not being transpiled for older browsers

[KieranP]

Using lightningcss and setting the browser targets to the last 5 years, the final CSS output contains :where selectors, which have only been supported for just over 4 years (https://caniuse.com/?search=%3Awhere). Missing feature or impossible transpilation?

[devongovett]

This is not possible. :where changes the specificity of the selector, which is not possible to emulate.

[KieranP]

@devongovett Understood. Rather than silently ignore these sorts of things, would outputting warnings when syntax isn't compatible with browser targets be suitable here? e.g.

Warning: Final CSS output contains `:where` selectors, which are not compatible with browser target `last 5 years`

[devongovett]

That's a good idea.

[NuclleaR]

@devongovett if it's not posible to emulate :where so why then don't add some flag to remove :where from result CSS and leave it for the developer responsibility? I mean :where(.px-4) and just .pa-4 it's the same for me, I completely agree with that.

[devongovett]

Because then the css would be incorrect (have the wrong specificity)

[NuclleaR]

it’s true but at least it will work in old browsers

[mischnic]

It will appear to work in simple cases, but subtly break in the cases that rely on :where having its intended specificity.