fix(dashboard): give remaining srcDoc frames a compositing layer (#8075)

[CrysisDeu]

Summary

Follow-up enumeration to the compositing-promotion class: three remaining sandboxed srcDoc iframes carried no compositing-layer promotion, so an engine could lay the document out, run its scripts and report a correct height while rasterizing nothing — a skipped first paint renders blank.

• McpAppFrame — the full-screen MCP app overlay, where a skipped paint is a blank viewport with no error state. transform: 'translateZ(0)' joins the script-reported height in the iframe's style object.
• BoardFrame + BoardThumb (pptx-maker) — both frames carried a 2D scale(...) only, which makes a stacking context but does not force layer promotion. translateZ(0) is composed onto the scale (scale(...) translateZ(0)), never replacing it: the scale is each frame's whole geometry, and transformOrigin is unchanged. Same composition as the merged gallery-thumbnail precedent in ArtifactThumbs.
• HtmlViewer (FileRenderers) — plain srcDoc preview, plain style={{ transform: 'translateZ(0)' }}, consistent with sibling renderers.

The sandbox attributes are untouched on all three sites (allow-scripts allow-forms on McpAppFrame; empty sandbox on the board frames and HtmlViewer), and the HtmlViewer test now pins the empty sandbox alongside the promotion.

Evidence

This is a compositing hint with no visual delta in a healthy renderer, so a screenshot cannot demonstrate the fix. The per-site style assertions are the evidence instead, mirroring the existing promotion tests:

Why no screenshot: the change is a compositing hint (translateZ(0)) with zero visual delta in a healthy renderer — the defect it prevents (a skipped first paint) is nondeterministic and cannot be staged for a capture, so the pinned style assertions below are the evidence.

• McpAppFrame.test.tsx — pins transform: translateZ(0) and that the script-reported height sizing survives.
• PptxMakerPage.test.tsx — pins scale(...) translateZ(0) on both board frames (measurement pinned so the scaled frame mounts in jsdom), that the scale survives the composition, and that transformOrigin stays top left.
• FileRenderers.test.tsx — pins the HtmlViewer promotion and the empty sandbox.

Deliberately no registry or enumerating test for the class — each site pins only its own style.

Testing

• npx tsc -b — clean
• npx eslint on all six changed files — clean
• Diff-scoped brand gate — clean
• Vitest runs in CI (per-site assertions above are new)

Notes

A local review pass flagged one Low advisory: promoting the intrinsic-height BoardFrame iframe asks the compositor for a 1920 × (1080+gap)·slides layer on long decks — a bounded GPU-memory cost traded for a certain blank-frame bug, and Chromium tiles composited layers. If it ever shows up in profiling, the promotion can move to the fixed-size clipping wrapper instead.

Pattern harvest

Rule candidate: a sandboxed srcDoc iframe must carry compositing-layer promotion (translateZ(0), composed onto any existing scale(...) rather than replacing it) — a 2D transform alone makes a stacking context but does not force promotion, and an unpromoted frame can skip its first paint and render blank. This PR closes the last three known sites of the class; a new srcDoc frame added without promotion re-opens it, so the pattern is a reviewable rule candidate for website/AUTOSDE.yaml.

Closes #8075

[github-actions]

UX Review (Fable 5) — ✅ PASS

UX-level review of 38a1ba6014ec261944f8856b1fedc3aac593c193 — updated in place on each push. A BLOCK verdict blocks PR readiness; PASS/CONCERNS are advisory.

This PR is a pure rendering fix — adding translateZ(0) compositing-layer promotion to three sandboxed srcDoc iframes so they can't skip their first paint and render blank. No user-facing strings, controls, layout, or flows change; the rest of the diff is tests pinning the styles. Nothing crosses any UX lens.

UX-Verdict: PASS

Invisible-by-design fix that removes a blank-frame failure; no strings, controls, or layout change, so there is no new surface to misread.

[UX-REVIEWED] 38a1ba6

[github-actions]

Design Review (Fable 5) — ✅ PASS

Design-level review of 38a1ba6014ec261944f8856b1fedc3aac593c193 — updated in place on each push. A BLOCK verdict blocks PR readiness; PASS/CONCERNS are advisory.

Design-Verdict: PASS

Applies the already-merged compositing-promotion remedy to the three remaining srcDoc sites, composed onto existing transforms with the geometry and sandbox contracts pinned.

[DESIGN-REVIEWED] 38a1ba6

[github-actions]

Opus 4.8 Review — ✅ no blocking findings

Reviewed 38a1ba6014ec261944f8856b1fedc3aac593c193 — this comment is updated in place on each push.

Review details

No findings.

[OPUS-REVIEWED] 38a1ba6

Verdict parsed from the review's SHA-scoped output markers for commit 38a1ba6014ec261944f8856b1fedc3aac593c193.

False positive or not applicable? A repository writer can comment:
/ai-review override fable 38a1ba6014ec261944f8856b1fedc3aac593c193: <one-sentence reason>

[github-actions]

GPT 5.6 Review — ✅ no blocking findings

GPT 5.6 completed its review of 38a1ba6014ec261944f8856b1fedc3aac593c193 and found no blocking issues.

This comment is updated in place on each push.

Review details

No findings.
[GPT-REVIEWED] 38a1ba6

False positive or not applicable? A repository writer can comment:
/ai-review override gpt 38a1ba6014ec261944f8856b1fedc3aac593c193: <one-sentence reason>

[github-actions]

First Principles Review (Fable 5) — ✅ PASS

Premise-level review of 38a1ba6014ec261944f8856b1fedc3aac593c193 — why this exists and whether the shipped surface is the smallest honest version. Updated in place on each push. A BLOCK verdict blocks PR readiness; PASS/CONCERNS are advisory.

All evidence gathered. The class is fully enumerated: of the five srcDoc iframe render sites in website/src (AgentPanel, mochi WidgetFrame, HtmlViewer, McpAppFrame, BoardFrame ×2), two were already promoted and this PR fixes the remaining three. The per-site inline-style remedy is the pattern the repo already recorded (ArtifactBody, WidgetFrame, ArtifactThumbs, RemoteArtifactDetailPage, the #7931 topbar rule), and a global CSS rule could not cover the two frames whose inline transform carries their scale geometry. No new public surface, no config keys, every item declared in the description.

First-Principles-Verdict: PASS

Completes an already-established fix class at every remaining site, with zero srcDoc frames left unpromoted and no new surface shipped.

What this change ships

Intent: stop three preview frames rendering blank when the engine skips their first paint — a FIX.

1. MCP app overlay no longer renders as a blank viewport — justified
2. Slide-board preview paints reliably, scale geometry untouched — justified
3. Slide-board thumbnail paints reliably, scale untouched — justified
4. HTML file preview paints reliably — justified
5. Per-site tests pin each promotion (and HtmlViewer's empty sandbox) — justified

Sibling count, grepped srcDoc render sites under website/src: 5 total; AgentPanel and mochi's WidgetFrame were already promoted, the other 3 are exactly this PR — 0 unfixed siblings remain. Duplication check, grepped translateZ(0): the per-site inline remedy is the repo's recorded pattern (ArtifactBody.tsx:459, WidgetFrame.tsx:629, ArtifactThumbs.tsx:184, RemoteArtifactDetailPage.tsx:377); a single global iframe[srcdoc] rule cannot replace it because inline scale(...) transforms on the board frames would override it — the subtractive alternative fails on exactly the frames that need composition. Root cause (engine paint-skip) is a platform behavior out of repo scope; mechanism level is the reachable floor, and the description says so. Framing matches the diff, including the disclosed GPU-cost trade-off.

[FIRST-PRINCIPLES-REVIEWED] 38a1ba6