@remotion/renderer 4.0.0-alpha8 → 4.0.0-alpha9

package/dist/compositor/compose.d.ts

@@ -1,4 +1,5 @@
 import type { DownloadMap } from '../assets/download-map';
+import type { Compositor } from './compositor';
 import type { CompositorCommand, CompositorCommandSerialized, CompositorImageFormat, Layer } from './payloads';
 declare type CompositorInput = {
     height: number;
@@ -7,9 +8,10 @@ declare type CompositorInput = {
     imageFormat: CompositorImageFormat;
 };
 export declare const serializeCommand: <Type extends keyof CompositorCommand>(command: Type, params: CompositorCommand[Type]) => CompositorCommandSerialized<Type>;
-export declare const compose: ({ height, width, layers, output, downloadMap, imageFormat, }: CompositorInput & {
+export declare const compose: ({ height, width, layers, output, downloadMap, imageFormat, compositor, }: CompositorInput & {
     downloadMap: DownloadMap;
     output: string;
+    compositor: Compositor;
 }) => Promise<void>;
 export declare const callCompositor: (payload: string) => Promise<void>;
 export {};

package/dist/compositor/compose.js

@@ -21,20 +21,19 @@ const serializeCommand = (command, params) => {
     };
 };
 exports.serializeCommand = serializeCommand;
-const compose = async ({ height, width, layers, output, downloadMap, imageFormat, }) => {
+const compose = async ({ height, width, layers, output, downloadMap, imageFormat, compositor, }) => {
     const hash = getCompositorHash({ height, width, layers, imageFormat });
     if (downloadMap.compositorCache[hash]) {
         await (0, promises_1.copyFile)(downloadMap.compositorCache[hash], output);
         return;
     }
-    const payload = (0, exports.serializeCommand)('Compose', {
+    await compositor.executeCommand('Compose', {
         height,
         width,
         layers,
         output,
         output_format: imageFormat,
     });
-    await (0, exports.callCompositor)(JSON.stringify(payload));
     downloadMap.compositorCache[hash] = output;
 };
 exports.compose = compose;

package/dist/compositor/compositor.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="node" />
 import type { CompositorCommand } from './payloads';
-declare type Compositor = {
+export declare type Compositor = {
     finishCommands: () => void;
     executeCommand: <T extends keyof CompositorCommand>(type: T, payload: CompositorCommand[T]) => Promise<Buffer>;
     waitForDone: () => Promise<void>;
@@ -9,4 +9,3 @@ declare type Compositor = {
 export declare const getIdealMaximumFrameCacheItems: () => number;
 export declare const startLongRunningCompositor: (maximumFrameCacheItems: number, verbose: boolean, indent: boolean) => Compositor;
 export declare const startCompositor: <T extends keyof CompositorCommand>(type: T, payload: CompositorCommand[T], indent: boolean) => Compositor;
-export {};

package/dist/get-compositions.d.ts

@@ -5,7 +5,7 @@ import type { BrowserLog } from './browser-log';
 import type { Browser } from './browser/Browser';
 import type { ChromiumOptions } from './open-browser';
 declare type GetCompositionsConfig = {
-    inputProps?: object | null;
+    inputProps?: Record<string, unknown> | null;
     envVariables?: Record<string, string>;
     puppeteerInstance?: Browser;
     onBrowserLog?: (log: BrowserLog) => void;

package/dist/get-compositions.js

@@ -11,6 +11,7 @@ const seek_to_frame_1 = require("./seek-to-frame");
 const set_props_and_env_1 = require("./set-props-and-env");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
 const innerGetCompositions = async (serveUrl, page, config, proxyPort) => {
+    var _a;
     if (config === null || config === void 0 ? void 0 : config.onBrowserLog) {
         page.on('console', (log) => {
             var _a;
@@ -23,7 +24,7 @@ const innerGetCompositions = async (serveUrl, page, config, proxyPort) => {
     }
     (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(config === null || config === void 0 ? void 0 : config.timeoutInMilliseconds);
     await (0, set_props_and_env_1.setPropsAndEnv)({
-        inputProps: config === null || config === void 0 ? void 0 : config.inputProps,
+        inputProps: (_a = config === null || config === void 0 ? void 0 : config.inputProps) !== null && _a !== void 0 ? _a : {},
         envVariables: config === null || config === void 0 ? void 0 : config.envVariables,
         page,
         serveUrl,

package/dist/index.d.ts

@@ -47,6 +47,7 @@ export declare const RenderInternals: {
     }) => Promise<{
         port: number;
         close: () => Promise<void>;
+        compositor: import("./compositor/compositor").Compositor;
     }>;
     validateEvenDimensionsWithCodec: ({ width, height, codec, scale, }: {
         width: number;

package/dist/offthread-video-server.d.ts

@@ -1,6 +1,7 @@
 import type { RequestListener } from 'node:http';
 import type { RenderMediaOnDownload } from './assets/download-and-map-assets-to-file';
 import type { DownloadMap } from './assets/download-map';
+import type { Compositor } from './compositor/compositor';
 export declare const extractUrlAndSourceFromUrl: (url: string) => {
     src: string;
     time: number;
@@ -16,4 +17,5 @@ export declare const startOffthreadVideoServer: ({ onDownload, onError, download
 }) => {
     listener: RequestListener;
     close: () => Promise<void>;
+    compositor: Compositor;
 };

package/dist/offthread-video-server.js

@@ -89,6 +89,7 @@ const startOffthreadVideoServer = ({ onDownload, onError, downloadMap, concurren
                 console.log('Error occurred', err);
             });
         },
+        compositor,
     };
 };
 exports.startOffthreadVideoServer = startOffthreadVideoServer;

package/dist/prepare-server.d.ts

@@ -1,5 +1,6 @@
 import type { RenderMediaOnDownload } from './assets/download-and-map-assets-to-file';
 import type { DownloadMap } from './assets/download-map';
+import type { Compositor } from './compositor/compositor';
 export declare const prepareServer: ({ onDownload, onError, webpackConfigOrServeUrl, port, downloadMap, remotionRoot, concurrency, verbose, indent, }: {
     webpackConfigOrServeUrl: string;
     onDownload: RenderMediaOnDownload;
@@ -14,4 +15,5 @@ export declare const prepareServer: ({ onDownload, onError, webpackConfigOrServe
     serveUrl: string;
     closeServer: (force: boolean) => Promise<unknown>;
     offthreadPort: number;
+    compositor: Compositor;
 }>;

package/dist/prepare-server.js

@@ -11,7 +11,7 @@ const serve_static_1 = require("./serve-static");
 const wait_for_symbolication_error_to_be_done_1 = require("./wait-for-symbolication-error-to-be-done");
 const prepareServer = async ({ onDownload, onError, webpackConfigOrServeUrl, port, downloadMap, remotionRoot, concurrency, verbose, indent, }) => {
     if ((0, is_serve_url_1.isServeUrl)(webpackConfigOrServeUrl)) {
-        const { port: offthreadPort, close: closeProxy } = await (0, serve_static_1.serveStatic)(null, {
+        const { port: offthreadPort, close: closeProxy, compositor: comp, } = await (0, serve_static_1.serveStatic)(null, {
             onDownload,
             onError,
             port,
@@ -27,6 +27,7 @@ const prepareServer = async ({ onDownload, onError, webpackConfigOrServeUrl, por
                 return closeProxy();
             },
             offthreadPort,
+            compositor: comp,
         });
     }
     // Check if the path has a `index.html` file
@@ -35,7 +36,7 @@ const prepareServer = async ({ onDownload, onError, webpackConfigOrServeUrl, por
     if (!exists) {
         throw new Error(`Tried to serve the Webpack bundle on a HTTP server, but the file ${indexFile} does not exist. Is this a valid path to a Webpack bundle?`);
     }
-    const { port: serverPort, close } = await (0, serve_static_1.serveStatic)(webpackConfigOrServeUrl, {
+    const { port: serverPort, close, compositor, } = await (0, serve_static_1.serveStatic)(webpackConfigOrServeUrl, {
         onDownload,
         onError,
         port,
@@ -54,6 +55,7 @@ const prepareServer = async ({ onDownload, onError, webpackConfigOrServeUrl, por
         },
         serveUrl: `http://localhost:${serverPort}`,
         offthreadPort: serverPort,
+        compositor,
     });
 };
 exports.prepareServer = prepareServer;

package/dist/render-frames.d.ts

@@ -14,7 +14,7 @@ declare type RenderFramesOptions = {
     onStart: (data: OnStartData) => void;
     onFrameUpdate: (framesRendered: number, frameIndex: number, timeToRenderInMilliseconds: number) => void;
     outputDir: string | null;
-    inputProps: unknown;
+    inputProps: Record<string, unknown>;
     envVariables?: Record<string, string>;
     imageFormat?: VideoImageFormat;
     /**

package/dist/render-frames.js

@@ -35,7 +35,7 @@ const take_frame_and_compose_1 = require("./take-frame-and-compose");
 const truthy_1 = require("./truthy");
 const validate_scale_1 = require("./validate-scale");
 const MAX_RETRIES_PER_FRAME = 1;
-const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, jpegQuality, quality, imageFormat = image_format_1.DEFAULT_VIDEO_IMAGE_FORMAT, frameRange, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale = 1, actualConcurrency, everyNthFrame = 1, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, }) => {
+const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, jpegQuality, quality, imageFormat = image_format_1.DEFAULT_VIDEO_IMAGE_FORMAT, frameRange, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale = 1, actualConcurrency, everyNthFrame = 1, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, compositor, }) => {
     if (outputDir) {
         if (!node_fs_1.default.existsSync(outputDir)) {
             node_fs_1.default.mkdirSync(outputDir, {
@@ -175,6 +175,7 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, jpeg
             scale,
             downloadMap,
             wantsBuffer: Boolean(onFrameBuffer),
+            compositor,
         });
         if (onFrameBuffer) {
             if (!buffer) {
@@ -217,7 +218,7 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, jpeg
             });
         });
     };
-    const renderFrameAndRetryTargetClose = async (frame, index, retriesLeft, attempt) => {
+    const renderFrameAndRetryTargetClose = async ({ frame, index, retriesLeft, attempt, }) => {
         try {
             await Promise.race([
                 renderFrame(frame, index),
@@ -253,10 +254,20 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, jpeg
                     pool.release(newPage);
                 }
             });
-            await renderFrameAndRetryTargetClose(frame, index, retriesLeft - 1, attempt + 1);
+            await renderFrameAndRetryTargetClose({
+                frame,
+                index,
+                retriesLeft: retriesLeft - 1,
+                attempt: attempt + 1,
+            });
         }
     };
-    const progress = Promise.all(framesToRender.map((frame, index) => renderFrameAndRetryTargetClose(frame, index, MAX_RETRIES_PER_FRAME, 1)));
+    const progress = Promise.all(framesToRender.map((frame, index) => renderFrameAndRetryTargetClose({
+        frame,
+        index,
+        retriesLeft: MAX_RETRIES_PER_FRAME,
+        attempt: 1,
+    })));
     const happyPath = progress.then(() => {
         const firstFrameIndex = countType === 'from-zero' ? 0 : framesToRender[0];
         const returnValue = {
@@ -343,7 +354,7 @@ const renderFrames = (options) => {
                     indent: (_c = options.indent) !== null && _c !== void 0 ? _c : false,
                 }),
                 browserInstance,
-            ]).then(([{ serveUrl, closeServer, offthreadPort }, puppeteerInstance]) => {
+            ]).then(([{ serveUrl, closeServer, offthreadPort, compositor }, puppeteerInstance,]) => {
                 const browserReplacer = (0, replace_browser_1.handleBrowserCrash)(puppeteerInstance);
                 const { stopCycling } = (0, cycle_browser_tabs_1.cycleBrowserTabs)(browserReplacer, actualConcurrency);
                 cleanup.push(stopCycling);
@@ -361,6 +372,7 @@ const renderFrames = (options) => {
                     downloadMap,
                     makeBrowser,
                     browserReplacer,
+                    compositor,
                 });
             }),
         ])

package/dist/render-media.d.ts

@@ -32,7 +32,7 @@ export declare type RenderMediaOptions = {
     outputLocation?: string | null;
     codec: Codec;
     composition: AnySmallCompMetadata;
-    inputProps?: unknown;
+    inputProps?: Record<string, unknown>;
     crf?: number | null;
     imageFormat?: VideoImageFormat;
     pixelFormat?: PixelFormat;

package/dist/render-media.js

@@ -246,7 +246,7 @@ const renderMedia = ({ proResProfile, crf, composition, inputProps, pixelFormat,
                 callUpdate();
                 onStart === null || onStart === void 0 ? void 0 : onStart(data);
             },
-            inputProps,
+            inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
             envVariables,
             imageFormat,
             jpegQuality,

package/dist/render-still.d.ts

@@ -12,7 +12,7 @@ declare type InnerStillOptions = {
     composition: AnySmallCompMetadata;
     output?: string | null;
     frame?: number;
-    inputProps?: unknown;
+    inputProps?: Record<string, unknown>;
     imageFormat?: StillImageFormat;
     /**
      * @deprecated Renamed to `jpegQuality`

package/dist/render-still.js

@@ -47,7 +47,7 @@ const set_props_and_env_1 = require("./set-props-and-env");
 const take_frame_and_compose_1 = require("./take-frame-and-compose");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
 const validate_scale_1 = require("./validate-scale");
-const innerRenderStill = async ({ composition, quality, imageFormat = image_format_1.DEFAULT_STILL_IMAGE_FORMAT, serveUrl, puppeteerInstance, dumpBrowserLogs = false, onError, inputProps, envVariables, output, frame = 0, overwrite = true, browserExecutable, timeoutInMilliseconds, chromiumOptions, scale = 1, proxyPort, cancelSignal, downloadMap, jpegQuality, onBrowserLog, }) => {
+const innerRenderStill = async ({ composition, quality, imageFormat = image_format_1.DEFAULT_STILL_IMAGE_FORMAT, serveUrl, puppeteerInstance, dumpBrowserLogs = false, onError, inputProps, envVariables, output, frame = 0, overwrite = true, browserExecutable, timeoutInMilliseconds, chromiumOptions, scale = 1, proxyPort, cancelSignal, downloadMap, jpegQuality, onBrowserLog, compositor, }) => {
     if (quality) {
         throw new Error('quality has been renamed to jpegQuality. Please rename the option.');
     }
@@ -137,7 +137,7 @@ const innerRenderStill = async ({ composition, quality, imageFormat = image_form
         page.on('console', logCallback);
     }
     await (0, set_props_and_env_1.setPropsAndEnv)({
-        inputProps,
+        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
         envVariables,
         page,
         serveUrl,
@@ -184,6 +184,7 @@ const innerRenderStill = async ({ composition, quality, imageFormat = image_form
         output,
         jpegQuality,
         wantsBuffer: !output,
+        compositor,
     });
     await cleanup();
     return { buffer: output ? null : buffer };
@@ -212,7 +213,7 @@ const renderStill = (options) => {
             verbose: (_b = options.verbose) !== null && _b !== void 0 ? _b : false,
             indent: (_c = options.indent) !== null && _c !== void 0 ? _c : false,
         })
-            .then(({ serveUrl, closeServer, offthreadPort }) => {
+            .then(({ serveUrl, closeServer, offthreadPort, compositor }) => {
             close = closeServer;
             return innerRenderStill({
                 ...options,
@@ -220,6 +221,7 @@ const renderStill = (options) => {
                 onError: (err) => reject(err),
                 proxyPort: offthreadPort,
                 downloadMap,
+                compositor,
             });
         })
             .then((res) => resolve(res))

package/dist/serve-static.d.ts

@@ -1,5 +1,6 @@
 import type { RenderMediaOnDownload } from './assets/download-and-map-assets-to-file';
 import type { DownloadMap } from './assets/download-map';
+import type { Compositor } from './compositor/compositor';
 export declare const serveStatic: (path: string | null, options: {
     port: number | null;
     onDownload: RenderMediaOnDownload;
@@ -12,4 +13,5 @@ export declare const serveStatic: (path: string | null, options: {
 }) => Promise<{
     port: number;
     close: () => Promise<void>;
+    compositor: Compositor;
 }>;

package/dist/serve-static.js

@@ -9,7 +9,7 @@ const get_port_1 = require("./get-port");
 const offthread_video_server_1 = require("./offthread-video-server");
 const serve_handler_1 = require("./serve-handler");
 const serveStatic = async (path, options) => {
-    const { listener: offthreadRequest, close: closeCompositor } = (0, offthread_video_server_1.startOffthreadVideoServer)({
+    const { listener: offthreadRequest, close: closeCompositor, compositor, } = (0, offthread_video_server_1.startOffthreadVideoServer)({
         onDownload: options.onDownload,
         onError: options.onError,
         downloadMap: options.downloadMap,
@@ -87,7 +87,7 @@ const serveStatic = async (path, options) => {
                     }),
                 ]);
             };
-            return { port: selectedPort, close };
+            return { port: selectedPort, close, compositor };
         }
         catch (err) {
             if (!(err instanceof Error)) {

package/dist/set-props-and-env.d.ts

@@ -1,6 +1,6 @@
 import type { Page } from './browser/BrowserPage';
-export declare const setPropsAndEnv: ({ inputProps, envVariables, page, serveUrl, initialFrame, timeoutInMilliseconds, proxyPort, retriesRemaining, audioEnabled, videoEnabled, }: {
-    inputProps: unknown;
+declare type SetPropsAndEnv = {
+    inputProps: Record<string, unknown>;
     envVariables: Record<string, string> | undefined;
     page: Page;
     serveUrl: string;
@@ -10,4 +10,6 @@ export declare const setPropsAndEnv: ({ inputProps, envVariables, page, serveUrl
     retriesRemaining: number;
     audioEnabled: boolean;
     videoEnabled: boolean;
-}) => Promise<void>;
+};
+export declare const setPropsAndEnv: (params: SetPropsAndEnv) => Promise<unknown>;
+export {};

package/dist/set-props-and-env.js

@@ -7,7 +7,7 @@ const normalize_serve_url_1 = require("./normalize-serve-url");
 const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
 const redirect_status_codes_1 = require("./redirect-status-codes");
 const validate_puppeteer_timeout_1 = require("./validate-puppeteer-timeout");
-const setPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, initialFrame, timeoutInMilliseconds, proxyPort, retriesRemaining, audioEnabled, videoEnabled, }) => {
+const innerSetPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, initialFrame, timeoutInMilliseconds, proxyPort, retriesRemaining, audioEnabled, videoEnabled, }) => {
     (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(timeoutInMilliseconds);
     const actualTimeout = timeoutInMilliseconds !== null && timeoutInMilliseconds !== void 0 ? timeoutInMilliseconds : TimeoutSettings_1.DEFAULT_TIMEOUT;
     page.setDefaultTimeout(actualTimeout);
@@ -54,7 +54,7 @@ const setPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, initia
                 resolve();
             }, 2000);
         });
-        return (0, exports.setPropsAndEnv)({
+        return innerSetPropsAndEnv({
             envVariables,
             initialFrame,
             inputProps,
@@ -110,4 +110,14 @@ const setPropsAndEnv = async ({ inputProps, envVariables, page, serveUrl, initia
         }
     }
 };
+const setPropsAndEnv = (params) => {
+    return Promise.race([
+        innerSetPropsAndEnv(params),
+        new Promise((_, reject) => {
+            setTimeout(() => {
+                reject(new Error('Timed out while setting up the headless browser - the browser seems to not respond. This error is thrown to trigger a retry.'));
+            }, 10000);
+        }),
+    ]);
+};
 exports.setPropsAndEnv = setPropsAndEnv;

package/dist/take-frame-and-compose.d.ts

@@ -2,8 +2,9 @@
 import type { TAsset } from 'remotion';
 import type { DownloadMap } from './assets/download-map';
 import type { Page } from './browser/BrowserPage';
+import type { Compositor } from './compositor/compositor';
 import type { StillImageFormat, VideoImageFormat } from './image-format';
-export declare const takeFrameAndCompose: ({ freePage, imageFormat, jpegQuality, frame, width, height, output, scale, downloadMap, wantsBuffer, }: {
+export declare const takeFrameAndCompose: ({ freePage, imageFormat, jpegQuality, frame, width, height, output, scale, downloadMap, wantsBuffer, compositor, }: {
     freePage: Page;
     imageFormat: VideoImageFormat | StillImageFormat;
     jpegQuality: number | undefined;
@@ -14,6 +15,7 @@ export declare const takeFrameAndCompose: ({ freePage, imageFormat, jpegQuality,
     scale: number;
     downloadMap: DownloadMap;
     wantsBuffer: boolean;
+    compositor: Compositor;
 }) => Promise<{
     buffer: Buffer | null;
     collectedAssets: TAsset[];

package/dist/take-frame-and-compose.js

@@ -10,7 +10,7 @@ const compose_1 = require("./compositor/compose");
 const provide_screenshot_1 = require("./provide-screenshot");
 const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
 const truthy_1 = require("./truthy");
-const takeFrameAndCompose = async ({ freePage, imageFormat, jpegQuality, frame, width, height, output, scale, downloadMap, wantsBuffer, }) => {
+const takeFrameAndCompose = async ({ freePage, imageFormat, jpegQuality, frame, width, height, output, scale, downloadMap, wantsBuffer, compositor, }) => {
     var _a;
     const [clipRegion, collectedAssets] = await Promise.all([
         (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
@@ -90,6 +90,7 @@ const takeFrameAndCompose = async ({ freePage, imageFormat, jpegQuality, frame,
             output: needsComposing.finalOutFile,
             downloadMap,
             imageFormat: imageFormat === 'jpeg' ? 'Jpeg' : 'Png',
+            compositor,
         });
         if (wantsBuffer) {
             const buffer = await node_fs_1.default.promises.readFile(needsComposing.finalOutFile);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/renderer",
-  "version": "4.0.0-alpha8",
+  "version": "4.0.0-alpha9",
   "description": "Renderer for Remotion",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -16,9 +16,9 @@
   "dependencies": {
     "execa": "5.1.1",
     "extract-zip": "2.0.1",
-    "remotion": "4.0.0-alpha8",
     "source-map": "^0.8.0-beta.0",
-    "ws": "8.7.0"
+    "ws": "8.7.0",
+    "remotion": "4.0.0-alpha9"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -28,7 +28,7 @@
     "@jonny/eslint-config": "3.0.266",
     "@testing-library/dom": "^8.16.0",
     "@testing-library/react": "13.3.0",
-    "@types/node": "^16.7.5",
+    "@types/node": "18.14.6",
     "@types/progress": "2.0.5",
     "@types/react": "18.0.26",
     "@types/react-dom": "18.0.10",
@@ -38,17 +38,17 @@
     "react": "18.0.0",
     "react-dom": "18.0.0",
     "typescript": "^4.7.0",
-    "vitest": "0.24.3",
+    "vitest": "0.31.1",
     "zod": "^3.21.4"
   },
   "optionalDependencies": {
-    "@remotion/compositor-darwin-arm64": "4.0.0-alpha8",
-    "@remotion/compositor-darwin-x64": "4.0.0-alpha8",
-    "@remotion/compositor-linux-arm64-gnu": "4.0.0-alpha8",
-    "@remotion/compositor-linux-arm64-musl": "4.0.0-alpha8",
-    "@remotion/compositor-linux-x64-gnu": "4.0.0-alpha8",
-    "@remotion/compositor-linux-x64-musl": "4.0.0-alpha8",
-    "@remotion/compositor-win32-x64-msvc": "4.0.0-alpha8"
+    "@remotion/compositor-darwin-arm64": "4.0.0-alpha9",
+    "@remotion/compositor-linux-arm64-gnu": "4.0.0-alpha9",
+    "@remotion/compositor-darwin-x64": "4.0.0-alpha9",
+    "@remotion/compositor-linux-arm64-musl": "4.0.0-alpha9",
+    "@remotion/compositor-win32-x64-msvc": "4.0.0-alpha9",
+    "@remotion/compositor-linux-x64-gnu": "4.0.0-alpha9",
+    "@remotion/compositor-linux-x64-musl": "4.0.0-alpha9"
   },
   "keywords": [
     "remotion",
@@ -61,6 +61,7 @@
     "access": "public"
   },
   "scripts": {
+    "formatting": "prettier src --check",
     "lint": "eslint src --ext ts,tsx",
     "test": "vitest --run",
     "watch": "tsc -w",