Page Visibility API may affect contenteditable during tab switches
OS: macOS 14.0 · Device: Desktop or Laptop MacBook Pro · Browser: Safari 17.0 · Keyboard: US
Open case →Scenario
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.
focus
Scenario ID
scenario-page-visibility-api
Details
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.
References
- MDN: Page Visibility API - Page Visibility API documentation
- MDN: compositionupdate event - Composition events
- ProseMirror Discuss: NodeView selection lost on tab focus - Selection loss issues
- ProseMirror Discuss: Composition lost when input after select - Composition interruption
- Reddit: Vivaldi browser focus issues - Focus restoration problems
- Firefox Bugzilla: IME stops working after DOM changes - IME issues
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-0087-contenteditable-with-page-visibility-api | macOS 14.0 | Desktop or Laptop MacBook Pro | Safari 17.0 | US | 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: focus, safari
WebKit contenteditable Focus Bug
A known bug in WebKit browsers prevents focus from transferring correctly from contenteditable elements to non-editable elements. A workaround involves using a hidden input field to manage focus transitions.
1 case
Tags: focus
autofocus attribute does not work on contenteditable
The autofocus attribute, which automatically focuses form inputs on page load, does not work on contenteditable elements. There is no built-in way to automatically focus a contenteditable region when a page loads.
1 case
Tags: focus
Focus is lost when clicking on certain elements within contenteditable
When a contenteditable region contains interactive elements (buttons, links, etc.), clicking on these elements causes the contenteditable to lose focus. This interrupts the editing flow and may cause the caret to disappear.
1 case
Tags: focus
Programmatic focus selects all content
In Chrome and Safari, calling focus() on a contenteditable div can select the entire content instead of placing the cursor at the beginning, as observed in Firefox and IE.
1 case
Tags: focus
Fullscreen API may affect contenteditable focus and selection
When a contenteditable element enters or exits fullscreen mode using the Fullscreen API, focus and selection may be lost. The caret position may reset, and editing may be disrupted.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.