@remotion/player/dist/cjs/test/validate-prop.test.js

React component for embedding a Remotion preview into your app

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const bun_test_1 = require("bun:test");
const remotion_1 = require("remotion");
const index_js_1 = require("../index.js");
const test_utils_js_1 = require("./test-utils.js");
(0, bun_test_1.test)('no compositionWidth should give errors', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player
        // @ts-expect-error
        , { 
            // @ts-expect-error
            compositionWidth: null, errorFallback: () => 'something went wrong', compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/'compositionWidth' must be a number but got 'object' instead/);
    }
});
(0, bun_test_1.test)('no compositionHeight should give errors', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 400, errorFallback: () => 'something went wrong', 
            // @ts-expect-error
            compositionHeight: undefined, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/'compositionHeight' must be a number but got 'undefined' instead/);
    }
});
(0, bun_test_1.test)('No fps should give errors', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', 
            // @ts-expect-error
            fps: null, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/"fps" must be a number, but you passed a value of type object/);
    }
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', 
            // @ts-expect-error
            fps: undefined, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/"fps" must be a number, but you passed a value of type undefined/);
    }
});
(0, bun_test_1.test)('No durationInFrames should give errors', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', fps: 30, 
            // @ts-expect-error
            durationInFrames: undefined, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/durationInFrames` must be a number, but is undefined/);
    }
});
(0, bun_test_1.test)('Invalid playbackRate should give error', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true, playbackRate: -5, inputProps: {} }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/The lowest possible playback rate is -4. You passed: -5/);
    }
});
(0, bun_test_1.test)('playbackRate of 0 should not be possible', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true, playbackRate: 0 }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/A playback rate of 0 is not supported./);
    }
});
(0, bun_test_1.test)('playbackRate of wrong type should not be possible', () => {
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true, 
            // @ts-expect-error
            playbackRate: 'hi' }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(/A playback rate of 0 is not supported./);
    }
});
(0, bun_test_1.test)('playbackRate of undefined should be okay', () => {
    (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_js_1.HelloWorld, controls: true, showVolumeControls: true }));
    (0, bun_test_1.expect)(true).toBe(true);
});
(0, bun_test_1.test)('passing in <Composition /> instance should not be possible', () => {
    (0, bun_test_1.expect)(() => {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: remotion_1.Composition, controls: true, showVolumeControls: true, inputProps: {
                id: 'HelloWorld',
                width: 500,
                height: 400,
                fps: 30,
                durationInFrames: 500,
                component: test_utils_js_1.HelloWorld,
            } }));
    }).toThrow(/'component' must not be the 'Composition' component\. Pass your own React/);
});
(0, bun_test_1.test)('passing in <Composition /> instance should not be possible', () => {
    (0, bun_test_1.expect)(() => {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, 
            // @ts-expect-error
            component: (0, jsx_runtime_1.jsx)(remotion_1.Composition, { durationInFrames: 30, fps: 30, height: 10, width: 10, id: "hello", component: test_utils_js_1.HelloWorld }), controls: true, showVolumeControls: true, inputProps: {
                id: 'HelloWorld',
                width: 500,
                height: 400,
                fps: 30,
                durationInFrames: 500,
                component: test_utils_js_1.HelloWorld,
            } }));
    }).toThrow(/'component' should not be an instance of <Composition\/>\. Pass the React component dir/);
});
bun_test_1.test.each([
    ['controls'],
    ['loop'],
    ['autoPlay'],
    ['showVolumeControls'],
    ['allowFullscreen'],
    ['clickToPlay'],
    ['doubleClickToFullscreen'],
])('No durationInFrames should give errors %s', (a) => {
    const props = {};
    props[a] = 'hey';
    try {
        (0, test_utils_js_1.render)((0, jsx_runtime_1.jsx)(index_js_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', fps: 30, durationInFrames: 100, component: test_utils_js_1.HelloWorld, ...props }));
    }
    catch (e) {
        (0, bun_test_1.expect)(e.message).toMatch(`'${a}' must be a boolean or undefined but got 'string' instead`);
    }
});