fix(drawio): restore heading styles inside Graph foreignObjects

[MrCoder]

Summary

DrawIO Textbox shapes were rendering <h1>Heading</h1> indistinguishably from surrounding <p> body text — same 12px Helvetica regular weight, no margin gap. Reproduced on prod Confluence (Full Graph Smoke Test 2026) and locally via the graph-view sandbox.

Root cause

Tailwind's preflight ships this rule globally:

h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit }
blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0 }

DrawIO renders authored HTML inside SVG <foreignObject> elements and relies on UA defaults for heading semantics. The preflight wipes those defaults, so <h1> collapses to inherited body styling.

Fix

src/components/Viewer/GenericViewer.vue — added a non-scoped <style> block that uses font-size: revert; font-weight: revert; margin: revert for h1–h6, p, blockquote inside .screen-capture-content foreignObject. Narrow scope means it only affects diagram canvas content, not the rest of the app.

Permanent local repro

Added cell id=7 (textbox with <h1>Heading</h1><p>Lorem ipsum…</p>) to src/model/Ap/MockedResponse/custom-content-by-id-v1-diagram-graph.json. Visit http://127.0.0.1:8080/index.html?sandbox=graph-view&outputType=display after pnpm start:local.

Verification

• Computed styles after fix: h1 → fontSize 24px, fontWeight 700, margin 16.08px 0 (was 12px / 400 / 0)
• Existing AWS-icon Playwright regression test (viewer-preview-graph-aws-icons.spec.ts) still passes against the updated fixture
• GenericViewer.spec.ts (9 tests) passes
• Lint clean, lite build passes

Test plan

• CI staging E2E green
• On a staging Confluence page, view a Graph macro with a Textbox shape — heading renders bold/larger
• PNG export of the same diagram preserves the heading style

🤖 Generated with Claude Code