execCommand is deprecated but still widely used for formatting
OS: Any Ubuntu 22.04 · Device: Desktop or Laptop Any · Browser: Chrome 120.0 · Keyboard: US
Open case →Scenario
execCommand is deprecated but still widely used for formatting
The document.execCommand() API, which is commonly used to apply formatting (bold, italic, etc.) in contenteditable regions, has been deprecated. However, there is no complete replacement, and many implementations still rely on it. This creates uncertainty about future browser support.
formatting
Scenario ID
scenario-execCommand-alternatives
Details
The document.execCommand() API, which is commonly used to apply formatting (bold, italic, etc.) in contenteditable regions, has been deprecated. However, there is no complete replacement, and many implementations still rely on it. This creates uncertainty about future browser support.
References
- MDN: Document.execCommand - execCommand API documentation (deprecated)
- W3C Input Events Level 2 Specification - beforeinput and Input Events API
- MDN: Element beforeinput event - Modern alternative
- MDN: Selection API - Selection and Range APIs
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-0018-execCommand-deprecated | Any Ubuntu 22.04 | Desktop or Laptop Any | Chrome 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: formatting, chrome
insertHTML breaks DOM structure and formatting
When using document.execCommand('insertHTML', ...) to insert HTML content into a contenteditable region, the DOM structure may be broken or reformatted unexpectedly. Nested elements may be flattened or reorganized.
1 case
Tags: formatting
Code block editing behavior varies across browsers
Editing text within code blocks (<pre><code>) in contenteditable elements behaves inconsistently across browsers. Line breaks, indentation, whitespace preservation, and formatting may be handled differently, making it difficult to maintain code formatting.
4 cases
Tags: formatting
Font family changes behave inconsistently
Changing font family in contenteditable elements behaves inconsistently across browsers. The font-family CSS property may be applied inline, as a style attribute, or may not be applied at all. The behavior also varies when editing text after applying a font.
3 cases
Tags: formatting
Bold formatting is lost when typing after applying bold
When applying bold formatting to selected text and then continuing to type, the bold formatting is not maintained for the newly typed characters in Safari.
4 cases
Tags: execCommand
Deleted inline elements recreated when typing in contenteditable
After deleting an empty or inline element (e.g. span, b) inside contenteditable, typing causes the browser to recreate the deleted element, leading to unpredictable DOM and editor state.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.