Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

":where() pseudo class not supported" in firefox version that should support it. #64

Closed
DanielCordell opened this issue Oct 24, 2022 · 3 comments · Fixed by #65 or #66
Closed

Comments

@DanielCordell
Copy link

I am currently using firefox 106, which has support for there :where() pseudo-class.

However, if I attempt to run the query demo, I get the following in the console:

image

Also contained in the screenshot is proof that where is supported. I've also tested it manually by adding a simple :where(div) and it's picked up correctly. I am using the polyfill via the CDN URL provided, not using npm. Is there another step I need to take, or is there an issue with firefox currently?

@gkatsev
Copy link
Contributor

gkatsev commented Oct 25, 2022

Looks like it's because the check in the code is CSS.supports('selector(:where())') which is returning false but adding in div to the :where(div) makes it return true and as far as I can tell makes it work as expected.

gkatsev added a commit to gkatsev/container-query-polyfill that referenced this issue Oct 25, 2022
Newer Firefox's have :where support but the specific check used returns
false. Changing the check to be `CSS.supports('selector(:where(div))')`
makes it return `true` in Firefox and makes the polyfill work there
without needing the :where fallback.

Fixes GoogleChromeLabs#64
@gkatsev
Copy link
Contributor

gkatsev commented Oct 25, 2022

Submitted a PR for that #65

@DanielCordell
Copy link
Author

Submitted a PR for that #65

Wow, quick stuff, many thanks!

devknoll pushed a commit that referenced this issue Nov 3, 2022
Newer Firefox's have :where support but the specific check used returns
false. Changing the check to be `CSS.supports('selector(:where(div))')`
makes it return `true` in Firefox and makes the polyfill work there
without needing the :where fallback.

Fixes #64
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants