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
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
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
Tags: safari
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
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
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.