Bug 232402 – :empty selector matches elements with a shadow root

• Status: RESOLVED
• Resolution: INVALID
• Component: CSS

[Luke Warlow]

Steps to reproduce:

Go to https://jsfiddle.net/hyjfkwqx/
You should see there is no output.

Actual results:

The :empty selector matches an element with an open shadow root that itself has child elements. So the parent div is not displayed.

Expected results:

I would expect the :empty selector to not match these elements. So I would expect to see a red square with a smaller blue square in it.

[Luke Warlow]

Chrome Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1264139

Firefox Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1738113

[Luke Warlow]

I made an issue in the CSSWG github just in case it's a spec "issue" rather than a browser one. https://github.com/w3c/csswg-drafts/issues/6771

[Emilio Cobos Álvarez (:emilio)]

Let's reopen if the CSSWG decides to change behavior here but this is invalid as per spec.