disabled attribute does not disable contenteditable
OS: macOS Ubuntu 22.04 · Device: Desktop or Laptop Any · Browser: Safari 120.0 · Keyboard: US
Open case →Scenario
disabled attribute does not disable contenteditable
The `disabled` attribute, which disables form inputs, does not work on contenteditable regions in Safari. The contenteditable remains editable and interactive even when `disabled` is set.
other
Scenario ID
scenario-disabled-attribute
Details
The disabled attribute, which disables form inputs, does not work on contenteditable regions in Safari. The contenteditable remains editable and interactive even when disabled is set.
References
- MDN: contenteditable global attribute - contenteditable documentation
- MDN: HTMLElement.contentEditable - contentEditable property
- Stack Overflow: Why does contenteditable false not work? - Safari nested contenteditable issues
- CKEditor Issue #12128: contenteditable false in Safari - Safari deletion 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-0066-contenteditable-with-disabled | macOS Ubuntu 22.04 | Desktop or Laptop Any | Safari 120.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: editing, safari
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
Auto-scroll while typing in contenteditable
Browsers try to keep the caret visible by scrolling the editable container or the page. During rapid typing—especially near the bottom or right edge—scroll updates can lag, batch, or feel jarring, so the caret temporarily leaves the viewport or the view jumps unexpectedly.
3 cases
Tags: safari
beforeinput event is not supported in Safari
The beforeinput event, which is crucial for intercepting and modifying input before it's committed to the DOM, is not supported in Safari. This makes it difficult to implement custom input handling that works across all browsers.
1 case
Tags: safari
innerHTML and serialization differ across browsers
The same DOM edited in contenteditable may serialize to different markup strings in Safari vs Chrome—attribute order, implied tags, and span wrappers for styles.
1 case
Tags: safari
Text caret is invisible on position:relative elements
When editing content inside an element with `position:relative`, the text caret (cursor) is completely invisible. Text can be typed and appears in the editor, but there's no visual feedback of where the insertion point is located.
2 cases
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.