:scope selector does not match if context object is a shadow root
Reported by
tomalec...@gmail.com,
Jul 2
|
||||||
Issue description
UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
Steps to reproduce the problem:
1. Create a shadow root with any element inside (for example `div`)
2. Use `querySelector` or `querySelectorAll` on shadow root with a `:scope` selector (for example `shadowRoot.querySelector(':scope > div')`)
See live example at http://jsbin.com/takucok/edit?html,console
What is the expected behavior?
Direct child element of a context object - shadow root - should get selected.
What went wrong?
`:scope` matches nothing.
Did this work before? N/A
Does this work in other browsers? No
Same in Firefox with `dom.webcomponents.shadowdom.enabled=true`
Chrome version: 67.0.3396.99 Channel: stable
OS Version: 10.0
Flash Version:
`:scope` works fine for any descendant element withing shadow root
,
Jul 4
,
Jul 11
,
Jul 31
,
Aug 2
Link to the spec: https://drafts.csswg.org/selectors-4/#absolutizing The spec defines DocumentFragment as virtual scoping root, and the behavior on virtual scoping roots is unclear.
,
Aug 15
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/074ff3e4917e178bef9622d023a66273a4afa8d5 commit 074ff3e4917e178bef9622d023a66273a4afa8d5 Author: Momoko Sumida <momon@google.com> Date: Wed Aug 15 10:06:23 2018 Add WPT for :scope selector on shadow trees This WPT shows that :scope does not work for shadow root. :scope matches nothing when the direct child element or descendant of shadow root should be selected, while :scope works fine for descendant elements within shadow root. Link to the spec: https://drafts.csswg.org/selectors-4/#the-scope-pseudo Link to related issue: https://github.com/w3c/csswg-drafts/issues/3016 Bug: 859692 Change-Id: I801706eb7891035dcb900588d5542bd48fa1c12a Reviewed-on: https://chromium-review.googlesource.com/1158445 Commit-Queue: Momoko Sumida <momon@google.com> Reviewed-by: Rakina Zata Amni <rakina@chromium.org> Reviewed-by: Hayato Ito <hayato@chromium.org> Cr-Commit-Position: refs/heads/master@{#583210} [add] https://crrev.com/074ff3e4917e178bef9622d023a66273a4afa8d5/third_party/WebKit/LayoutTests/external/wpt/css/selectors/scope-selector-expected.txt [add] https://crrev.com/074ff3e4917e178bef9622d023a66273a4afa8d5/third_party/WebKit/LayoutTests/external/wpt/css/selectors/scope-selector.html
,
Aug 17
Sorry, I think it is a real bug.
,
Sep 12
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/2728052d428eb088be94db48fb475317ac011a47 commit 2728052d428eb088be94db48fb475317ac011a47 Author: Momoko Sumida <momon@google.com> Date: Wed Sep 12 04:16:55 2018 Fix :scope selector matching in the case of DocumentFragment/ShadowRoot When used in querySelector and querySelectorAll, :scope should match the element or the DocumentFragment/ShadowRoot the querySelector is called on. However, WPT adeed in crrev.com/c/1158445 shows that :scope matches nothing when querySelector is called on shadow root, while it works fine when querySelector is called on true element. This CL fixes :scope selector matching process so that :scope itself matches DocumentFragment/ShadowRoot when querySelector is called on DocumentFragment/ShadowRoot. Tests for DocumentFragment are also added in this CL. Link to the spec: https://drafts.csswg.org/selectors-4/#the-scope-pseudo Link to related issue: https://github.com/w3c/csswg-drafts/issues/3016 Link to related CL: crrev.com/c/1158445 Bug: 859692 Change-Id: If20fc4b122d93a553dc478be0ee958958340a34f Reviewed-on: https://chromium-review.googlesource.com/1203472 Reviewed-by: Rune Lillesveen <futhark@chromium.org> Reviewed-by: Rakina Zata Amni <rakina@chromium.org> Commit-Queue: Momoko Sumida <momon@google.com> Cr-Commit-Position: refs/heads/master@{#590595} [delete] https://crrev.com/4d123df95c82fa332647f6c825c6463a9d08ae67/third_party/WebKit/LayoutTests/external/wpt/css/selectors/scope-selector-expected.txt [modify] https://crrev.com/2728052d428eb088be94db48fb475317ac011a47/third_party/WebKit/LayoutTests/external/wpt/css/selectors/scope-selector.html [modify] https://crrev.com/2728052d428eb088be94db48fb475317ac011a47/third_party/blink/renderer/core/css/selector_checker.cc
,
Sep 19
|
||||||
►
Sign in to add a comment |
||||||
Comment 1 by krajshree@chromium.org
, Jul 4