Re: [csswg-drafts] [css-scoping] [selectors] :scope and DocumentFragment / ShadowRoot (#7261)

>> So following the specs as they are written today, document.querySelector(":scope > *") should return the html element, just as myshadowroot.querySelector(":scope > *") returns all the root nodes in the shadow tree.

> Yeah, that behavior makes sense. It's not what browsers implement though.

Actually, no, that does _not_ make sense for shadow roots, because the shadow root itself does not exist for the purposes of selector matching (when matching in the context of that shadow tree):

Scoping:

> When a selector is matched against a [shadow tree](https://dom.spec.whatwg.org/#concept-shadow-tree), the selector match list is initially the [shadow host](https://dom.spec.whatwg.org/#element-shadow-host), followed by all children of the shadow tree’s [shadow root](https://dom.spec.whatwg.org/#concept-shadow-root) and their descendants, ordered by a pre-order traversal.

Also, to reinforce that:

> For the purpose of Selectors, a [shadow host](https://dom.spec.whatwg.org/#element-shadow-host) also appears in its [shadow tree](https://dom.spec.whatwg.org/#concept-shadow-tree), with the contents of the shadow tree treated as its children. (In other words, the shadow host is treated as replacing the [shadow root](https://dom.spec.whatwg.org/#concept-shadow-root) node.)

This is aligned with the current behavior of all browsers as well. To visualize: 

If this matches:
```css
:host > div { ... }
```
then this can't _also_ match:
```css
:scope > div { ... }
```
At least not as long as `:scope` points to the shadow root.

-- 
GitHub Notification of comment by andruud
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7261#issuecomment-1676924402 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 14 August 2023 08:42:55 UTC