Phenomenon
When editing text within a code block in Chrome, formatting operations (bold, italic, etc.) can still be applied. This breaks the code formatting and creates invalid code structure.
Reproduction example
- Create a code block:
<pre><code>function test() {</code></pre> - Select text inside the code block
- Apply bold formatting (Ctrl+B)
Observed behavior
- Formatting is applied:
<pre><code>function <b>test</b>() {</code></pre> - Code structure is broken
- Formatting should not be in code
- Invalid code structure
Expected behavior
- Formatting should be prevented in code blocks
- Code should remain plain text
- Structure should be preserved
- Formatting operations should be blocked
Browser Comparison
- All browsers: Formatting can be applied (default behavior)
- Custom implementation needed to prevent formatting
Notes and possible direction for workarounds
- Intercept formatting operations in code blocks
- Prevent default behavior for formatting
- Block format commands (bold, italic, etc.)
- Preserve code as plain text