ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-11 06:30:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: add regression fixtures with golden baselines + address review

Browse Source 
- Create sub-comp-t0 and sub-comp-id-selector as proper regression tests
  under packages/producer/tests/ with golden MP4 baselines
- Add both to shard-7 in regression.yml
- Add clarifying comment on activateNestedChildTimelines scope
- Confirm test fixture network safety in comment
This commit is contained in:
Miguel Ángel
2026-05-19 15:59:09 -04:00
parent 0d12a465a3
commit e2f7f6a58a
12 changed files with 319 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/producer/tests/sub-comp-id-selector/src/index.html
+48
View File
@@ -0,0 +1,48 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
<style>
body {
margin: 0;
width: 1920px;
height: 1080px;
overflow: hidden;
background: #000;
}
.scene {
position: absolute;
inset: 0;
overflow: hidden;
}
#scene-intro {
opacity: 1;
}
</style>
</head>
<body>
<div
id="root"
data-composition-id="main"
data-start="0"
data-duration="4"
data-width="1920"
data-height="1080"
>
<div
id="scene-intro"
class="scene"
data-composition-id="intro"
data-composition-src="intro.html"
data-start="0"
data-duration="4"
data-track-index="0"
></div>
</div>
<script>
window.__timelines = window.__timelines || {};
window.__timelines["main"] = gsap.timeline({ paused: true });
</script>
</body>
</html>
packages/producer/tests/sub-comp-id-selector/src/intro.html
+42
View File
@@ -0,0 +1,42 @@
<template id="intro-template">
<div id="intro" data-composition-id="intro" data-width="1920" data-height="1080">
<div
class="title"
style="
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 120px;
font-family: Impact, sans-serif;
color: #fff;
opacity: 0;
"
>
HELLO WORLD
</div>
<style>
#intro {
position: relative;
width: 1920px;
height: 1080px;
background: #111;
}
</style>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
<script>
(function () {
window.__timelines = window.__timelines || {};
var tl = gsap.timeline({ paused: true });
var scope = "#intro";
tl.fromTo(
scope + " .title",
{ opacity: 0, y: 50, scale: 0.8 },
{ opacity: 1, y: 0, scale: 1, duration: 0.5, ease: "power3.out" },
0.2,
);
window.__timelines["intro"] = tl;
})();
</script>
</div>
</template>