Visual revisions: Add a code diff view inside the editor

[priethor]

What

Closes #77841, part of #79120.

Adds a Code editor option to the block editor revisions screen, showing the selected revision's raw markup and highlighting the lines that were added or removed. The Show changes toggle on the top left switches between the diff and the plain markup.

Why

A visual diff can miss changes to block attributes when the rendered post still looks the same. The code view makes those changes visible in the new revisions screen instead of sending users back to the classic one.

Testing Instructions

1. Create a post and save two revisions with different paragraph content.
2. Open Revisions from the Post sidebar.
3. Open Options and choose Code editor.
4. Check that the old and new markup are highlighted, then move the slider and confirm the diff updates.
5. Turn off Show changes and confirm that only the selected revision's markup is shown.
6. Exit revisions while the Code editor is selected and confirm that the post editor remains in code mode.
7. Switch back to the Visual editor and confirm that revisions return to the visual view.
8. With network throttling enabled, reopen Revisions and open Options before the slider finishes loading. Confirm that the focus does not jump to the slider.

Screen recording

Grabacion.de.pantalla.2026-07-15.a.las.15.44.12.mov

---

I used Codex to implement these changes. I guided the work, tested it, and reviewed the results.

[github-actions]

Size Change: +2.5 kB (+0.03%)

Total Size: 7.77 MB

📦 View Changed

Filename	Size	Change
build/scripts/editor/index.min.js	502 kB	+1.14 kB (+0.23%)
build/styles/editor/style-rtl.css	31.4 kB	+352 B (+1.13%)
build/styles/editor/style-rtl.min.css	26.7 kB	+329 B (+1.25%)
build/styles/editor/style.css	31.4 kB	+349 B (+1.12%)
build/styles/editor/style.min.css	26.7 kB	+330 B (+1.25%)

_{compressed-size-action}

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: priethor <priethor@git.wordpress.org>
Co-authored-by: jorgefilipecosta <jorgefilipecosta@git.wordpress.org>
Co-authored-by: ellatrix <ellatrix@git.wordpress.org>
Co-authored-by: himanshupathak95 <abcd95@git.wordpress.org>
Co-authored-by: simison <simison@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[github-actions]

Flaky tests detected in aa7aefd.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/29510630171
📝 Reported issues:

• [Flaky Test] Should navigate inner blocks with arrow keys #39607 in /test/e2e/specs/editor/various/writing-flow.spec.js
• [Flaky Test] should cut and paste individual blocks with collapsed selection #80248 in /test/e2e/specs/editor/various/copy-cut-paste.spec.js

[jorgefilipecosta]

Left some comments but things look good and I think it could be merged after the comments are addressed/answred.

[ellatrix]

What do we use for the classic revisions screen? Are we using the same thing?

[priethor]

Not sure I follow; do you mean the diffing itself?

[ellatrix]

Yeah, just curious if we can keep the content and diffing mostly the same

[priethor]

Regarding content, both compare post_content but the classic screen also diffs the title and excerpt, which this view doesn’t.

The diffing is similar, but classic revisions normalize whitespace first, collapsing blank lines and repeated spaces, and it also highlights changed words within a line, while this view highlights the whole line.

I’ll explore bringing them closer in a follow-up PR to avoid scope creep. 👍

[priethor]

Follow-up to make the content diffing closer to the classic screen, with per-word highlights:
#81273