Describe the bug
When rendering a video, the compiler automatically inlines external CDN scripts to ensure deterministic local rendering. Through testing, I found that if the official GSAP library is included inside a nested composition (loaded via data-composition-src and wrapped in a <template>), the compiler incorrectly flags it.
It scans the inlined GSAP source code within the nested template, detects the native requestAnimationFrame function (which GSAP uses internally), and overly aggressively forces the render into the slower "screenshot capture mode with virtual time enabled".
Notably, this issue only occurs in nested compositions. If the exact same GSAP script is inlined in a standalone root composition, the warning is not triggered.
Link to reproduction
https://github.com/heygen-com/hyperframes
Steps to reproduce
- Create a Root composition that loads a nested external composition:
<div id="root" data-composition-id="root" data-width="3840" data-height="2160">
<!-- Loading the nested composition -->
<div id="intro" data-composition-id="intro" data-composition-src="compositions/intro.html" data-start="0"></div>
</div>
- Create the nested composition (
compositions/intro.html) and include the GSAP script inside its <template>:
<template id="intro-template">
<!-- GSAP script included here triggers the warning -->
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
<div data-composition-id="intro" data-width="3840" data-height="2160" data-start="0">
<script>
window.__timelines = window.__timelines || {};
window.__timelines["intro"] = gsap.timeline({ paused: true });
</script>
</div>
</template>
- Run the render command (
npx hyperframes render).
- Check the console output. The compiler inlines the script into the template but throws the warning:
[Compiler] Inlined CDN script: https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js
[WARN] Auto-selected screenshot capture mode for render compatibility {"reasonCodes":["requestAnimationFrame"],"reasons":["Detected raw requestAnimationFrame() in an inline script. This render is routed through screenshot capture mode with virtual time enabled."]}
Expected behavior
The Compiler's parser should behave consistently. If it whitelists/ignores the internal requestAnimationFrame of the official GSAP library in root files, it should apply the same whitelist logic when inlining scripts inside nested <template> compositions.
Actual behavior
[Compiler] Inlined CDN script: https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js
[WARN] Auto-selected screenshot capture mode for render compatibility {"reasonCodes":["requestAnimationFrame"],"reasons":["Detected raw requestAnimationFrame() in an inline script. This render is routed through screenshot capture mode with virtual time enabled."]}
Environment
- Framework: HyperFrames (0.4.12)
- OS: WSL - Ubuntu 24.04.4 LTS
Additional context
No response
Describe the bug
When rendering a video, the compiler automatically inlines external CDN scripts to ensure deterministic local rendering. Through testing, I found that if the official GSAP library is included inside a nested composition (loaded via
data-composition-srcand wrapped in a<template>), the compiler incorrectly flags it.It scans the inlined GSAP source code within the nested template, detects the native
requestAnimationFramefunction (which GSAP uses internally), and overly aggressively forces the render into the slower "screenshot capture mode with virtual time enabled".Notably, this issue only occurs in nested compositions. If the exact same GSAP script is inlined in a standalone root composition, the warning is not triggered.
Link to reproduction
https://github.com/heygen-com/hyperframes
Steps to reproduce
compositions/intro.html) and include the GSAP script inside its<template>:npx hyperframes render).Expected behavior
The Compiler's parser should behave consistently. If it whitelists/ignores the internal
requestAnimationFrameof the official GSAP library in root files, it should apply the same whitelist logic when inlining scripts inside nested<template>compositions.Actual behavior
Environment
Additional context
No response