Case ce-0147-code-block-line-breaks-lost · Scenario scenario-code-block-editing

Line breaks are lost when editing code blocks

OS: Windows 11 Device: Desktop or Laptop Any Browser: Chrome 120.0 Keyboard: US Status: draft
code pre line-break chrome

Phenomenon

When editing text within a code block in Chrome, line breaks may be lost or converted to <br> tags instead of being preserved as newlines. This breaks code formatting and structure.

Reproduction example

  1. Create a code block with multiple lines
  2. Edit the code (add, delete, modify lines)
  3. Observe line break preservation

Observed behavior

  • Line breaks are lost
  • Or line breaks are converted to <br> tags
  • Code structure is broken
  • Formatting is lost

Expected behavior

  • Line breaks should be preserved
  • Code structure should be maintained
  • Formatting should remain intact
  • Behavior should match code editors

Browser Comparison

  • Chrome/Edge: Line breaks may be lost (this case)
  • Firefox: Similar line break issues
  • Safari: Line break preservation inconsistent

Notes and possible direction for workarounds

  • Ensure white-space: pre CSS is applied
  • Intercept Enter key to insert newlines properly
  • Preserve line breaks during editing
  • Monitor and restore line breaks if lost
Before
function test() {
return true;
}
Code block with multiple lines
→
After Editing (Bug)
function test() { return true; }
After editing, line breaks lost, merged into single line
vs
✅ Expected
function test() {
return true;
}
Expected: Line breaks preserved

Browser compatibility matrix

This matrix shows which browser and OS combinations have documented cases for this scenario. The current case is highlighted. Click on a cell to view other cases.

Current case
Confirmed
Draft
— No case documented

All variants (detailed table)

Complete list of all cases for this scenario with full environment details.

Case OS Device Browser Keyboard Status
ce-0108-code-block-whitespace-chrome Windows 11 Desktop or Laptop Any Chrome 120.0 US draft
ce-0136-code-block-paste-formats Windows 11 Desktop or Laptop Any Firefox 120.0 US draft
ce-0147-code-block-line-breaks-lost Windows 11 Desktop or Laptop Any Chrome 120.0 US draft
ce-0157-code-block-formatting-allowed Windows 11 Desktop or Laptop Any Chrome 120.0 US draft

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
Sample HTML:
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.

Comments & Discussion

Have questions, suggestions, or want to share your experience? Join the discussion below.