Repository navigation
Format Library: Add a preference to hide non-breaking space markers - #84592
taipeicoder wants to merge 1 commit into
Conversation
Selected rich text outlines every non-breaking space while editing, and there was no way to turn the outlines off. Content with many intentional non-breaking spaces became hard to read in the editor. Add a "Show non-breaking spaces" toggle under Preferences > Appearance, backed by the core showNonBreakingSpaces preference. It defaults to on in the post editor and both site editors, and editors that never seed it keep the outlines. Turning it off only removes the editor outlines: the characters, saved content, insert shortcut, and popover are unchanged. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
1fd46aa to
b0de8de
Compare
🤖 PR meta 🤖🎉 PropsIf you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. Updated as activity occurs, without notifying anyone named here. Add the |
There was a problem hiding this comment.
🟢 Approval recommended
The preference is consistently integrated, persisted through the existing store, and covered by focused tests.
0 open findings
What changed in this PR
Adds a shared preference for controlling non-breaking-space markers across editor experiences.
Changes:
- Adds the Appearance preference and enables it by default.
- Makes marker rendering respond reactively to the preference.
- Adds unit coverage and package metadata updates.
| File | Description |
|---|---|
packages/format-library/tsconfig.json |
References the preferences package types. |
packages/format-library/src/non-breaking-space/test/index.jsdom.test.js |
Tests marker visibility and default behavior. |
packages/format-library/src/non-breaking-space/index.tsx |
Reads the preference and conditionally adds markers. |
packages/format-library/package.json |
Declares the preferences dependency. |
packages/format-library/CHANGELOG.md |
Documents the format enhancement. |
packages/editor/src/components/preferences-modal/index.jsx |
Adds the Appearance toggle. |
packages/editor/CHANGELOG.md |
Documents the new toggle. |
packages/edit-site/src/index.jsx |
Enables the preference by default in the site editor. |
packages/edit-site/CHANGELOG.md |
Documents the site-editor default. |
packages/edit-site-init/src/index.ts |
Enables the default in extensible editor routes. |
packages/edit-post/src/index.jsx |
Enables the preference by default in the post editor. |
packages/edit-post/CHANGELOG.md |
Documents the post-editor default. |
package-lock.json |
Records the new package dependency. |
🧠 Review effort: Balanced
💡 Add a code-review agent skill for context-aware, tailored reviews. Learn more in the docs.
|
This seems related to #72232, which also has a PR open. |
|
Closing in favor of #84737 |
What?
Adds a "Show non-breaking spaces" toggle under Preferences → Appearance. Turning it off hides the outlines the editor draws around non-breaking spaces. It's on by default, so nothing changes for anyone who leaves it alone.
Why?
When a rich-text block is selected, the editor outlines every non-breaking space (U+00A0) in it, and there's no way to turn that off. In content that uses non-breaking spaces on purpose, such as writing the number 10 000 which a non-breaking space to avoid a newline, the outlines might seem confusing or make text hard to read.
Removing the characters isn't an option, because they control where lines wrap. Writers need to keep them but stop seeing them.
How?
The non-breaking space format now reads a new
corepreference,showNonBreakingSpaces. When the preference is off, the format leaves the text unmarked. The preference defaults to on in the post editor, the site editor and the extensible site editor.Testing Instructions
Post editor
10, press Cmd+Shift+Space (Ctrl+Shift+Space on Windows/Linux), then type000. Repeat a few times elsewhere in the paragraph.Site editor
Testing Instructions for Keyboard
Use of AI Tools
Implemented with Claude Code (Claude Opus 5.5), including the unit test and the browser checks of both editors. I reviewed the changes and am responsible for them.