w3c / w3c/csswg-drafts

[cssom-view] Allow elementFromPoint and elementsFromPoint to traverse shadow roots

Open
#10,992 3 comments 5 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

cssom-view-1 Needs Edits topic: shadow
Dominant language
Bikeshed
Stars
4.9k
Forks
816
PR merge metrics
PR metrics pending

Description

I recently asked on Mastodon if folks knew the element(s)FromPoint() methods and whether they'd want them to be able to traverse shadow roots: https://mas.to/@patrickbrosset/113236606097090887

Some replies to my "Do you wish it would across Shadow DOM boundaries "question:

In my use case, whether I want it to cross Shadow DOM boundaries would depend on how "thick" the custom elements are. If thin, I wouldn't care. If they encompassed too much in the page, then yeah I'd want a more fine-grained approach.

YES

ABSOLUTELY YES

I'm not sure whether it should cross shadow boundaries on its own. I could maybe see an option, so you had to do work to get through, but didn't need to write your own recursive method.

I think I’d want to be explicit about getting any element from within a shadow root, so maybe if there was an option to include shadow roots.

Absolutely yes! Eventually, it could be a parameter option, like document.elementsFromPoint({ composed: true }) or similar.

Note that caretPositionFromPoint already works this way: https://developer.mozilla.org/en-US/docs/Web/API/Document/caretPositionFromPoint#shadowroots

Also, during the TAG review for caretPositionFromPoint @LeaVerou said (https://github.com/w3ctag/design-reviews/issues/949#issuecomment-2186090703):

I would reiterate that elementFromPoint() could also be expanded in the same way for consistency (and I suspect there are plenty of use cases for that too).

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the CSSOM View issue discussion and review the existing caretPositionFromPoint shadow-root behavior linked in the report. Read the TAG review for the related consistency rationale. Done would require an agreed API design and corresponding specification changes, but this issue does not identify files or tests.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
api, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.