Skip to content

[css-scoping] :scope > * matches nothing in shadow trees #11188

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

Closed
andruud opened this issue Nov 12, 2024 · 3 comments
Closed

[css-scoping] :scope > * matches nothing in shadow trees #11188

andruud opened this issue Nov 12, 2024 · 3 comments
Labels
css-scoping-1 Current Work

Comments

@andruud
Copy link
Member

andruud commented Nov 12, 2024

In #7261 (cc @emilio), @tabatkins concludes that:

myshadowroot.querySelector(":scope > *") returns all the root nodes in the shadow tree.

But no it doesn't: in the context of a shadow tree, the shadow root is specified to be replaced by the shadow host for the purposes of selector matching. This means that the node :scope represents here doesn't exist as far as selector matching is concerned. https://drafts.csswg.org/css-scoping-1/#host-element-in-tree

@andruud andruud added the css-scoping-1 Current Work label Nov 12, 2024
@tabatkins
Copy link
Member

Oof, that's an accidental interaction. Maybe we can just special-case that and say that, when calling querySelector() on a shadow root, the :scope represents the shadow host.

(The shadow root is, itself, not selectable anyway, as it doesn't exist in the tree as far as Selectors is concerned.)

chromium-wpt-export-bot pushed a commit to web-platform-tests/wpt that referenced this issue Nov 13, 2024
This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
aarongable pushed a commit to chromium/chromium that referenced this issue Nov 13, 2024
This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}
chromium-wpt-export-bot pushed a commit to web-platform-tests/wpt that referenced this issue Nov 13, 2024
This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}
chromium-wpt-export-bot pushed a commit to web-platform-tests/wpt that referenced this issue Nov 13, 2024
This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}
moz-v2v-gh pushed a commit to mozilla/gecko-dev that referenced this issue Nov 16, 2024
…atchForRelation, a=testonly

Automatic update from web-platform-tests
Remove special :scope matching code in MatchForRelation

This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}

--

wpt-commits: 7b7e2451a431d0cc68e4e5a96d19a71675dd782d
wpt-pr: 49150
@sorvell
Copy link

sorvell commented Nov 17, 2024

Is this issue related / the same? #11000 (comment)

jamienicol pushed a commit to jamienicol/gecko that referenced this issue Nov 18, 2024
…atchForRelation, a=testonly

Automatic update from web-platform-tests
Remove special :scope matching code in MatchForRelation

This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}

--

wpt-commits: 7b7e2451a431d0cc68e4e5a96d19a71675dd782d
wpt-pr: 49150
i3roly pushed a commit to i3roly/firefox-dynasty that referenced this issue Nov 20, 2024
…atchForRelation, a=testonly

Automatic update from web-platform-tests
Remove special :scope matching code in MatchForRelation

This special path causes :scope selectors to incorrectly match
':scope *' selectors in shadow roots, when it actually should
match nothing [1].

The provided test scope-pseudo-in-shadow.html is passing in Firefox
and Safari. The existing WPT scope-selector.html (all browsers currently
passing) cover querySelector[All] cases well for shadow roots, document,
and other DocumentFragments. There should be no behavior change there.

Fixed: 378698644

[1] w3c/csswg-drafts#11188
[2] w3c/csswg-drafts#7261

Change-Id: I1efbf999864a766ad5dfaee1fd67527309e38107
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6011808
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: Anders Hartvoll Ruud <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1382339}

--

wpt-commits: 7b7e2451a431d0cc68e4e5a96d19a71675dd782d
wpt-pr: 49150
@andruud andruud closed this as completed Nov 20, 2024
@andruud andruud reopened this Nov 20, 2024
@andruud
Copy link
Member Author

andruud commented Nov 20, 2024

@sorvell I think that's definitely close enough, thanks.

Closing as duplicate of #11000.

@andruud andruud closed this as completed Nov 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
css-scoping-1 Current Work
Projects
None yet
Development

No branches or pull requests

3 participants