mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-04 07:19:52 +00:00
fix(producer): avoid reviving hidden DOM in HDR layers (#1935)
* fix(producer): avoid reviving hidden DOM in HDR layers * fix(producer): filter transition HDR DOM masks * fix(producer): keep hidden timed descendants masked
This commit is contained in:
@@ -8,6 +8,8 @@ import {
|
||||
injectVideoFramesBatch,
|
||||
syncVideoFrameVisibility,
|
||||
shouldDefaultCaptureBeyondViewport,
|
||||
applyDomLayerMask,
|
||||
removeDomLayerMask,
|
||||
} from "./screenshotService.js";
|
||||
|
||||
// Stub a Page + CDPSession just enough that pageScreenshotCapture can call
|
||||
@@ -546,4 +548,54 @@ describe("video-frame injection respects ancestor visibility", () => {
|
||||
expect(seededImg.style.visibility).toBe("hidden");
|
||||
expect(setPropertySpy).toHaveBeenCalledWith("visibility", "hidden", "important");
|
||||
});
|
||||
|
||||
it("applyDomLayerMask does not revive hidden idless timed descendants of a shown layer", async () => {
|
||||
const { window, document } = parseHTML(
|
||||
`<html><head></head><body>
|
||||
<div id="scene" data-start="0" data-duration="6">
|
||||
<div class="label" data-start="4.5" data-duration="1.5">late label</div>
|
||||
</div>
|
||||
</body></html>`,
|
||||
);
|
||||
const scene = document.getElementById("scene") as HTMLElement;
|
||||
const label = document.querySelector(".label") as HTMLElement;
|
||||
label.style.visibility = "hidden";
|
||||
|
||||
Object.defineProperty(window, "getComputedStyle", {
|
||||
configurable: true,
|
||||
value: (el: Element) => ({
|
||||
display: (el as HTMLElement).style.display || "block",
|
||||
visibility: (el as HTMLElement).style.visibility || "visible",
|
||||
}),
|
||||
});
|
||||
|
||||
const globals = globalThis as unknown as {
|
||||
window?: Window;
|
||||
document?: Document;
|
||||
HTMLElement?: typeof HTMLElement;
|
||||
CSS?: typeof CSS;
|
||||
};
|
||||
const previousWindow = globals.window;
|
||||
const previousDocument = globals.document;
|
||||
const previousHTMLElement = globals.HTMLElement;
|
||||
const previousCSS = globals.CSS;
|
||||
globals.window = window;
|
||||
globals.document = document;
|
||||
globals.HTMLElement = window.HTMLElement;
|
||||
globals.CSS = { escape: (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, "\\$&") } as CSS;
|
||||
try {
|
||||
await applyDomLayerMask(passthroughPage(), ["scene"], []);
|
||||
expect(scene.style.visibility || "").toBe("");
|
||||
expect(label.style.visibility).toBe("hidden");
|
||||
|
||||
await removeDomLayerMask(passthroughPage(), []);
|
||||
expect(label.style.visibility).toBe("hidden");
|
||||
expect(label.hasAttribute("data-hf-dom-layer-mask-hidden")).toBe(false);
|
||||
} finally {
|
||||
globals.window = previousWindow;
|
||||
globals.document = previousDocument;
|
||||
globals.HTMLElement = previousHTMLElement;
|
||||
globals.CSS = previousCSS;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user