fix(runtime): normalize html/body margin in runtime to eliminate white bars in renders

The browser's default 8px body margin was causing white bars at the top
and left edges of rendered videos. Previously normalizePreviewViewport
(a React call on the studio iframe) handled this for preview, but the
render pipeline never called it — creating a preview/render parity gap.

Fix: apply margin:0 / padding:0 / overflow:hidden on documentElement and
body at the start of initSandboxRuntimeModular, so both preview and render
contexts get identical normalization from the same code path.
This commit is contained in:
Miguel Ángel
2026-03-30 23:04:56 +02:00
parent f2ae1f592a
commit 7bd8086387
+15
View File
@@ -32,6 +32,21 @@ export function initSandboxRuntimeModular(): void {
// keep runtime resilient across reinits
}
}
// Normalize html/body so browser defaults (8px margin, white background) never
// bleed into renders as white bars. Runs in both preview and render contexts,
// eliminating the preview/render parity gap that existed when only the React
// component's normalizePreviewViewport call applied this normalization.
if (document.documentElement) {
document.documentElement.style.margin = "0";
document.documentElement.style.padding = "0";
document.documentElement.style.overflow = "hidden";
}
if (document.body) {
document.body.style.margin = "0";
document.body.style.padding = "0";
document.body.style.overflow = "hidden";
}
window.__timelines = window.__timelines || {};
const registerRuntimeCleanup = (callback: () => void) => {
runtimeCleanupCallbacks.push(callback);