Block Editor: History Compare renders incorrectly with the new editor (garbled diff, empty field)

[ihoffmann-dot]

Problem Statement

In the content version History Compare, a Block Editor (StoryBlock) field renders incorrectly when the new Block Editor is active (FEATURE_FLAG_NEW_BLOCK_EDITOR on, now the default after #36254). With the legacy editor the same comparison renders correctly.

Symptom observed:

• In the field-by-field view the Block Editor field can render empty / as null.

Impact: version comparison is effectively unusable for Block Editor fields under the new editor. Because #36254 flipped the new editor on by default, this now affects all instances. Front-end only; the stored content is unaffected.

Browser/OS: reproducible in the new Block Editor on staging-trunk.dotcms.cloud. Reproducible on main.

Steps to Reproduce

1. Have a contentlet with a Block Editor field (e.g. a Blog body) with multiple versions whose Block Editor content differs.
2. Open the contentlet → History / Versions.
3. Compare the working version against a previous version.
4. Actual: the Block Editor field renders as a garbled/overlapping diff, and/or the field shows empty / null.
5. Expected: the field renders the same readable comparison the legacy editor produces.

Screenshots: legacy vs new comparison (legacy readable, new garbled), and the field-by-field view showing Body as null.

Root Cause (likely, needs confirmation)

DotContentCompareBlockEditorComponent renders two hidden editor instances ([style.display:none]) purely to convert the field's stored JSON into HTML (TipTap getHTML()); that HTML feeds the visible diff (dotDiff pipe). The feature flag switches which engine does the conversion (dot-block-editor new vs dot-old-block-editor legacy). Two suspects:

Suspect	Detail
HTML shape mismatch	The new editor emits different markup than the legacy editor; the dotDiff pipe mangles it → garbled, overlapping diff.
Empty HTML timing	htmlWorkingValue$ / htmlCompareValue$ are built in ngAfterViewInit, subscribing to the editor's valueChange. If the new editor emits before that subscription (or never re-emits), the HTML stays empty → the null / blank field.

Relevant file: core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-block-editor/dot-content-compare-block-editor.component.{ts,html}

Acceptance Criteria

• History Compare of a Block Editor field renders a readable diff under the new editor, matching what the legacy editor produced.
• The compared field never renders as empty / null when the underlying content is present.
• Added vs removed content is highlighted correctly (no false diffs caused by HTML-shape differences between engines).
• Behavior is verified with FEATURE_FLAG_NEW_BLOCK_EDITOR both ON and OFF (no regression for the legacy path).
• Works for representative Block Editor content: paragraphs, headings, lists, images, and links.

dotCMS Version

main

Severity

Medium - Some functionality impacted

Links

• Related: Enable Block Editor 2.0 by default #36254 (enabled the new Block Editor by default, exposed this)
• Sub-issue of epic Block Editor 3.0: standards, accessibility & feature parity #35262 (Block Editor: standards, accessibility & feature parity)

[github-actions]

PRs linked to this issue

• fix(block-editor): render History Compare diff under the new editor (#36550) by @rjvelazco

[dario-daza]

✅ QA PASSED

Small odd behavior found but it's not related with the block editor.

QA-block-editor-version-comparison.mp4