cssinjs / jss

JSS is an authoring tool for CSS which uses JavaScript as a host language.
https://cssinjs.org
MIT License
7.08k stars 399 forks source link

jss-plugin-vendor-prefixer prefixes CSS custom properties #1113

Closed rafamel closed 5 years ago

rafamel commented 5 years ago

Expected behavior: jss-plugin-vendor-prefixer produces -webkit---padding-start: 0'; for --padding-start: 0. This style should be left as is: it is not padding-start, but --padding-start, an Ionic Framework variable (otherwise it would be easy enough to use a different variable name to not run into this issue).

Describe the bug: jss-plugin-vendor-prefixer should only prefix exact matches and correctly detect when things like --padding-start are set instead of padding-start.

Versions:

AleshaOleg commented 5 years ago

@rafamel thanks for reporting.

AleshaOleg commented 5 years ago

Here as the last instance for unsupported properties we prefixing them with -webkit- prefix (who knows maybe with -webkit- this value will work).

Here is a case and I don't know many cases exist at all.

That's why we're prefixing with -webkit- by default. For now, we're not checking properties if they exist or not.

I'll think tomorrow if I can move backdrop-filter prefixing out of prefixed plugin. Will test, and probably, we can return unsupported values as they're.

kof commented 5 years ago

@AleshaOleg I think you misunderstood the issue, --padding-start is a css custom prop, it should never be prefixed (two dashes in the beginning)

rafamel commented 5 years ago

@kof exactly. If it starts with two dashes it should not be prefixed as a fallback in any case, @AleshaOleg . Thank you both for the quick response!

kof commented 5 years ago

I think we released the fix already

AleshaOleg commented 5 years ago

@kof yes, forgot to write fix version here. Fixed in 2.0.4.