WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED DUPLICATE of
bug 234531
234732
[:has() pseudo-class] Styles matching non-matching elements on load
https://bugs.webkit.org/show_bug.cgi?id=234732
Summary
[:has() pseudo-class] Styles matching non-matching elements on load
Brandon McConnell
Reported
2021-12-28 14:32:44 PST
Created
attachment 448057
[details]
screenshot of has pseudo-class bug Congrats on launching the :has() pseudo-class! Excited by all the possibilities this will open for styling. One unexpected side effect I'm seeing when testing— it appears that `:has()` sometimes matches for non-matching elements. The inspector doesn't show the styles but they appear on-page. If I comment out the styles in the inspector and then un-comment them, they disappear. * Example URL:
https://codepen.io/brandonmcconnell/pen/45b67ffa16dc41614efdd140bef1f439
* Example screenshot attached * Example screen recording:
https://www.loom.com/share/0cf9c18a99a8421f9957ff04c34f64de
This bug is critical to the use of `:has()` so this should be resolved before the `:has()` pseudo-class is released into the production browser.
Attachments
screenshot of has pseudo-class bug
(205.36 KB, image/png)
2021-12-28 14:32 PST
,
Brandon McConnell
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
Brandon McConnell
Comment 1
2021-12-28 14:38:51 PST
Also check example #'s at this URL (
https://codepen.io/brandonmcconnell/pen/a93e58403165e721481e7fc4fe3fb676?editors=1100
): * Example 6 * Example 7 * Example 8 Each shows certain matched squares that should not be matched. If you inspect those blocks in the inspector, you will see they are not actually receiving the styles but show them visually anyway.
Bramus
Comment 2
2021-12-28 15:07:50 PST
On Twitter I saw a demo pass by that showed the same faulty behavior:
https://codepen.io/ZoranJambor/pen/GRMyzvy
``` a:has(span) { background: rebeccapurple; color: #fff; } ``` Both `<a>` elements get styled, even though the 2nd `<a>` element does not contain a `<span>`.
Antti Koivisto
Comment 3
2022-01-03 06:32:50 PST
Fixed in trunk. *** This bug has been marked as a duplicate of
bug 234531
***
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug