IntersectionObserver triggers unexpected editor resets
OS: macOS 14.2 · Device: Desktop Any · Browser: Safari 17.2 · Keyboard: US
Open case →Scenario
IntersectionObserver may affect contenteditable visibility detection
When an IntersectionObserver is used to detect when a contenteditable element becomes visible or hidden, the observer may not fire correctly during editing. Changes to content size or position during editing may not trigger intersection updates as expected.
other
Scenario ID
scenario-intersection-observer-interference
Details
When an IntersectionObserver is used to detect when a contenteditable element becomes visible or hidden, the observer may not fire correctly during editing. Changes to content size or position during editing may not trigger intersection updates as expected.
References
- W3C Intersection Observer: Timing element visibility - IntersectionObserver specification
- GitHub Gist: WebKit contentEditable focus/blur behavior - WebKit bugs
- Stack Overflow: IntersectionObserver does not intercept elements with display contents - Display issues
- MDN: Intersection Observer API timing - Threshold configuration
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-0082-contenteditable-with-intersection-observer | macOS 14.2 | Desktop Any | Safari 17.2 | US | confirmed |
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, macos
CORS restrictions may affect contenteditable in cross-origin iframes
When a contenteditable element is inside a cross-origin iframe, CORS restrictions may prevent certain operations. Accessing the contenteditable from the parent frame may be blocked, and some editing operations may be restricted.
1 case
Tags: safari, macos
CSS isolation property may affect contenteditable stacking context
When a contenteditable element has the CSS isolation: isolate property, it creates a new stacking context. This may affect how selection handles and IME candidate windows are positioned relative to the element.
1 case
Tags: safari, macos
File API drag and drop does not work in contenteditable
When trying to drag and drop files into a contenteditable element, the File API may not work as expected. File drop events may not fire, or file content may not be accessible.
1 case
Tags: safari, macos
MutationObserver may interfere with contenteditable editing
When a MutationObserver is attached to a contenteditable element or its parent, the observer callbacks may interfere with editing performance. Frequent DOM mutations during typing can trigger many observer callbacks, causing lag or jank.
1 case
Tags: safari, macos
Page Visibility API may affect contenteditable during tab switches
When a page with a contenteditable element becomes hidden (tab switch, minimize), the Page Visibility API may affect editing state. Focus may be lost, and composition may be interrupted.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.