@remotion/renderer 4.0.0-webhook.27 → 4.1.0-alpha1

package/dist/seek-to-frame.js

@@ -1,9 +1,55 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.seekToFrame = void 0;
+exports.seekToFrame = exports.waitForReady = void 0;
+const symbolicateable_error_1 = require("./error-handling/symbolicateable-error");
+const parse_browser_error_stack_1 = require("./parse-browser-error-stack");
 const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
+const waitForReady = (page) => {
+    return Promise.race([
+        new Promise((_, reject) => {
+            page.on("disposed" /* PageEmittedEvents.Disposed */, () => {
+                reject(new Error('Target closed (page disposed)'));
+            });
+        }),
+        new Promise((_, reject) => {
+            page.browser.on("closed-silent" /* BrowserEmittedEvents.ClosedSilent */, () => {
+                reject(new Error('Target closed'));
+            });
+        }),
+        page
+            .mainFrame()
+            ._mainWorld.waitForFunction(page.browser, 'window.remotion_renderReady === true')
+            .catch((err) => {
+            throw err;
+        }),
+        page
+            .mainFrame()
+            ._mainWorld.waitForFunction(page.browser, 'window.remotion_cancelledError !== undefined')
+            .then(() => {
+            return (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
+                pageFunction: () => window.remotion_cancelledError,
+                args: [],
+                frame: null,
+                page,
+            });
+        })
+            .then((val) => {
+            if (typeof val !== 'string') {
+                throw val;
+            }
+            throw new symbolicateable_error_1.SymbolicateableError({
+                frame: null,
+                stack: val,
+                name: 'CancelledError',
+                message: val.split('\n')[0],
+                stackFrame: (0, parse_browser_error_stack_1.parseStack)(val.split('\n')),
+            });
+        }),
+    ]);
+};
+exports.waitForReady = waitForReady;
 const seekToFrame = async ({ frame, page, }) => {
-    await page.waitForFunction(page.browser, 'window.ready === true');
+    await (0, exports.waitForReady)(page);
     await (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
         pageFunction: (f) => {
             window.remotion_setFrame(f);
@@ -12,7 +58,7 @@ const seekToFrame = async ({ frame, page, }) => {
         frame,
         page,
     });
-    await page.waitForFunction(page.browser, 'window.ready === true');
+    await (0, exports.waitForReady)(page);
     await page.evaluateHandle('document.fonts.ready');
 };
 exports.seekToFrame = seekToFrame;

package/dist/select-composition.d.ts

@@ -0,0 +1,41 @@
+import type { AnyCompMetadata } from 'remotion';
+import type { BrowserExecutable } from './browser-executable';
+import type { BrowserLog } from './browser-log';
+import type { HeadlessBrowser } from './browser/Browser';
+import type { ChromiumOptions } from './open-browser';
+import type { RemotionServer } from './prepare-server';
+type InternalSelectCompositionsConfig = {
+    inputProps: Record<string, unknown>;
+    envVariables: Record<string, string>;
+    puppeteerInstance: HeadlessBrowser | undefined;
+    onBrowserLog: null | ((log: BrowserLog) => void);
+    browserExecutable: BrowserExecutable | null;
+    timeoutInMilliseconds: number;
+    chromiumOptions: ChromiumOptions;
+    port: number | null;
+    indent: boolean;
+    server: RemotionServer | undefined;
+    verbose: boolean;
+    serveUrl: string;
+    id: string;
+};
+export type SelectCompositionOptions = {
+    inputProps?: Record<string, unknown> | null;
+    envVariables?: Record<string, string>;
+    puppeteerInstance?: HeadlessBrowser;
+    onBrowserLog?: (log: BrowserLog) => void;
+    browserExecutable?: BrowserExecutable;
+    timeoutInMilliseconds?: number;
+    chromiumOptions?: ChromiumOptions;
+    port?: number | null;
+    verbose?: boolean;
+    serveUrl: string;
+    id: string;
+};
+export declare const internalSelectComposition: (options: InternalSelectCompositionsConfig) => Promise<AnyCompMetadata>;
+/**
+ * @description Gets a composition defined in a Remotion project based on a Webpack bundle.
+ * @see [Documentation](https://www.remotion.dev/docs/renderer/select-composition)
+ */
+export declare const selectComposition: (options: SelectCompositionOptions) => Promise<AnyCompMetadata>;
+export {};

package/dist/select-composition.js

@@ -0,0 +1,156 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.selectComposition = exports.internalSelectComposition = void 0;
+const TimeoutSettings_1 = require("./browser/TimeoutSettings");
+const handle_javascript_exception_1 = require("./error-handling/handle-javascript-exception");
+const find_closest_package_json_1 = require("./find-closest-package-json");
+const get_browser_instance_1 = require("./get-browser-instance");
+const logger_1 = require("./logger");
+const prepare_server_1 = require("./prepare-server");
+const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
+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 innerSelectComposition = async ({ page, onBrowserLog, inputProps, envVariables, serveUrl, timeoutInMilliseconds, port, id, indent, verbose, }) => {
+    if (onBrowserLog) {
+        page.on('console', (log) => {
+            onBrowserLog({
+                stackTrace: log.stackTrace(),
+                text: log.text,
+                type: log.type,
+            });
+        });
+    }
+    (0, validate_puppeteer_timeout_1.validatePuppeteerTimeout)(timeoutInMilliseconds);
+    await (0, set_props_and_env_1.setPropsAndEnv)({
+        inputProps,
+        envVariables,
+        page,
+        serveUrl,
+        initialFrame: 0,
+        timeoutInMilliseconds,
+        proxyPort: port,
+        retriesRemaining: 2,
+        audioEnabled: false,
+        videoEnabled: false,
+    });
+    await (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
+        page,
+        pageFunction: () => {
+            window.remotion_setBundleMode({
+                type: 'evaluation',
+            });
+        },
+        frame: null,
+        args: [],
+    });
+    await (0, seek_to_frame_1.waitForReady)(page);
+    logger_1.Log.verboseAdvanced({
+        indent,
+        tag: 'selectComposition()',
+        logLevel: verbose ? 'verbose' : 'info',
+    }, 'Running calculateMetadata()...');
+    const time = Date.now();
+    const result = await (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
+        pageFunction: (_id) => {
+            return window.remotion_calculateComposition(_id);
+        },
+        frame: null,
+        page,
+        args: [id],
+    });
+    logger_1.Log.verboseAdvanced({
+        indent,
+        tag: 'selectComposition()',
+        logLevel: verbose ? 'verbose' : 'info',
+    }, `calculateMetadata() took ${Date.now() - time}ms`);
+    return result;
+};
+const internalSelectComposition = async (options) => {
+    const cleanup = [];
+    const { puppeteerInstance, browserExecutable, chromiumOptions, serveUrl: serveUrlOrWebpackUrl, verbose, indent, port, envVariables, id, inputProps, onBrowserLog, server, timeoutInMilliseconds, } = options;
+    const { page, cleanup: cleanupPage } = await (0, get_browser_instance_1.getPageAndCleanupFn)({
+        passedInInstance: puppeteerInstance,
+        browserExecutable,
+        chromiumOptions,
+        context: null,
+        forceDeviceScaleFactor: undefined,
+        indent,
+        shouldDumpIo: verbose,
+    });
+    cleanup.push(() => cleanupPage());
+    return new Promise((resolve, reject) => {
+        const onError = (err) => reject(err);
+        cleanup.push((0, handle_javascript_exception_1.handleJavascriptException)({
+            page,
+            frame: null,
+            onError,
+        }));
+        (0, prepare_server_1.makeOrReuseServer)(options.server, {
+            webpackConfigOrServeUrl: serveUrlOrWebpackUrl,
+            port,
+            remotionRoot: (0, find_closest_package_json_1.findRemotionRoot)(),
+            concurrency: 1,
+            verbose,
+            indent,
+        }, {
+            onDownload: () => undefined,
+            onError,
+        })
+            .then(({ server: { serveUrl, offthreadPort, sourceMap }, cleanupServer }) => {
+            page.setBrowserSourceMapContext(sourceMap);
+            cleanup.push(() => cleanupServer(true));
+            return innerSelectComposition({
+                serveUrl,
+                page,
+                port: offthreadPort,
+                browserExecutable,
+                chromiumOptions,
+                envVariables,
+                id,
+                inputProps,
+                onBrowserLog,
+                timeoutInMilliseconds,
+                verbose,
+                indent,
+                puppeteerInstance,
+                server,
+            });
+        })
+            .then((comp) => {
+            return resolve(comp);
+        })
+            .catch((err) => {
+            reject(err);
+        })
+            .finally(() => {
+            cleanup.forEach((c) => {
+                c();
+            });
+        });
+    });
+};
+exports.internalSelectComposition = internalSelectComposition;
+/**
+ * @description Gets a composition defined in a Remotion project based on a Webpack bundle.
+ * @see [Documentation](https://www.remotion.dev/docs/renderer/select-composition)
+ */
+const selectComposition = (options) => {
+    const { id, serveUrl, browserExecutable, chromiumOptions, envVariables, inputProps, onBrowserLog, port, puppeteerInstance, timeoutInMilliseconds, verbose, } = options;
+    return (0, exports.internalSelectComposition)({
+        id,
+        serveUrl,
+        browserExecutable: browserExecutable !== null && browserExecutable !== void 0 ? browserExecutable : null,
+        chromiumOptions: chromiumOptions !== null && chromiumOptions !== void 0 ? chromiumOptions : {},
+        envVariables: envVariables !== null && envVariables !== void 0 ? envVariables : {},
+        inputProps: inputProps !== null && inputProps !== void 0 ? inputProps : {},
+        onBrowserLog: onBrowserLog !== null && onBrowserLog !== void 0 ? onBrowserLog : null,
+        port: port !== null && port !== void 0 ? port : null,
+        puppeteerInstance,
+        timeoutInMilliseconds: timeoutInMilliseconds !== null && timeoutInMilliseconds !== void 0 ? timeoutInMilliseconds : TimeoutSettings_1.DEFAULT_TIMEOUT,
+        verbose: verbose !== null && verbose !== void 0 ? verbose : false,
+        indent: false,
+        server: undefined,
+    });
+};
+exports.selectComposition = selectComposition;

package/dist/serve-handler/index.d.ts

@@ -1,4 +1,4 @@
-import type { IncomingMessage, ServerResponse } from 'http';
+import type { IncomingMessage, ServerResponse } from 'node:http';
 export declare const serveHandler: (request: IncomingMessage, response: ServerResponse, config: {
     public: string;
 }) => Promise<void>;

package/dist/serve-handler/index.js

@@ -4,15 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.serveHandler = void 0;
-const fs_1 = require("fs");
-const path_1 = __importDefault(require("path"));
-const url_1 = __importDefault(require("url"));
+const node_fs_1 = require("node:fs");
+const node_path_1 = __importDefault(require("node:path"));
+const node_url_1 = __importDefault(require("node:url"));
 const mime_types_1 = require("../mime-types");
 // Packages
 const is_path_inside_1 = require("./is-path-inside");
 const range_parser_1 = require("./range-parser");
 const getHeaders = (absolutePath, stats) => {
-    const { base } = path_1.default.parse(absolutePath);
+    const { base } = node_path_1.default.parse(absolutePath);
     let defaultHeaders = {};
     if (stats) {
         defaultHeaders = {
@@ -28,19 +28,19 @@ const getHeaders = (absolutePath, stats) => {
     return defaultHeaders;
 };
 const getPossiblePaths = (relativePath, extension) => [
-    path_1.default.join(relativePath, `index${extension}`),
+    node_path_1.default.join(relativePath, `index${extension}`),
     relativePath.endsWith('/')
         ? relativePath.replace(/\/$/g, extension)
         : relativePath + extension,
-].filter((item) => path_1.default.basename(item) !== extension);
+].filter((item) => node_path_1.default.basename(item) !== extension);
 const findRelated = async (current, relativePath) => {
     const possible = getPossiblePaths(relativePath, '.html');
     let stats = null;
     for (let index = 0; index < possible.length; index++) {
         const related = possible[index];
-        const absolutePath = path_1.default.join(current, related);
+        const absolutePath = node_path_1.default.join(current, related);
         try {
-            stats = await fs_1.promises.lstat(absolutePath);
+            stats = await node_fs_1.promises.lstat(absolutePath);
         }
         catch (err) {
             if (err.code !== 'ENOENT' &&
@@ -59,10 +59,11 @@ const findRelated = async (current, relativePath) => {
 };
 const sendError = (absolutePath, response, spec) => {
     const { message, statusCode } = spec;
-    response.statusCode = statusCode;
     const headers = getHeaders(absolutePath, null);
-    response.writeHead(statusCode, headers);
-    response.setHeader('content-type', 'application/json');
+    response.writeHead(statusCode, {
+        ...headers,
+        'Content-Type': 'application/json',
+    });
     response.end(JSON.stringify({ statusCode, message }));
 };
 const internalError = (absolutePath, response) => {
@@ -74,10 +75,10 @@ const internalError = (absolutePath, response) => {
 };
 const serveHandler = async (request, response, config) => {
     const cwd = process.cwd();
-    const current = path_1.default.resolve(cwd, config.public);
+    const current = node_path_1.default.resolve(cwd, config.public);
     let relativePath = null;
     try {
-        relativePath = decodeURIComponent(url_1.default.parse(request.url).pathname);
+        relativePath = decodeURIComponent(node_url_1.default.parse(request.url).pathname);
     }
     catch (err) {
         return sendError('/', response, {
@@ -86,7 +87,7 @@ const serveHandler = async (request, response, config) => {
             message: 'Bad Request',
         });
     }
-    let absolutePath = path_1.default.join(current, relativePath);
+    let absolutePath = node_path_1.default.join(current, relativePath);
     // Prevent path traversal vulnerabilities. We could do this
     // by ourselves, but using the package covers all the edge cases.
     if (!(0, is_path_inside_1.isPathInside)(absolutePath, current)) {
@@ -108,9 +109,9 @@ const serveHandler = async (request, response, config) => {
     // directory exists requires loading all the file paths and then checking if
     // one of them includes the path of the directory. As that's a very
     // performance-expensive thing to do, we need to ensure it's not happening if not really necessary.
-    if (path_1.default.extname(relativePath) !== '') {
+    if (node_path_1.default.extname(relativePath) !== '') {
         try {
-            stats = await fs_1.promises.lstat(absolutePath);
+            stats = await node_fs_1.promises.lstat(absolutePath);
         }
         catch (err) {
             if (err.code !== 'ENOENT' &&
@@ -123,7 +124,8 @@ const serveHandler = async (request, response, config) => {
         try {
             const related = await findRelated(current, relativePath);
             if (related) {
-                ({ stats, absolutePath } = related);
+                stats = related.stats;
+                absolutePath = related.absolutePath;
             }
         }
         catch (err) {
@@ -133,7 +135,7 @@ const serveHandler = async (request, response, config) => {
             }
         }
         try {
-            stats = await fs_1.promises.lstat(absolutePath);
+            stats = await node_fs_1.promises.lstat(absolutePath);
         }
         catch (err) {
             if (err.code !== 'ENOENT' &&
@@ -188,7 +190,7 @@ const serveHandler = async (request, response, config) => {
     }
     let stream = null;
     try {
-        stream = (0, fs_1.createReadStream)(absolutePath, streamOpts !== null && streamOpts !== void 0 ? streamOpts : {});
+        stream = (0, node_fs_1.createReadStream)(absolutePath, streamOpts !== null && streamOpts !== void 0 ? streamOpts : {});
     }
     catch (err) {
         return internalError(absolutePath, response);

package/dist/serve-handler/is-path-inside.js

@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isPathInside = void 0;
-const path_1 = __importDefault(require("path"));
+const node_path_1 = __importDefault(require("node:path"));
 const isPathInside = function (thePath, potentialParent) {
     // For inside-directory checking, we want to allow trailing slashes, so normalize.
     thePath = stripTrailingSep(thePath);
@@ -15,12 +15,12 @@ const isPathInside = function (thePath, potentialParent) {
         potentialParent = potentialParent.toLowerCase();
     }
     return (thePath.lastIndexOf(potentialParent, 0) === 0 &&
-        (thePath[potentialParent.length] === path_1.default.sep ||
+        (thePath[potentialParent.length] === node_path_1.default.sep ||
             thePath[potentialParent.length] === undefined));
 };
 exports.isPathInside = isPathInside;
 function stripTrailingSep(thePath) {
-    if (thePath[thePath.length - 1] === path_1.default.sep) {
+    if (thePath[thePath.length - 1] === node_path_1.default.sep) {
         return thePath.slice(0, -1);
     }
     return thePath;

package/dist/serve-static.d.ts

@@ -1,14 +1,16 @@
-import type { RenderMediaOnDownload } from './assets/download-and-map-assets-to-file';
 import type { DownloadMap } from './assets/download-map';
-import type { FfmpegExecutable } from './ffmpeg-executable';
+import type { Compositor } from './compositor/compositor';
+import type { OffthreadVideoServerEmitter } from './offthread-video-server';
 export declare const serveStatic: (path: string | null, options: {
     port: number | null;
-    ffmpegExecutable: FfmpegExecutable;
-    ffprobeExecutable: FfmpegExecutable;
-    onDownload: RenderMediaOnDownload;
-    onError: (err: Error) => void;
     downloadMap: DownloadMap;
+    remotionRoot: string;
+    concurrency: number;
+    verbose: boolean;
+    indent: boolean;
 }) => Promise<{
     port: number;
     close: () => Promise<void>;
+    compositor: Compositor;
+    events: OffthreadVideoServerEmitter;
 }>;

package/dist/serve-static.js

@@ -4,76 +4,102 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.serveStatic = void 0;
-const http_1 = __importDefault(require("http"));
+const node_http_1 = __importDefault(require("node:http"));
 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) => {
-    var _a;
-    const port = await (0, get_port_1.getDesiredPort)((_a = options === null || options === void 0 ? void 0 : options.port) !== null && _a !== void 0 ? _a : undefined, 3000, 3100);
-    const offthreadRequest = (0, offthread_video_server_1.startOffthreadVideoServer)({
-        ffmpegExecutable: options.ffmpegExecutable,
-        ffprobeExecutable: options.ffprobeExecutable,
-        onDownload: options.onDownload,
-        onError: options.onError,
+    const { listener: offthreadRequest, close: closeCompositor, compositor, events, } = (0, offthread_video_server_1.startOffthreadVideoServer)({
         downloadMap: options.downloadMap,
+        concurrency: options.concurrency,
+        verbose: options.verbose,
+        indent: options.indent,
     });
-    try {
-        const connections = {};
-        const server = http_1.default
-            .createServer((request, response) => {
-            var _a;
-            if ((_a = request.url) === null || _a === void 0 ? void 0 : _a.startsWith('/proxy')) {
-                return offthreadRequest(request, response);
-            }
-            if (path === null) {
-                response.writeHead(404);
-                response.end('Server only supports /proxy');
-                return;
+    const connections = {};
+    const server = node_http_1.default.createServer((request, response) => {
+        var _a;
+        if ((_a = request.url) === null || _a === void 0 ? void 0 : _a.startsWith('/proxy')) {
+            return offthreadRequest(request, response);
+        }
+        if (path === null) {
+            response.writeHead(404);
+            response.end('Server only supports /proxy');
+            return;
+        }
+        (0, serve_handler_1.serveHandler)(request, response, {
+            public: path,
+        }).catch(() => {
+            if (!response.headersSent) {
+                response.writeHead(500);
             }
-            (0, serve_handler_1.serveHandler)(request, response, {
-                public: path,
-            }).catch(() => {
-                response.statusCode = 500;
-                response.end('Error serving file');
-            });
-        })
-            .listen(port);
-        server.on('connection', (conn) => {
-            const key = conn.remoteAddress + ':' + conn.remotePort;
-            connections[key] = conn;
-            conn.on('close', () => {
-                delete connections[key];
-            });
+            response.end('Error serving file');
+        });
+    });
+    server.on('connection', (conn) => {
+        const key = conn.remoteAddress + ':' + conn.remotePort;
+        connections[key] = conn;
+        conn.on('close', () => {
+            delete connections[key];
         });
-        const destroyConnections = function () {
-            for (const key in connections)
-                connections[key].destroy();
-        };
-        const close = () => {
-            return new Promise((resolve, reject) => {
-                destroyConnections();
-                server.close((err) => {
-                    if (err) {
-                        if (err.code === 'ERR_SERVER_NOT_RUNNING') {
-                            return resolve();
-                        }
+    });
+    let selectedPort = null;
+    const maxTries = 5;
+    for (let i = 0; i < maxTries; i++) {
+        try {
+            selectedPort = await new Promise((resolve, reject) => {
+                var _a;
+                (0, get_port_1.getDesiredPort)((_a = options === null || options === void 0 ? void 0 : options.port) !== null && _a !== void 0 ? _a : undefined, 3000, 3100)
+                    .then(({ port, didUsePort }) => {
+                    server.listen(port);
+                    server.on('listening', () => {
+                        resolve(port);
+                        return didUsePort();
+                    });
+                    server.on('error', (err) => {
                         reject(err);
-                    }
-                    else {
-                        resolve();
-                    }
-                });
+                    });
+                })
+                    .catch((err) => reject(err));
             });
-        };
-        return { port, close };
-    }
-    catch (err) {
-        console.log({ err, msg: err.message });
-        if (err.message.includes('EADDRINUSE')) {
-            return (0, exports.serveStatic)(path, options);
+            const destroyConnections = function () {
+                for (const key in connections)
+                    connections[key].destroy();
+            };
+            const close = async () => {
+                await Promise.all([
+                    closeCompositor(),
+                    new Promise((resolve, reject) => {
+                        destroyConnections();
+                        server.close((err) => {
+                            if (err) {
+                                if (err.code ===
+                                    'ERR_SERVER_NOT_RUNNING') {
+                                    return resolve();
+                                }
+                                reject(err);
+                            }
+                            else {
+                                resolve();
+                            }
+                        });
+                    }),
+                ]);
+            };
+            return { port: selectedPort, close, compositor, events };
+        }
+        catch (err) {
+            if (!(err instanceof Error)) {
+                throw err;
+            }
+            const codedError = err;
+            if (codedError.code === 'EADDRINUSE') {
+                // Already in use, try another port
+            }
+            else {
+                throw err;
+            }
         }
-        throw err;
     }
+    throw new Error(`Tried ${maxTries} times to find a free port. Giving up.`);
 };
 exports.serveStatic = serveStatic;

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;
+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 {};