remotion 4.0.199 → 4.0.201

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/loop-validation.test.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+import { render } from '@testing-library/react';
+import { renderToString } from 'react-dom/server';
+import { describe, expect, test } from 'vitest';
+import { Loop } from '../loop/index.js';
+import { expectToThrow } from './expect-to-throw.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+describe('Loop-validation render should throw with invalid props', () => {
+    describe('Throw with invalid durationInFrames prop', () => {
+        test('It should throw if Loop has non-number durationInFrames', () => {
+            expectToThrow(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: '1', children: "hi" }) })), /The "durationInFrames" prop of the <Loop \/> component must be a number, but you passed a value of type string/);
+        });
+        test('It should throw if Loop has non-integer durationInFrames', () => {
+            expect(renderToString(_jsx(WrapSequenceContext, { children: _jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: 1.1, children: "hi" }) }) }))).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex">hi</div>');
+        });
+        test('It should throw if Loop has a negative duration', () => {
+            expectToThrow(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: -1, children: "hi" }) })), /The "durationInFrames" prop of the <Loop \/> component must be positive, but got -1./);
+        });
+    });
+    describe('Throw with invalid times prop', () => {
+        test('It should throw if Loop has non-number times', () => {
+            expectToThrow(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: 50, times: "1", children: "hi" }) })), /You passed to "times" an argument of type string, but it must be a number./);
+        });
+        test('It should throw if Loop has non-integer times', () => {
+            expectToThrow(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: 50, times: 1.1, children: "hi" }) })), /The "times" prop of a loop must be an integer, but got 1.1./);
+        });
+    });
+});
+describe('Should NOT throw with valid props', () => {
+    test('It should allow null as children', () => {
+        expect(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: 50, children: null }) }))).not.toThrow();
+    });
+    test('It should allow undefined as children', () => {
+        expect(() => render(_jsx(WrapSequenceContext, { children: _jsx(Loop, { durationInFrames: 50, children: undefined }) }))).not.toThrow();
+    });
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/measure-spring.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/measure-spring.test.js

@@ -0,0 +1,43 @@
+import { describe, expect, test } from 'vitest';
+import { measureSpring, spring } from '../spring/index.js';
+import { expectToThrow } from './expect-to-throw.js';
+describe('Measure spring should work', () => {
+    const duration = measureSpring({
+        fps: 30,
+    });
+    test('test measureSpring()', () => expect(duration).toBe(28));
+    test('spring should be close to 1', () => expect(spring({
+        fps: 30,
+        frame: duration,
+    })).toBeCloseTo(1));
+    test('spring should not be 1', () => expect(spring({
+        fps: 30,
+        frame: duration - 1,
+    })).not.toBe(1));
+});
+test('Higher threshold should lead to faster spring', () => {
+    expect(measureSpring({ fps: 30, threshold: 0.05 })).toBeLessThan(measureSpring({ fps: 30, threshold: 0.01 }));
+});
+test('Lower threshold should lead to slower spring', () => {
+    expect(measureSpring({ fps: 30, threshold: 0.001 })).toBeGreaterThan(measureSpring({ fps: 30, threshold: 0.01 }));
+});
+describe('Threshold edge cases', () => {
+    // threshold, expected
+    const validEdgeCases = [
+        [0, Infinity],
+        [1, 0],
+    ];
+    validEdgeCases.forEach((entry) => test('', () => expect(measureSpring({ fps: 30, threshold: entry[0] })).toBe(entry[1])));
+    // threshold, errMsg
+    const errorEdgeCases = [
+        [NaN, /Threshold is NaN/],
+        [Infinity, /Threshold is not finite/],
+        [null, /threshold must be a number, got null of type object/],
+    ];
+    errorEdgeCases.forEach((entry) => expectToThrow(
+    // @ts-expect-error
+    () => measureSpring({ fps: 30, threshold: entry[0] }), entry[1]));
+});
+test('Should throw on invalid FPS', () => {
+    expectToThrow(() => measureSpring({ fps: 0 }), /"fps" must be positive, but got 0./);
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/media-validation.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/media-validation.test.js

@@ -0,0 +1,45 @@
+import { describe, expect, test } from 'vitest';
+import { validateMediaProps } from '../validate-media-props.js';
+import { expectToThrow } from './expect-to-throw.js';
+describe('ValidateMediaProps should throw with invalid volume inputs', () => {
+    const testComponents = ['Audio', 'Video'];
+    testComponents.forEach((component) => {
+        test(`It should not allow an ${component} element to have a negative volume `, () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => validateMediaProps({ volume: -1 }, component), new RegExp(`You have passed a volume below 0 to your <${component} /> component. Volume must be between 0 and 1`));
+        });
+        test(`It should not allow an ${component} element to have an invalid type`, () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => validateMediaProps({ volume: 'invalidType' }, component), new RegExp(`You have passed a volume of type string to your <${component} /> component.`));
+        });
+    });
+});
+describe('ValidateMediaProps should not throw with valid volume inputs', () => {
+    const validInputs = [
+        0,
+        1,
+        undefined,
+        () => 1,
+        (x) => x,
+    ];
+    validInputs.forEach((vol) => test(`valid volume ${vol} shold not throw`, () => {
+        // @ts-expect-error
+        expect(() => validateMediaProps({ volume: vol }, 'Video')).not.toThrow();
+    }));
+});
+describe('ValidateMediaProps should throw with invalid playbackRate', () => {
+    test(`It should not allow playbackRate of 0 or below.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: -1 }, 'Audio'), /You have passed a playbackRate of -1 to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow non-finite playbackRate.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: Infinity }, 'Audio'), /You have passed a playbackRate of Infinity to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow NaN playbackRate.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: NaN }, 'Audio'), /You have passed a playbackRate of NaN to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow regular playbackrate.`, () => {
+        expect(() => validateMediaProps({ playbackRate: 1 }, 'Audio')).not.toThrow();
+    });
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/nested-sequences.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/nested-sequences.test.js

@@ -0,0 +1,98 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+/* eslint-disable react/jsx-no-constructed-context-values */
+import { cleanup, render } from '@testing-library/react';
+import { afterEach, expect, test } from 'vitest';
+import { AbsoluteFill } from '../AbsoluteFill.js';
+import { Sequence } from '../Sequence.js';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useCurrentFrame } from '../use-current-frame.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+afterEach(cleanup);
+const getForFrame = (frame, content) => {
+    const { queryByText } = render(_jsx(WrapSequenceContext, { children: _jsx(TimelineContext.Provider, { value: {
+                frame: {
+                    'my-comp': frame,
+                },
+                playing: false,
+                rootId: 'hi',
+                imperativePlaying: {
+                    current: false,
+                },
+                playbackRate: 1,
+                setPlaybackRate: () => {
+                    throw new Error('playback rate');
+                },
+                audioAndVideoTags: {
+                    current: [],
+                },
+            }, children: content }) }));
+    return queryByText;
+};
+test('It should calculate the correct offset in nested sequences', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const Child2 = () => {
+        return (_jsx(Sequence, { from: 1, durationInFrames: 50, children: _jsx(NestedChild, {}) }));
+    };
+    const Child = () => {
+        return (_jsx(Sequence, { from: 10, durationInFrames: 50, children: _jsx(Child2, {}) }));
+    };
+    const content = (_jsx(Sequence, { from: 20, durationInFrames: 100, children: _jsx(Child, {}) }));
+    const result = getForFrame(40, content);
+    expect(result(/^frame9$/i)).not.toBe(null);
+});
+test('Negative offset test', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const content = (_jsx(Sequence, { from: -200, durationInFrames: 300, children: _jsx(Sequence, { from: 10, durationInFrames: 300, children: _jsx(Sequence, { from: 10, durationInFrames: 300, children: _jsx(NestedChild, {}) }) }) }));
+    const result = getForFrame(40, content);
+    expect(result(/^frame220/i)).not.toBe(null);
+});
+test('Nested negative offset test', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const startFrom = 40;
+    const endAt = 90;
+    const content = (_jsx(Sequence, { from: 0 - startFrom, durationInFrames: endAt, children: _jsx(NestedChild, {}) }));
+    const frame0 = getForFrame(0, content);
+    expect(frame0(/^frame40$/i)).not.toBe(null);
+    const frame39 = getForFrame(39, content);
+    expect(frame39(/^frame79$/i)).not.toBe(null);
+    const frame50 = getForFrame(50, content);
+    expect(frame50(/^frame90$/i)).toBe(null);
+});
+test('Negative offset edge case', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const startFrom = 40;
+    const endAt = 90;
+    const content = (_jsx(Sequence, { from: 40, children: _jsx(Sequence, { from: 0 - startFrom, durationInFrames: endAt, children: _jsx(NestedChild, {}) }) }));
+    expect(getForFrame(40, content)(/^frame40$/i)).not.toBe(null);
+    expect(getForFrame(0, content)(/^frame0/i)).toBe(null);
+    expect(getForFrame(10, content)(/^frame10/i)).toBe(null);
+    const atFrame80 = getForFrame(80, content)(/^frame80$/i);
+    expect(atFrame80).not.toBe(null);
+    const atFrame90 = getForFrame(90, content)(/^frame90$/i);
+    expect(atFrame90).toBe(null);
+});
+test('Floats', () => {
+    const content = (_jsxs(AbsoluteFill, { style: { backgroundColor: 'white' }, children: [_jsx(Sequence, { from: 5.1000000000000005, durationInFrames: 128.4, children: _jsx("h1", { children: "One" }) }), _jsx(Sequence, { from: 133.5, durationInFrames: 96.72, children: _jsx("h1", { children: "Two" }) })] }));
+    expect(getForFrame(132, content)(/^One$/i)).not.toBe(null);
+    cleanup();
+    expect(getForFrame(133, content)(/^One$/i)).not.toBe(null);
+    cleanup();
+    expect(getForFrame(133, content)(/^Two$/i)).toBe(null);
+    cleanup();
+    expect(getForFrame(134, content)(/^Two$/i)).not.toBe(null);
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/not-all-props-in-media-tags.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/not-all-props-in-media-tags.test.js

@@ -0,0 +1,28 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { expect, test } from 'vitest';
+// Test for https://github.com/remotion-dev/remotion/issues/1243
+test('Should not have disableRemotePlayback props in the <VideoForPreview> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'video', 'VideoForPreview.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('disableRemotePlayback');
+    expect(read).toContain('./props.js');
+});
+test('Should not have disableRemotePlayback props in the <VideoForPreview> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'video', 'VideoForPreview.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('disableRemotePlayback');
+    expect(read).toContain('./props.js');
+});
+test('Should not have disableRemotePlayback props in the <AudioForPreview> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'audio', 'AudioForPreview.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('aria-disabled');
+    expect(read).toContain('./props.js');
+});
+test('Should not have disableRemotePlayback props in the <AudioForRendering> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'audio', 'AudioForRendering.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('aria-disabled');
+    expect(read).toContain('volume-prop');
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/offthread-props.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/offthread-props.test.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { renderToString } from 'react-dom/server';
+import { expect, test } from 'vitest';
+import { OffthreadVideo } from '../video/index.js';
+test('Passing imageFormat to OffthreadVideo should throw error', () => {
+    expect(() => {
+        renderToString(_jsx(OffthreadVideo, { src: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4", 
+            // @ts-expect-error
+            imageFormat: 'JPEG' }));
+    }).toThrow(`The \`<OffthreadVideo>\` tag does no longer accept \`imageFormat\`. Use the \`transparent\` prop if you want to render a transparent video.`);
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/random.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/random.test.js

@@ -0,0 +1,58 @@
+import { describe, expect, test } from 'vitest';
+import { random } from '../random.js';
+describe('Should support negative random numbers', () => {
+    test('test with -1', () => expect(random(-1)).toBe(random(-1)));
+    test('test with -2', () => expect(random(-2)).toBe(random(-2)));
+    test('different seeds should be different randoms', () => expect(random(-2)).not.toBe(random(-1)));
+});
+test('Random should be deterministic', () => {
+    expect(random(1)).toBe(random(1));
+    expect(random(2)).toBe(random(2));
+    expect(random(2)).not.toBe(random(1));
+    expect(random(null)).not.toBe(random(null));
+});
+describe('Random should be uniform', () => {
+    const ITEM_COUNT = 100000;
+    const mapped = new Array(ITEM_COUNT).fill(true).map((_a, i) => {
+        return random(i);
+    });
+    const average = mapped.reduce((a, b) => a + b, 0) / mapped.length;
+    test('test if average is around 0.5', () => {
+        expect(average).toBeLessThan(0.51);
+        expect(average).toBeGreaterThan(0.49);
+    });
+    const tenPercentSections = [];
+    const stepInterval = 0.1;
+    let currentStep = 0;
+    while (currentStep < 0.999999) {
+        const items = mapped.filter((m) => m >= currentStep && m <= currentStep + stepInterval);
+        tenPercentSections.push(items);
+        currentStep += stepInterval;
+    }
+    const ACCURACY = 0.005;
+    tenPercentSections.forEach((entries, index) => test(`section ${index} should contain around ${ITEM_COUNT * stepInterval} entries`, () => {
+        expect(entries.length).toBeLessThan(ITEM_COUNT * (stepInterval + ACCURACY));
+        expect(entries.length).toBeGreaterThan(ITEM_COUNT * (stepInterval - ACCURACY));
+    }));
+    test('test for average distance', () => {
+        const distances = mapped
+            .map((_a, i) => {
+            if (i === 0) {
+                return null;
+            }
+            return Math.abs(mapped[i] - mapped[i - 1]);
+        })
+            .filter((f) => f !== null);
+        const averageDistance = distances.reduce((a, b) => a + b, 0) / distances.length;
+        expect(averageDistance).toBeGreaterThan(0.3);
+    });
+});
+test('Random string should be uniform', () => {
+    const alphabet = 'abcdefghijlkmnopqrstuvwxyz0123456789';
+    const array = new Array(alphabet.length)
+        .fill(true)
+        .map((_, i) => random(alphabet[i]));
+    const average = array.reduce((a, b) => a + b, 0) / array.length;
+    expect(average).toBeLessThan(0.55);
+    expect(average).toBeGreaterThan(0.45);
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/ready-manager.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/ready-manager.test.js

@@ -0,0 +1,27 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { describe, expect, test } from 'vitest';
+import { continueRender, delayRender } from '../delay-render.js';
+describe('Ready Manager tests', () => {
+    let handle;
+    test('delayRender sets window.remotion_renderReady to false', () => {
+        window.remotion_renderReady = true;
+        handle = delayRender();
+        expect(typeof handle).toBe('number');
+        expect(window.remotion_renderReady).toBe(false);
+    });
+    test('continueRender sets window.remotion_renderReady to true', () => {
+        continueRender(handle);
+        expect(window.remotion_renderReady).toBe(true);
+    });
+    test('Render is only continued if all handles have been finished', () => {
+        handle = delayRender();
+        const handle2 = delayRender();
+        expect(window.remotion_renderReady).toBe(false);
+        continueRender(handle);
+        expect(window.remotion_renderReady).toBe(false);
+        continueRender(handle2);
+        expect(window.remotion_renderReady).toBe(true);
+    });
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/render-hook.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+interface RenderHookOptions<Props> {
+    /**
+     * The argument passed to the renderHook callback. Can be useful if you plan
+     * to use the rerender utility to change the values passed to your hook.
+     */
+    initialProps?: Props;
+    /**
+     * Pass a React Component as the wrapper option to have it rendered around the inner element. This is most useful for creating
+     *  reusable custom render functions for common data providers. See setup for examples.
+     *
+     *  @see https://testing-library.com/docs/react-testing-library/api/#wrapper
+     */
+    wrapper?: React.JSXElementConstructor<{
+        children: React.ReactElement;
+    }>;
+}
+export declare function renderHook<Result, Props>(renderCallback: (initialProps: Props) => Result, options?: RenderHookOptions<Props>): {
+    result: React.RefObject<unknown>;
+    rerender: (rerenderCallbackProps: Props) => void;
+    unmount: () => void;
+};
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/render-hook.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import React from 'react';
+export function renderHook(renderCallback, options = {}) {
+    const { initialProps, wrapper } = options;
+    const result = React.createRef();
+    const TestComponent = ({ renderCallbackProps, }) => {
+        const pendingResult = renderCallback(renderCallbackProps);
+        React.useEffect(() => {
+            // @ts-expect-error
+            result.current = pendingResult;
+        });
+        return null;
+    };
+    const { rerender: baseRerender, unmount } = render(_jsx(TestComponent, { renderCallbackProps: initialProps }), { wrapper });
+    function rerender(rerenderCallbackProps) {
+        return baseRerender(_jsx(TestComponent, { renderCallbackProps: rerenderCallbackProps }));
+    }
+    return { result, rerender, unmount };
+}

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/sequence-from-initial-offset.test.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @vitest-environment jsdom
+ */
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/sequence-from-initial-offset.test.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+import { render } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Freeze } from '../freeze.js';
+import { Sequence } from '../Sequence.js';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useVideoConfig } from '../use-video-config.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+const Inner = () => {
+    const config = useVideoConfig();
+    return _jsx("div", { children: config.durationInFrames });
+};
+const context = {
+    audioAndVideoTags: { current: [] },
+    frame: {
+        'my-comp': 100000,
+    },
+    imperativePlaying: {
+        current: false,
+    },
+    playbackRate: 0,
+    playing: false,
+    rootId: 'hither',
+    setPlaybackRate: () => undefined,
+};
+describe('Composition-validation render should NOT throw with valid props', () => {
+    test('It should allow undefined as children', () => {
+        const { queryByText } = render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(TimelineContext.Provider, { value: context, children: _jsx(Freeze, { frame: 10000, children: _jsx(Sequence, { durationInFrames: 2424, from: 9265, children: _jsx(Inner, {}) }) }) }) }) }));
+        expect(queryByText(/^2424$/)).not.toBe(null);
+    });
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/sequence-validation.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/sequence-validation.test.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+import { render } from '@testing-library/react';
+import { renderToString } from 'react-dom/server';
+import { describe, expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Sequence } from '../Sequence.js';
+import { expectToThrow } from './expect-to-throw.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+describe('Composition-validation render should throw with invalid props', () => {
+    describe('Throw with invalid duration props', () => {
+        test('It should throw if Sequence has non-integer durationInFrames', () => {
+            expect(renderToString(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Sequence, { from: 0, durationInFrames: 1.1, children: "hi" }) }) }))).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex">hi</div>');
+        });
+        test('It should throw if Sequence has negative duration', () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => render(_jsx(Sequence, { from: 0, durationInFrames: -1 })), /durationInFrames must be positive, but got -1/);
+        });
+    });
+    describe('Throw with invalid from props', () => {
+        test('It should throw if "from" props is not a number', () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => render(_jsx(Sequence, { from: '0', durationInFrames: 30 })), /You passed to the "from" props of your <Sequence> an argument of type string, but it must be a number./);
+        });
+    });
+    test('It should throw for invalid layout value', () => {
+        expectToThrow(() => render(
+        // @ts-expect-error
+        _jsx(Sequence, { from: 0, durationInFrames: 100, layout: 'invalid-value' })), /The layout prop of <Sequence \/> expects either "absolute-fill" or "none", but you passed: invalid-value/);
+    });
+});
+describe('Composition-validation render should NOT throw with valid props', () => {
+    test('It should allow null as children', () => {
+        expect(() => render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Sequence, { durationInFrames: 100, from: 0, children: null }) }) }))).not.toThrow();
+    });
+    test('It should allow undefined as children', () => {
+        expect(() => render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Sequence, { durationInFrames: 100, from: 0, children: undefined }) }) }))).not.toThrow();
+    });
+});

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/series.test.d.ts

@@ -0,0 +1 @@
+export {};

package/.rollup.cache/Users/jonathanburger/remotion/packages/core/dist/esm/test/series.test.js

@@ -0,0 +1,119 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { renderToString } from 'react-dom/server';
+import { expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Series } from '../series/index.js';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useCurrentFrame } from '../use-current-frame.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+const First = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'first ' + frame });
+};
+const Second = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'second ' + frame });
+};
+const Third = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'third ' + frame });
+};
+const Fourth = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'fourth ' + frame });
+};
+const renderForFrame = (frame, markup) => {
+    return renderToString(_jsx(CanUseRemotionHooksProvider, { children: _jsx(TimelineContext.Provider, { value: {
+                rootId: '',
+                frame: {
+                    'my-comp': frame,
+                },
+                playing: false,
+                imperativePlaying: {
+                    current: false,
+                },
+                playbackRate: 1,
+                setPlaybackRate: () => {
+                    throw new Error('playback rate');
+                },
+                audioAndVideoTags: { current: [] },
+            }, children: markup }) }));
+};
+test('Basic series test', () => {
+    const outerHTML = renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    expect(outerHTML).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex"><div>third 0</div></div>');
+});
+test('Should support fragments', () => {
+    const outerHtml = renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsxs(_Fragment, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Second, {}) }, "0"), _jsxs(_Fragment, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Third, {}) }, "1"), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Fourth, {}) }, "2")] })] })] }) }));
+    expect(outerHtml).not.toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex"><div>second 1</div></div>');
+});
+test('Should not allow foreign elements', () => {
+    expect(() => {
+        renderForFrame(0, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(First, {}) }) }));
+    }).toThrow(/only accepts a/);
+});
+test('Should allow layout prop', () => {
+    const outerHTML = renderForFrame(0, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, children: _jsx(First, {}) }) }) }));
+    expect(outerHTML).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex"><div>first 0</div></div>');
+    const outerHTML2 = renderForFrame(0, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, layout: "none", children: _jsx(First, {}) }) }) }));
+    expect(outerHTML2).toBe('<div>first 0</div>');
+});
+test('Should render nothing after the end', () => {
+    const outerHTML = renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, children: _jsx(First, {}) }) }) }));
+    expect(outerHTML).toBe('');
+});
+test('Should throw if invalid or no duration provided', () => {
+    expect(() => {
+        renderForFrame(10, _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: NaN, children: _jsx(First, {}) }) }));
+    }).toThrow(/The "durationInFrames" prop of a <Series.Sequence \/> component must be finite, but got NaN./);
+    expect(() => {
+        renderForFrame(10, _jsx(Series, { children: _jsx(Series.Sequence, { children: _jsx(First, {}) }) }));
+    }).toThrow(/The "durationInFrames" prop of a <Series.Sequence \/> component is missing./);
+});
+test('Should allow whitespace', () => {
+    const outerHtml = renderForFrame(11, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(First, {}) }), ' ', _jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(Second, {}) })] }) }));
+    expect(outerHtml).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex"><div>second 1</div></div>');
+});
+test('Handle empty Series.Sequence', () => {
+    expect(() => renderForFrame(11, _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: 10 })] }))).toThrow(/A <Series.Sequence \/> component \(index = 1, duration = 10\) was detected to not have any children\. Delete it to fix this error\./);
+});
+test('Should allow negative overlap prop', () => {
+    const outerHTML = renderForFrame(4, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: -1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) })] }) }));
+    expect(outerHTML).toBe('<div>first 4</div><div>second 0</div>');
+});
+test('Should allow positive overlap prop', () => {
+    const outerHTML = renderForFrame(5, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: 1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) })] }) }));
+    expect(outerHTML).toBe('');
+});
+test('Should disallow NaN as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: NaN, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must not be NaN, but got NaN \(index = 0, duration = 5\)\./);
+});
+test('Should disallow Infinity as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: Infinity, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must be finite, but got Infinity \(index = 0, duration = 5\)\./);
+});
+test('Should disallow non-integer numbers as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: Math.PI, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must be finite, but got 3.141592653589793 \(index = 0, duration = 5\)\./);
+});
+test('Should cascade negative offset props', () => {
+    const outerHTML = renderForFrame(9, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: -1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { layout: "none", durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    expect(outerHTML).toBe('<div>third 0</div>');
+});
+test('Should cascade positive offset props', () => {
+    const outerHTML = renderForFrame(11, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: 1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { layout: "none", durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    expect(outerHTML).toBe('<div>third 0</div>');
+});
+test('Allow durationInFrames as Infinity for last Series.Sequence', () => {
+    const outerHTML = renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { durationInFrames: Infinity, children: _jsx(Third, {}) })] }) }));
+    expect(outerHTML).toBe('<div style="position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex"><div>third 0</div></div>');
+});
+test('Disallow durationInFrames as Infinity for first n-1 Series.Sequence', () => {
+    expect(() => {
+        renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: Infinity, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    }).toThrow(/The "durationInFrames" prop of a <Series.Sequence \/> component must be finite, but got Infinity\./);
+});