fix(render): make WebGL video textures deterministic in headless render (#1403)

* fix(render): make WebGL video textures deterministic in headless render

WebGL compositions that sample a `<video>` as a texture (e.g. a faceted
crystal with clips mapped onto its facets) rendered with flickering,
non-deterministic facets: a video would intermittently show a stale frame or
go black, and the same frame differed between two renders.

Two gaps caused this:

1. No WebGL analog of the WebGPU `patchVideoTextureCompat`. Chrome's headless
   compositor can't feed decoded `<video>` frames to the GPU, so the engine
   injects a decoded `<img class="__render_frame__">` sibling per video each
   frame. The WebGPU `copyExternalImageToTexture` path substitutes it, but
   `texImage2D` / `texSubImage2D` did not — so WebGL uploaded a stale/black
   frame. Add `patchWebGLVideoTextureCompat()` mirroring the WebGPU patch
   (shared `resolveRenderFrameImage` helper).

2. Capture ordering. Per frame the runtime seeks (GPU adapters render on
   `hf-seek`) BEFORE the engine injects the decoded frames, so the GPU render
   read a frame that didn't exist yet. After injecting, the engine now calls
   `window.__hfReseekGpu(t)` — a force-dispatch (`forceDispatchSeekEvent`) that
   bypasses the same-time `hf-seek` dedup — so GPU compositions re-upload their
   textures from the freshly-injected, decoded frames, deterministically.

Tests: unit tests for the texImage2D/texSubImage2D substitution and the
force-dispatch, plus a videoFrameInjector regression test asserting the
post-injection GPU reseek fires only when frames were injected. Verified
end-to-end: a WebGL prism with 8 live <video> facets renders byte-identical
across independent runs with no facet flicker.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

* test(render): add producer render-compat regression for WebGL video textures

A WebGL2 canvas samples a <video> as a texture every hf-seek (the natural
author pattern, distilled from the HeyGen prism). The render-compat harness
renders it and compares against the golden: with the video-texture fix the
render reproduces the decoded frames; revert the fix and the canvas renders
black, collapsing the comparison.

Golden verified to contain real, time-varying video content (not black), so a
regression is caught rather than passing vacuously.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

packages/engine/src/services/videoFrameInjector.test.ts

@@ -202,7 +202,9 @@ describe("createVideoFrameInjector cache hygiene against page-side skips", () =>
     // Pin the contract: when the page returns `[]` (no ids actually
     // injected), the cache must not record those frameIndexes, so a follow-
     // up call at the same frameIndex still issues an inject.
-    const fakePage = {} as Page;
+    // The injector calls page.evaluate after injecting frames (GPU reseek);
+    // stub it so these cache-hygiene cases exercise the real code path.
+    const fakePage = { evaluate: async () => undefined } as unknown as Page;
     const hook = createVideoFrameInjector(
       fakeTable({ videoId: "pip", framePath: "/p", frameIndex: 5 }),
       {
@@ -235,7 +237,9 @@ describe("createVideoFrameInjector cache hygiene against page-side skips", () =>
     // record it and a second call at the same frameIndex must short-circuit.
     // This pins the happy path so a future refactor can't trade the skip
     // bug for a never-cache regression.
-    const fakePage = {} as Page;
+    // The injector calls page.evaluate after injecting frames (GPU reseek);
+    // stub it so these cache-hygiene cases exercise the real code path.
+    const fakePage = { evaluate: async () => undefined } as unknown as Page;
     const hook = createVideoFrameInjector(
       fakeTable({ videoId: "pip", framePath: "/p", frameIndex: 5 }),
       {
@@ -251,4 +255,47 @@ describe("createVideoFrameInjector cache hygiene against page-side skips", () =>
     // Cache hit — no second inject for the same frameIndex.
     expect(injectVideoFramesBatchMock).toHaveBeenCalledTimes(1);
   });
+
+  // Regression: WebGL/WebGPU compositions that sample a <video> as a texture
+  // render on `hf-seek` BEFORE frames are injected. After injecting the
+  // decoded frames, the hook must re-render the GPU adapters at the same time
+  // (window.__hfReseekGpu) so they re-upload their textures from the fresh
+  // frames — otherwise the facet flickers / goes black non-deterministically.
+  it("re-renders GPU adapters after injecting frames (post-injection reseek)", async () => {
+    const evaluate = vi.fn(async () => undefined);
+    const page = { evaluate } as unknown as Page;
+    const hook = createVideoFrameInjector(
+      fakeTable({ videoId: "facet", framePath: "/f", frameIndex: 3 }),
+      { frameSrcResolver: inlineResolver },
+    );
+
+    injectVideoFramesBatchMock.mockResolvedValueOnce(["facet"]);
+    await hook!(page, 1.5);
+
+    expect(evaluate).toHaveBeenCalledTimes(1);
+    // Re-render is requested at the same time as the seek.
+    expect(evaluate.mock.calls[0]![1]).toBe(1.5);
+    // The evaluated page function invokes window.__hfReseekGpu(time).
+    const pageFn = evaluate.mock.calls[0]![0] as (t: number) => void;
+    const reseek = vi.fn();
+    (globalThis as unknown as { window?: unknown }).window = { __hfReseekGpu: reseek };
+    pageFn(1.5);
+    delete (globalThis as unknown as { window?: unknown }).window;
+    expect(reseek).toHaveBeenCalledWith(1.5);
+  });
+
+  it("does not reseek GPU when the page injected no frames", async () => {
+    const evaluate = vi.fn(async () => undefined);
+    const page = { evaluate } as unknown as Page;
+    const hook = createVideoFrameInjector(
+      fakeTable({ videoId: "facet", framePath: "/f", frameIndex: 3 }),
+      { frameSrcResolver: inlineResolver },
+    );
+
+    // Page dropped the video (e.g. hidden host) → nothing injected → no reseek.
+    injectVideoFramesBatchMock.mockResolvedValueOnce([]);
+    await hook!(page, 1.5);
+
+    expect(evaluate).not.toHaveBeenCalled();
+  });
 });