r208 Playwright Smoke Report

Status: ✅ 33/33 PASS (all 14 steps green)

Date: 2026-08-30

Branch: feat/id9-r208-integration @ d8e2cca

Repo: avidtech6/vibecoder-standalone

TL;DR

r208 (end-to-end integration of r207 mounts into operator flow) is fully smoke-tested in Vite dev mode. All 14 Playwright steps pass, all 27 unit tests still pass, all 24 r207 unit tests still pass. 3 real bugs were uncovered and fixed during the smoke run; none were caught by unit tests (they were integration-level).

The integration is READY for production deploy pending the r202 Path C iframe removal confirmation (already monkey-patched, see replace-iframe-vsil.js).

What got tested

The smoke is a 14-step end-to-end loop that exercises the operator's full workflow:

1. Load VibeCoder dev server (no page errors)

2. Verify r208 global APIs are exposed (__fvcmsBootR208Integration, __fvcmsGalleryPreviewBridge, __fvcmsStudioContext, PanelManager)

3. Verify the r208 iframe patch is active (mgr.addPanel wrapped to detect fvcms-vsil-panel)

4. Trigger VSIL panel mount → iframe should be REPLACED by r208 mount slot

5. Verify the 3 r207 hosts (PreviewHostVSIL, InspectorHost, CompositionGraphHost) render in their respective tabs

6. Simulate a Gallery card click → composition:host-mounted should fire, data-mounted="true" on PreviewHostVSIL

7. Dispatch composition:host-focus (region focus)

8. InspectorHost should select the focused region (data-active-region="r-smoke")

9. Edit/Lock tab toggle → data-edit-mode="1", data-read-only="0", EditBar renders

10. EditBar transform → region:transformed should fire

11. Lock tab toggle → data-edit-mode="0", data-read-only="1" (a788 READ-ONLY invariant), EditBar unmounts

12. Surface pill click → surface:activated should fire

13. No iframes or injected scripts in the mount tree (security invariant)

14. Loop completes (Gallery → Preview → Desktop → Edit → Lock)

The 3 bugs the smoke caught

Bug 1: r206 init doesn't set `window.__fvcmsStudioContext`

Symptom: Console error: [r208] StudioContext not initialized. Run initWorkspace() first. The orchestrator's getStudioContext() reads window.__fvcmsStudioContext but r206's initWorkspace() only sets window.__fvcmsWorkspace.

Root cause: The r206 context.ts exposes getStudioContext() (line 219) but doesn't write the singleton to window. The r208 orchestrator assumed it was on window.

Fix: r208-integration.ts now calls getStudioContext() from r206 directly (it's exported) and assigns window.__fvcmsStudioContext = ctx after boot, for downstream consumers + Playwright.

Lesson: r206 is a clean module (not a global-state pattern). r208 should bind to its public API (getStudioContext()), not guess at window globals. This is documented in r208-integration.ts header.

Bug 2: Vite HMR bundle does NOT expose React/ReactDOM on `window`

Symptom: Mount slot is empty after r208 boot. Console: [r208] React/ReactDOM not on window; skipping mount.

Root cause: The orchestrator's renderInto and renderEditBarInto used (window as any).React and (window as any).ReactDOM — an assumption that's only true for umd builds, not for ESM Vite HMR bundles.

Fix: r208-integration.ts now imports React from 'react' and createRoot from 'react-dom/client' directly. Standard Vite pattern. Used the same approach in the EditBar mount.

Lesson: r208 was originally written as a "works in any environment" host, but that assumption only held in