Case ce-0033-selection-range-incorrect · Scenario scenario-selection-range-accuracy

Selection range is incorrect when selecting across multiple elements

OS: Windows 11 Device: Desktop Any Browser: Edge 120.0 Keyboard: US Status: confirmed
selection range multi-block edge

Phenomenon

Selecting across nested block structures causes the Selection API to report inconsistent boundaries. Visually, the highlight looks correct, but programmatically, the anchorNode or focusNode can jump to the parent container instead of the leaf text node.

Reproduction Steps

  1. Create two paragraphs: <p>One</p><p>Two</p>.
  2. Select from the middle of “One” to the middle of “Two”.
  3. Call window.getSelection().getRangeAt(0).
  4. Observe that startContainer might be the parent div instead of the first <p>.

Observed Behavior

Edge/Chrome engines sometimes optimize range calculations by collapsing boundaries to the nearest common block, losing the fine-grained text offset.

Playground for this case

Use the reported environment as a reference and record what happens in your environment while interacting with the editable area.

Reported environment
OS: Windows 11
Device: Desktop Any
Browser: Edge 120.0
Keyboard: US
Your environment
Sample HTML:
Event log
Use this log together with the case description when filing or updating an issue.
0 events
Interact with the editable area to see events here.

Comments & Discussion

Have questions, suggestions, or want to share your experience? Join the discussion below.