Mobile drag-to-selection creates inconsistent ranges
OS: iOS 16.0+ · Device: iPhone or iPad Any · Browser: Safari 16.0+ · Keyboard: Default (English)
Open case →Scenario
Touch drag to extend selection on mobile Safari and others
Drag handles and touch selection on iOS Safari can conflict with scroll gestures, nested editables, and custom overlays—selection may collapse or jump compared to desktop.
selection
Scenario ID
scenario-mobile-selection-drag-to-select
Details
Drag handles and touch selection on iOS Safari can conflict with scroll gestures, nested editables, and custom overlays—selection may collapse or jump compared to desktop.
Related Cases
References
Scenario flow
Visual view of how this scenario connects to its concrete cases and environments. Nodes can be dragged and clicked.
Variants
Each row is a concrete case for this scenario, with a dedicated document and playground.
| Case | OS | Device | Browser | Keyboard | Status |
|---|---|---|---|---|---|
| ce-0541-mobile-selection-drag-ios-safari | iOS 16.0+ | iPhone or iPad Any | Safari 16.0+ | Default (English) | draft |
Cases
Open a case to see the detailed description and its dedicated playground.
Related Scenarios
Other scenarios that share similar tags or category.
Tags: safari, selection
Selection is lost after copying content in contenteditable
After copying selected text in a contenteditable region using Cmd+C, the selection is lost in Safari. The user must re-select the text to perform additional operations.
1 case
Tags: safari, selection
selection.addRange not working correctly in Safari
When setting cursor position using `selection.addRange()` in a contenteditable element, it works correctly in Chrome and Firefox but fails in Safari. The selection "pops out" of intended marker element and moves to the next sibling's text node instead of staying within the marker.
3 cases
Tags: safari, selection
window.getSelection() returns null when contenteditable loses focus
When a contenteditable region loses focus, window.getSelection() may return null in Safari, even if there was a valid selection before the focus loss. This makes it difficult to preserve or work with selections.
1 case
Tags: selection
contenteditable=false dismisses selection on Android Chrome
Tapping or moving across contenteditable=false regions on Android can collapse selection or clear the caret in ways that differ from desktop Chrome.
1 case
Tags: selection
Browser zoom causes caret and selection positioning issues
When the browser is zoomed (or content is scaled via CSS transforms), caret position and text selection in contenteditable elements can become inaccurate. Clicking at a certain position places the caret elsewhere, and selection highlights may not match the visual selection.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.