Case ce-0255-selection-addrange-chrome-en · Scenario scenario-selection-addrange-safari-fail

selection.addRange works correctly in Chrome

OS: Windows 10/11 Device: Desktop Any Browser: Chrome 120+ Keyboard: English (QWERTY) Status: confirmed
selection safari webkit cursor addRange working-correctly

현상

In Chrome, when using selection.addRange() to set cursor position in a contenteditable element with nested elements, the selection is correctly positioned at the intended location.

재현 예시

  1. Contenteditable element contains markers (<span> elements).
  2. Click button to move cursor before Marker 2.

관찰된 동작

  • Correct behavior: Selection is positioned before Marker 2 as intended
  • No jumping: Selection stays within intended container
  • Works correctly: Chrome handles nested elements properly

참고사항

This is a control case demonstrating that the issue is Safari-specific and does not affect Chrome.

Before
[Marker 1]text[Marker 3]
Contenteditable with nested elements
→
Click button to set cursor
[Marker 1]|text[Marker 3]
After button click
vs
✅ Correct: Selection before Marker 2
[Marker 1]|text[Marker 3]
Expected: Selection correctly positioned before Marker 2

Browser compatibility matrix

This matrix shows which browser and OS combinations have documented cases for this scenario. The current case is highlighted. Click on a cell to view other cases.

Current case
Confirmed
Draft
— No case documented

All variants (detailed table)

Complete list of all cases for this scenario with full environment details.

Case OS Device Browser Keyboard Status
ce-0255-selection-addrange-chrome-en Windows 10/11 Desktop Any Chrome 120+ English (QWERTY) confirmed
ce-0256-selection-addrange-edge-en Windows 10/11 Desktop Any Edge (Chromium-based) 120+ English (QWERTY) confirmed
ce-0545-selection-addrange-firefox-en Windows 10/11 Desktop Any Firefox 120+ English (QWERTY) confirmed

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 10/11
Device: Desktop Any
Browser: Chrome 120+
Keyboard: English (QWERTY)
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.