Setting the file. One moment.
Transitions Test · Product Launch Video · heygen-com/hyperframes · Skills Docs
Back to the top of the page (opens in a new tab)
scripts/ transitions.test.mjs
JavaScript · 68 lines · 3 KB
const
workflowScripts
=
[
9 [ "product-launch-video" , new URL ( "./transitions.mjs" , import . meta .url).pathname],
10 [ "pr-to-video" , new URL ( "../../pr-to-video/scripts/transitions.mjs" , import . meta .url).pathname],
11 ];
12
13 function runInject ( script , rootId ) {
14 const project = mkdtempSync ( join ( tmpdir (), "hf-transition-root-" ));
15 const framesDir = join (project, "compositions" , "frames" );
16 mkdirSync (framesDir, { recursive: true });
17 writeFileSync (
18 join (project, "STORYBOARD.md" ),
19 `--- \n format: 1920x1080 \n --- \n\n ## Frame 1 — First \n\n - duration: 3s \n - transition_in: cut \n - src: compositions/frames/frame-01.html \n\n ## Frame 2 — Second \n\n - duration: 3s \n - transition_in: crossfade 0.5s \n - src: compositions/frames/frame-02.html \n ` ,
20 );
21 writeFileSync (
22 join (framesDir, "frame-01.html" ),
23 `<div data-composition-id="${ rootId }" data-width="1920" data-height="1080"><div class="clip" data-start="0" data-duration="3"></div></div>` ,
24 );
25 writeFileSync (
26 join (framesDir, "frame-02.html" ),
27 '<div data-composition-id="frame-02" data-duration="3"></div>' ,
28 );
29 writeFileSync (
30 join (project, "index.html" ),
31 `<div data-composition-id="main" data-duration="6">
32 <div id="el-frame-01" data-start="0" data-duration="3" data-track-index="0"></div>
33 <div id="el-frame-02" data-start="3" data-duration="3" data-track-index="0"></div>
34 </div><script>window.__timelines = {}; window.__timelines["main"] = gsap.timeline({ paused: true });</script>` ,
35 );
36 const result = spawnSync (
37 process.execPath,
38 [script, "inject" , "--storyboard" , join (project, "STORYBOARD.md" ), "--hyperframes" , project],
39 { encoding: "utf8" },
40 );
41 return {
42 project,
43 result,
44 frameHtml : () => readFileSync ( join (framesDir, "frame-01.html" ), "utf8" ),
45 };
46 }
47
48 for ( const [ workflow , script ] of workflowScripts) {
49 test ( `${ workflow } inserts duration on a valid durationless frame root` , () => {
50 const fixture = runInject (script, "frame-01" );
51 try {
52 assert. equal (fixture.result.status, 0 , fixture.result.stderr);
53 assert. match (fixture. frameHtml (), /data-composition-id="frame-01" [ ^ >] * data-duration="3 \. 5"/ );
54 } finally {
55 rmSync (fixture.project, { recursive: true , force: true });
56 }
57 });
58
59 test ( `${ workflow } still rejects a genuinely mismatched frame root` , () => {
60 const fixture = runInject (script, "wrong-root" );
61 try {
62 assert. notEqual (fixture.result.status, 0 );
63 assert. match (fixture.result.stderr, /has no data-composition-id="frame-01" root/ );
64 } finally {
65 rmSync (fixture.project, { recursive: true , force: true });
66 }
67 });
68 }