New issue
Advanced search Search tips

Issue 871049 link

Starred by 0 users

Issue metadata

Status: WontFix
Owner: ----
Closed: Aug 5
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Bug



Sign in to add a comment

@supports / CSS.supports claims support for --webkit-backdrop-filter when it doesn't support it.

Reported by mor...@statshelix.com, Aug 4

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3511.0 Safari/537.36

Steps to reproduce the problem:
1. Make sure "Experimental Web Platform features" is DISABLED in about://flags
2. Restart Chrome
3. In any website, execute the following JS, for example in the developer console: CSS.supports("--webkit-backdrop-filter: blur(5px)")
4. Observe the function returning true.

(Alternatively, you can reproduce it with a @supports rule)

What is the expected behavior?
The function returns false

What went wrong?
I suspect that because Chrome *could* support the feature, it always returns true. 

This assumption is solely based on the fact that this behavior occurs on Chrome 67 and Chrome 70 but not on Chrome 59.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 70.0.3511.0  Channel: canary
OS Version: 10.0
Flash Version: 

According to the CSS3-spec the browser ought to return false:

Section 6.1:

> If a processor does not implement, with a usable level of support, the value given, then it must not accept the declaration or claim support for it.
> [...]
> Note: On the other hand, a developer-facing preference whose purpose is to enable or disable support for an experimental CSS feature does affect this definition of support.

The note mentions this explicit case, and the status of this flag *should* affect the return-value of this function, but it does not.

Since Safari supports backdrop-filter with the *same* vendor-prefix selecting on this feature could greatly enhance the experience for our safari-users and the chrome-users who have this flag enabled.
 
very_reduced_testcase.js
73 bytes View Download
Bisected to b5416b84aba8ec3442788d6bbea54091ef18b6b0
"[css-conditional] CSS.supports with one string should accept paren-less declaration."
Landed in 61.0.3123.0
I'm pretty sure this is invalid, you're using two dashes instead of one:

  CSS.supports("-webkit-backdrop-filter: blur(5px)")

returns false.

  CSS.supports("--webkit-backdrop-filter: blur(5px)")

Is declaring a custom property. It's the same as:

  CSS.supports("--foo: bar")

For which other browsers also return true, since it's a valid declaration.

...now I feel more than stupid. Sorry!

I'm not sure how I did not see this, I even use CSS variables in the same stylesheet.
Status: WontFix (was: Unconfirmed)

Sign in to add a comment