fix(video): sync the video sink on resize instead of waiting for a frame

[rmounce]

On a window resize, the canvas-style writers (applyManualCanvasStyle / resetCanvasStyle) unconditionally re-show the main canvas and rewrite its box; the active video sink (<video>/worker canvas) is only re-hidden behind it and re-mirrored to the new geometry by the present paths — i.e. on the next decoded frame. On a static remote there is no next frame, so after a resize the stale canvas content (typically the connection-time picture) covers the live sink, correctly scaled — a "freeze-frame" that tracks the window — until motion produces a frame. Reproduced in both Chromium (MSTG sink) and Firefox (worker canvas sink).

Fix: when the active sink has proven it renders, sync it directly from the style writers — mirror the fresh canvas box onto it and re-hide the canvas immediately, no frame required. Warm-up behavior (canvas visible until the sink's first render) is unchanged.

Tested on the LSIO-based image against comprehensive-fixes (da1b55e): resize with a static remote now stays on the live stream in both browsers.

🤖 Generated with Claude Code

[gemini-code-assist]

Code Review

This pull request introduces the syncSinkToCanvasStyle function to synchronize the active video sink's style with the canvas style and hide the canvas immediately once rendering is confirmed. This function is integrated into both applyManualCanvasStyle and resetCanvasStyle. The review feedback highlights a potential state mismatch in syncSinkToCanvasStyle where mstgLastGeom could be incorrectly updated instead of videoWorkerLastGeom if mstgActive is true but videoElement is null. A robust solution was suggested to explicitly track which active flag was used to select the target.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

In syncSinkToCanvasStyle, the target is selected using the condition mstgActive && videoElement. However, the decision of which geom variable to update (mstgLastGeom vs videoWorkerLastGeom) is determined solely by mstgActive. If mstgActive is true but videoElement is null, the target will fall back to the worker target (if videoWorkerActive is true), but mstgLastGeom will still be updated instead of videoWorkerLastGeom.\n\nTo make this logic robust and prevent potential state mismatch, we should explicitly track which active flag was used to select the target (e.g., using an isMstg boolean flag) and use that to update the corresponding geom variable.

function syncSinkToCanvasStyle() {\n  if (!canvas) return;\n  let target = null, rendered = false, isMstg = false;\n  if (mstgActive && videoElement) {\n    target = videoElement;\n    rendered = mstgRendered;\n    isMstg = true;\n  } else if (videoWorkerActive) {\n    target = (videoWorkerMode === 'vtg') ? videoElement : videoWorkerCanvas;\n    rendered = videoWorkerRendered;\n  }\n  if (!target) return;\n  const geom = canvas.style.cssText;   // capture while the canvas is visible\n  target.style.cssText = geom;\n  target.style.display = 'block';\n  target.style.objectFit = 'fill';\n  if (isMstg) mstgLastGeom = geom; else videoWorkerLastGeom = geom;\n  canvasGeomDirty = false;\n  if (rendered) canvas.style.display = 'none';\n}

[ehfd]

Incorporated into #254