Case ce-0045 · Scenario scenario-insertHTML-behavior

insertHTML breaks DOM structure and formatting

OS: Windows 11 Device: Desktop or Laptop Any Browser: Chrome 120.0 Keyboard: US Status: draft
insertHTML dom formatting chrome

Phenomenon

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.

Reproduction example

  1. Create a contenteditable div.
  2. Select a position within it.
  3. Use document.execCommand('insertHTML', false, '<p><strong>Bold text</strong></p>').
  4. Inspect the resulting DOM structure.

Observed behavior

  • In Chrome on Windows, insertHTML may break the DOM structure.
  • Nested elements may be flattened or reorganized.
  • Formatting may be lost or changed unexpectedly.

Expected behavior

  • insertHTML should preserve the HTML structure as provided.
  • Nested elements should remain nested.
  • Formatting should be maintained.

Playground for this case

Use the reported environment as a reference and record what happens in your environment while interacting with the editable area.

Reported environment
OS: Windows 11
Device: Desktop or Laptop Any
Browser: Chrome 120.0
Keyboard: US
Your environment

Use this editable area to reproduce the described case.

Event log
Use this log together with the case description when filing or updating an issue.
0 events
Interact with the editable area to see events here.