Matching slotted elements using querySelector API fails with ::slotted() |
|||||
Issue description
When a user wants to retrieve some specific elements in shadow slots,
something like shadowRoot.querySelector("::slotted(.red)") could
work, but currently this fails on Blink.
Demo:
http://jsbin.com/jafetekipi/edit?html,js,output
This is because currently querySelector() checks if selector contains
pseudo elements and returns empty.
,
Apr 12 2017
Looks like querySelector() API is split out of selectors-api spec, and the selectors-4 spec is purely for CSS selectors, and querySelectorAPI() is now part of DOM spec: https://dom.spec.whatwg.org/ But I cannot find any notes on matching pseudo-elements in querySelector(). So if excluding any pseudo-elements in querySelector is not a *requirement*, then we can return matched elements for ::slotted(), just like what we do for '>>>' (shadow-piercing combinator) use in querySelector, without changing any spec.
,
Apr 14 2017
,
Apr 18 2017
Maybe ::part() should match as well, once CSS shadow parts (formerly called custom pseudo element) is implemented. https://tabatkins.github.io/specs/css-shadow-parts/
,
May 26 2017
kochi@, could you work on this?
,
Jul 13 2017
Upstream spec issue filed at: https://github.com/whatwg/dom/issues/463 Once upstream issue is decided whether we allow returning elements which live in different tree than the context object for querySelector() et al., I'll work on matching the spec.
,
Jul 13 2017
,
Jun 18 2018
The upstream issue is closed and this is working as the spec says. |
|||||
►
Sign in to add a comment |
|||||
Comment 1 by kochi@chromium.org
, Apr 12 2017