@remotion/cli 4.0.136 → 4.0.137

package/dist/benchmark.js

@@ -4,6 +4,7 @@ exports.benchmarkCommand = void 0;
 const renderer_1 = require("@remotion/renderer");
 const client_1 = require("@remotion/renderer/client");
 const no_react_1 = require("remotion/no-react");
+const browser_download_bar_1 = require("./browser-download-bar");
 const chalk_1 = require("./chalk");
 const cleanup_before_quit_1 = require("./cleanup-before-quit");
 const config_1 = require("./config");
@@ -123,14 +124,27 @@ const benchmarkCommand = async (remotionRoot, args, logLevel) => {
         ignoreCertificateErrors,
         userAgent,
     };
+    const onBrowserDownload = (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+        indent: false,
+        logLevel,
+        quiet: (0, parse_command_line_1.quietFlagProvided)(),
+    });
+    const indent = false;
+    await renderer_1.RenderInternals.internalEnsureBrowser({
+        browserExecutable,
+        indent,
+        logLevel,
+        onBrowserDownload,
+    });
     const browserInstance = renderer_1.RenderInternals.internalOpenBrowser({
         browser: 'chrome',
         browserExecutable,
         chromiumOptions,
         forceDeviceScaleFactor: scale,
-        indent: false,
+        indent,
         viewport: null,
         logLevel,
+        onBrowserDownload,
     });
     const { urlOrBundle: bundleLocation, cleanup: cleanupBundle } = await (0, setup_cache_1.bundleOnCliOrTakeServeUrl)({
         fullPath: fullEntryPoint,
@@ -182,6 +196,7 @@ const benchmarkCommand = async (remotionRoot, args, logLevel) => {
         binariesDirectory: binariesDirectoryOption.getValue({
             commandLine: parse_command_line_1.parsedCli,
         }).value,
+        onBrowserDownload,
     });
     const ids = (remainingArgs[0]
         ? remainingArgs[0]
@@ -322,6 +337,7 @@ const benchmarkCommand = async (remotionRoot, args, logLevel) => {
                     commandLine: parse_command_line_1.parsedCli,
                 }).value,
                 compositionStart: 0,
+                onBrowserDownload,
             }, (run, progress) => {
                 benchmarkProgress.update(makeBenchmarkProgressBar({
                     totalRuns: runs,

package/dist/browser/ensure.d.ts

@@ -0,0 +1,3 @@
+import type { LogLevel } from '@remotion/renderer';
+export declare const ENSURE_COMMAND = "ensure";
+export declare const ensureCommand: (logLevel: LogLevel) => Promise<void>;

package/dist/browser/ensure.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ensureCommand = exports.ENSURE_COMMAND = void 0;
+const renderer_1 = require("@remotion/renderer");
+const browser_download_bar_1 = require("../browser-download-bar");
+const get_cli_options_1 = require("../get-cli-options");
+const log_1 = require("../log");
+const parse_command_line_1 = require("../parse-command-line");
+exports.ENSURE_COMMAND = 'ensure';
+const ensureCommand = async (logLevel) => {
+    const { browserExecutable } = (0, get_cli_options_1.getCliOptions)({
+        isStill: false,
+        logLevel,
+    });
+    const indent = false;
+    const status = await (0, renderer_1.ensureBrowser)({
+        browserExecutable,
+        logLevel,
+        onBrowserDownload: (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+            indent,
+            logLevel,
+            quiet: (0, parse_command_line_1.quietFlagProvided)(),
+        }),
+    });
+    if (status.type === 'no-browser') {
+        throw new Error('should have downloaded browser');
+    }
+    if (status.type === 'user-defined-path') {
+        log_1.Log.info({ indent, logLevel }, `Has browser at ${status.path}`);
+        return;
+    }
+    if (status.type === 'local-browser') {
+        log_1.Log.info({ indent, logLevel }, `Has browser at ${status.path}`);
+        return;
+    }
+    if (status.type === 'local-puppeteer-browser') {
+        log_1.Log.info({ indent, logLevel }, `Has browser at ${status.path}`);
+    }
+};
+exports.ensureCommand = ensureCommand;

package/dist/browser/index.d.ts

@@ -0,0 +1,3 @@
+import type { LogLevel } from '@remotion/renderer';
+export declare const BROWSER_COMMAND = "browser";
+export declare const browserCommand: (args: string[], logLevel: LogLevel) => Promise<void> | undefined;

package/dist/browser/index.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.browserCommand = exports.BROWSER_COMMAND = void 0;
+const chalk_1 = require("../chalk");
+const log_1 = require("../log");
+const ensure_1 = require("./ensure");
+exports.BROWSER_COMMAND = 'browser';
+const printHelp = (logLevel) => {
+    log_1.Log.info({ indent: false, logLevel });
+    log_1.Log.info({ indent: false, logLevel }, chalk_1.chalk.blue(`remotion ${exports.BROWSER_COMMAND}`));
+    log_1.Log.info({ indent: false, logLevel });
+    log_1.Log.info({ indent: false, logLevel }, 'Available commands:');
+    log_1.Log.info({ indent: false, logLevel }, '');
+    log_1.Log.info({ indent: false, logLevel }, `remotion ${exports.BROWSER_COMMAND} ${ensure_1.ENSURE_COMMAND}`);
+    log_1.Log.info({ indent: false, logLevel }, chalk_1.chalk.gray('Ensure Remotion has a browser to render.'));
+};
+const browserCommand = (args, logLevel) => {
+    if (args[0] === ensure_1.ENSURE_COMMAND) {
+        return (0, ensure_1.ensureCommand)(logLevel);
+    }
+    printHelp(logLevel);
+};
+exports.browserCommand = browserCommand;

package/dist/browser-download-bar.d.ts

@@ -0,0 +1,6 @@
+import type { LogLevel, OnBrowserDownload } from '@remotion/renderer';
+export declare const defaultBrowserDownloadProgress: ({ indent, logLevel, quiet, }: {
+    indent: boolean;
+    logLevel: LogLevel;
+    quiet: boolean;
+}) => OnBrowserDownload;

package/dist/browser-download-bar.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultBrowserDownloadProgress = void 0;
+const renderer_1 = require("@remotion/renderer");
+const chalk_1 = require("./chalk");
+const log_1 = require("./log");
+const make_progress_bar_1 = require("./make-progress-bar");
+const progress_bar_1 = require("./progress-bar");
+const should_use_non_overlaying_logger_1 = require("./should-use-non-overlaying-logger");
+const truthy_1 = require("./truthy");
+const makeDownloadProgress = ({ bytesDownloaded, totalBytes, doneIn, }) => {
+    const progress = bytesDownloaded / totalBytes;
+    return [
+        `    +`,
+        (0, make_progress_bar_1.makeProgressBar)(progress),
+        `${doneIn ? 'Got' : 'Getting'} Headless Shell`,
+        doneIn === null
+            ? (progress * 100).toFixed(0) + '%'
+            : chalk_1.chalk.gray(`${doneIn}ms`),
+    ]
+        .filter(truthy_1.truthy)
+        .join(' ');
+};
+const defaultBrowserDownloadProgress = ({ indent, logLevel, quiet, }) => {
+    return () => {
+        log_1.Log.info({ indent, logLevel }, 'No local browser could be found.');
+        log_1.Log.info({ indent, logLevel }, 'Downloading Chrome Headless Shell https://www.remotion.dev/chrome-headless-shell');
+        const updatesDontOverwrite = (0, should_use_non_overlaying_logger_1.shouldUseNonOverlayingLogger)({ logLevel });
+        if (updatesDontOverwrite) {
+            let lastProgress = 0;
+            return {
+                version: null,
+                onProgress: (progress) => {
+                    if (progress.downloadedBytes > lastProgress + 10000000) {
+                        lastProgress = progress.downloadedBytes;
+                        log_1.Log.info({ indent, logLevel }, `Getting Headless Shell - ${renderer_1.RenderInternals.toMegabytes(progress.downloadedBytes)}/${renderer_1.RenderInternals.toMegabytes(progress.totalSizeInBytes)}`);
+                    }
+                    if (progress.percent === 1) {
+                        log_1.Log.info({ indent, logLevel }, `Got Headless Shell`);
+                    }
+                },
+            };
+        }
+        const cliOutput = (0, progress_bar_1.createOverwriteableCliOutput)({
+            quiet,
+            indent,
+            cancelSignal: null,
+            updatesDontOverwrite,
+        });
+        const startedAt = Date.now();
+        let doneIn = null;
+        return {
+            version: null,
+            onProgress: (progress) => {
+                if (progress.percent === 1) {
+                    doneIn = Date.now() - startedAt;
+                }
+                cliOutput.update(makeDownloadProgress({
+                    doneIn,
+                    bytesDownloaded: progress.downloadedBytes,
+                    totalBytes: progress.totalSizeInBytes,
+                }), false);
+            },
+        };
+    };
+};
+exports.defaultBrowserDownloadProgress = defaultBrowserDownloadProgress;

package/dist/compositions.js

@@ -4,6 +4,7 @@ exports.listCompositionsCommand = void 0;
 const renderer_1 = require("@remotion/renderer");
 const client_1 = require("@remotion/renderer/client");
 const no_react_1 = require("remotion/no-react");
+const browser_download_bar_1 = require("./browser-download-bar");
 const cleanup_before_quit_1 = require("./cleanup-before-quit");
 const preview_server_1 = require("./config/preview-server");
 const entry_point_1 = require("./entry-point");
@@ -93,6 +94,11 @@ const listCompositionsCommand = async (remotionRoot, args, logLevel) => {
         server: undefined,
         offthreadVideoCacheSizeInBytes,
         binariesDirectory,
+        onBrowserDownload: (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+            indent: false,
+            logLevel,
+            quiet: (0, parse_command_line_1.quietFlagProvided)(),
+        }),
     });
     (0, print_compositions_1.printCompositions)(compositions, logLevel);
 };

package/dist/get-composition-id.d.ts

@@ -1,6 +1,6 @@
-import type { BrowserExecutable, ChromiumOptions, HeadlessBrowser, LogLevel, RemotionServer } from '@remotion/renderer';
+import type { BrowserExecutable, ChromiumOptions, HeadlessBrowser, LogLevel, OnBrowserDownload, RemotionServer } from '@remotion/renderer';
 import type { VideoConfig } from 'remotion';
-export declare const getCompositionId: ({ args, compositionIdFromUi, serializedInputPropsWithCustomSchema, puppeteerInstance, envVariables, timeoutInMilliseconds, chromiumOptions, port, browserExecutable, serveUrlOrWebpackUrl, logLevel, indent, server, offthreadVideoCacheSizeInBytes, binariesDirectory, }: {
+export declare const getCompositionId: ({ args, compositionIdFromUi, serializedInputPropsWithCustomSchema, puppeteerInstance, envVariables, timeoutInMilliseconds, chromiumOptions, port, browserExecutable, serveUrlOrWebpackUrl, logLevel, indent, server, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, }: {
     args: string[];
     compositionIdFromUi: string | null;
     serializedInputPropsWithCustomSchema: string;
@@ -16,6 +16,7 @@ export declare const getCompositionId: ({ args, compositionIdFromUi, serializedI
     server: RemotionServer;
     offthreadVideoCacheSizeInBytes: number | null;
     binariesDirectory: string | null;
+    onBrowserDownload: OnBrowserDownload;
 }) => Promise<{
     compositionId: string;
     reason: string;

package/dist/get-composition-id.js

@@ -16,7 +16,7 @@ const getCompName = ({ cliArgs, compositionIdFromUi, }) => {
     const [compName, ...remainingArgs] = cliArgs;
     return { compName, remainingArgs, reason: 'Passed as argument' };
 };
-const getCompositionId = async ({ args, compositionIdFromUi, serializedInputPropsWithCustomSchema, puppeteerInstance, envVariables, timeoutInMilliseconds, chromiumOptions, port, browserExecutable, serveUrlOrWebpackUrl, logLevel, indent, server, offthreadVideoCacheSizeInBytes, binariesDirectory, }) => {
+const getCompositionId = async ({ args, compositionIdFromUi, serializedInputPropsWithCustomSchema, puppeteerInstance, envVariables, timeoutInMilliseconds, chromiumOptions, port, browserExecutable, serveUrlOrWebpackUrl, logLevel, indent, server, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, }) => {
     const { compName, remainingArgs, reason: compReason, } = getCompName({
         cliArgs: args,
         compositionIdFromUi,
@@ -38,6 +38,7 @@ const getCompositionId = async ({ args, compositionIdFromUi, serializedInputProp
             onBrowserLog: null,
             offthreadVideoCacheSizeInBytes,
             binariesDirectory,
+            onBrowserDownload,
         });
         if (propsSize > 10000000) {
             log_1.Log.warn({
@@ -71,6 +72,7 @@ const getCompositionId = async ({ args, compositionIdFromUi, serializedInputProp
             serializedInputPropsWithCustomSchema,
             offthreadVideoCacheSizeInBytes,
             binariesDirectory,
+            onBrowserDownload,
         });
         const { compositionId, reason } = await (0, show_compositions_picker_1.showSingleCompositionsPicker)(comps, logLevel);
         if (compositionId && typeof compositionId === 'string') {

package/dist/get-composition-with-dimension-override.d.ts

@@ -1,6 +1,6 @@
-import type { BrowserExecutable, ChromiumOptions, HeadlessBrowser, LogLevel, RemotionServer } from '@remotion/renderer';
+import type { BrowserExecutable, ChromiumOptions, HeadlessBrowser, LogLevel, OnBrowserDownload, RemotionServer } from '@remotion/renderer';
 import type { VideoConfig } from 'remotion';
-export declare const getCompositionWithDimensionOverride: ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, }: {
+export declare const getCompositionWithDimensionOverride: ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, }: {
     height: number | null;
     width: number | null;
     args: string[];
@@ -18,6 +18,7 @@ export declare const getCompositionWithDimensionOverride: ({ height, width, args
     server: RemotionServer;
     offthreadVideoCacheSizeInBytes: number | null;
     binariesDirectory: string | null;
+    onBrowserDownload: OnBrowserDownload;
 }) => Promise<{
     compositionId: string;
     reason: string;

package/dist/get-composition-with-dimension-override.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCompositionWithDimensionOverride = void 0;
 const get_composition_id_1 = require("./get-composition-id");
-const getCompositionWithDimensionOverride = async ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, }) => {
+const getCompositionWithDimensionOverride = async ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, }) => {
     const returnValue = await (0, get_composition_id_1.getCompositionId)({
         args,
         compositionIdFromUi,
@@ -19,6 +19,7 @@ const getCompositionWithDimensionOverride = async ({ height, width, args, compos
         server,
         offthreadVideoCacheSizeInBytes,
         binariesDirectory,
+        onBrowserDownload,
     });
     return {
         ...returnValue,

package/dist/gpu.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.gpuCommand = exports.GPU_COMMAND = void 0;
 const renderer_1 = require("@remotion/renderer");
 const client_1 = require("@remotion/renderer/client");
+const browser_download_bar_1 = require("./browser-download-bar");
 const chalk_1 = require("./chalk");
 const get_cli_options_1 = require("./get-cli-options");
 const log_1 = require("./log");
@@ -38,6 +39,11 @@ const gpuCommand = async (logLevel) => {
         logLevel,
         chromiumOptions,
         timeoutInMilliseconds: puppeteerTimeout,
+        onBrowserDownload: (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+            indent: false,
+            logLevel,
+            quiet: (0, parse_command_line_1.quietFlagProvided)(),
+        }),
     });
     for (const { feature, status } of statuses) {
         log_1.Log.info({ indent: false, logLevel }, `${feature}: ${colorStatus(status)}`);

package/dist/index.d.ts

@@ -202,7 +202,7 @@ export declare const CliInternals: {
     shouldUseNonOverlayingLogger: ({ logLevel, }: {
         logLevel: "verbose" | "info" | "warn" | "error";
     }) => boolean;
-    getCompositionWithDimensionOverride: ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, }: {
+    getCompositionWithDimensionOverride: ({ height, width, args, compositionIdFromUi, chromiumOptions, envVariables, port, puppeteerInstance, timeoutInMilliseconds, browserExecutable, serveUrlOrWebpackUrl, indent, serializedInputPropsWithCustomSchema, logLevel, server, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, }: {
         height: number | null;
         width: number | null;
         args: string[];
@@ -220,10 +220,16 @@ export declare const CliInternals: {
         server: import("@remotion/renderer").RemotionServer;
         offthreadVideoCacheSizeInBytes: number | null;
         binariesDirectory: string | null;
+        onBrowserDownload: import("@remotion/renderer").OnBrowserDownload;
     }) => Promise<{
         compositionId: string;
         reason: string;
         config: import("remotion").VideoConfig;
         argsAfterComposition: string[];
     }>;
+    defaultBrowserDownloadProgress: ({ indent, logLevel, quiet, }: {
+        indent: boolean;
+        logLevel: "verbose" | "info" | "warn" | "error";
+        quiet: boolean;
+    }) => import("@remotion/renderer").OnBrowserDownload;
 };

package/dist/index.js

@@ -5,8 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CliInternals = exports.cli = void 0;
 const renderer_1 = require("@remotion/renderer");
+const studio_server_1 = require("@remotion/studio-server");
 const minimist_1 = __importDefault(require("minimist"));
 const benchmark_1 = require("./benchmark");
+const browser_1 = require("./browser");
+const browser_download_bar_1 = require("./browser-download-bar");
 const bundle_1 = require("./bundle");
 const chalk_1 = require("./chalk");
 const cleanup_before_quit_1 = require("./cleanup-before-quit");
@@ -103,6 +106,9 @@ const cli = async () => {
         else if (command === versions_1.VERSIONS_COMMAND) {
             await (0, versions_1.versionsCommand)(remotionRoot, logLevel);
         }
+        else if (command === browser_1.BROWSER_COMMAND) {
+            await (0, browser_1.browserCommand)(args, logLevel);
+        }
         else if (command === 'benchmark') {
             await (0, benchmark_1.benchmarkCommand)(remotionRoot, args, logLevel);
         }
@@ -130,7 +136,6 @@ const cli = async () => {
     }
 };
 exports.cli = cli;
-const studio_server_1 = require("@remotion/studio-server");
 exports.CliInternals = {
     createOverwriteableCliOutput: progress_bar_1.createOverwriteableCliOutput,
     chalk: chalk_1.chalk,
@@ -153,4 +158,5 @@ exports.CliInternals = {
     listOfRemotionPackages: list_of_remotion_packages_1.listOfRemotionPackages,
     shouldUseNonOverlayingLogger: should_use_non_overlaying_logger_1.shouldUseNonOverlayingLogger,
     getCompositionWithDimensionOverride: get_composition_with_dimension_override_1.getCompositionWithDimensionOverride,
+    defaultBrowserDownloadProgress: browser_download_bar_1.defaultBrowserDownloadProgress,
 };

package/dist/render-flows/render.js

@@ -33,6 +33,7 @@ const node_fs_1 = __importStar(require("node:fs"));
 const node_os_1 = __importDefault(require("node:os"));
 const node_path_1 = __importDefault(require("node:path"));
 const no_react_1 = require("remotion/no-react");
+const browser_download_bar_1 = require("../browser-download-bar");
 const chalk_1 = require("../chalk");
 const config_1 = require("../config");
 const get_cli_options_1 = require("../get-cli-options");
@@ -50,6 +51,17 @@ const user_passed_output_location_1 = require("../user-passed-output-location");
 const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel, browserExecutable, browser, chromiumOptions, scale, shouldOutputImageSequence, publicDir, envVariables, puppeteerTimeout, port, height, width, remainingArgs, compositionIdFromUi, entryPointReason, overwrite, quiet, concurrency, frameRange, everyNthFrame, outputLocationFromUI, jpegQuality, onProgress, addCleanupCallback, cancelSignal, crf, uiCodec, uiImageFormat, ffmpegOverride, audioBitrate, muted, enforceAudioTrack, proResProfile, x264Preset, pixelFormat, videoBitrate, encodingMaxRate, encodingBufferSize, numberOfGifLoops, audioCodec, serializedInputPropsWithCustomSchema, disallowParallelEncoding, offthreadVideoCacheSizeInBytes, colorSpace, repro, binariesDirectory, forSeamlessAacConcatenation, separateAudioTo, publicPath, }) => {
     var _a;
     const downloads = [];
+    const onBrowserDownload = (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+        indent,
+        logLevel,
+        quiet: (0, parse_command_line_1.quietFlagProvided)(),
+    });
+    await renderer_1.RenderInternals.internalEnsureBrowser({
+        browserExecutable,
+        indent,
+        logLevel,
+        onBrowserDownload,
+    });
     const browserInstance = renderer_1.RenderInternals.internalOpenBrowser({
         browser,
         browserExecutable,
@@ -58,6 +70,7 @@ const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel,
         indent,
         viewport: null,
         logLevel,
+        onBrowserDownload,
     });
     let isUsingParallelEncoding = false;
     const updatesDontOverwrite = (0, should_use_non_overlaying_logger_1.shouldUseNonOverlayingLogger)({ logLevel });
@@ -168,6 +181,7 @@ const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel,
         server,
         offthreadVideoCacheSizeInBytes,
         binariesDirectory,
+        onBrowserDownload,
     });
     const { value: codec, source: codecReason } = client_1.BrowserSafeApis.options.videoCodecOption.getValue({
         commandLine: parse_command_line_1.parsedCli,
@@ -268,6 +282,7 @@ const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel,
             binariesDirectory,
             compositionStart: 0,
             forSeamlessAacConcatenation,
+            onBrowserDownload,
         });
         updateRenderProgress({ newline: true, printToConsole: true });
         log_1.Log.info({ indent, logLevel }, chalk_1.chalk.blue(`▶ ${absoluteOutputFile}`));
@@ -353,6 +368,7 @@ const renderVideoFlow = async ({ remotionRoot, fullEntryPoint, indent, logLevel,
         separateAudioTo: absoluteSeparateAudioTo,
         forSeamlessAacConcatenation,
         compositionStart: 0,
+        onBrowserDownload,
     });
     log_1.Log.info({ indent, logLevel }, chalk_1.chalk.blue(`${exists ? '○' : '+'} ${absoluteOutputFile}`));
     if (absoluteSeparateAudioTo) {

package/dist/render-flows/still.js

@@ -9,6 +9,7 @@ const renderer_1 = require("@remotion/renderer");
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
 const no_react_1 = require("remotion/no-react");
+const browser_download_bar_1 = require("../browser-download-bar");
 const chalk_1 = require("../chalk");
 const cleanup_before_quit_1 = require("../cleanup-before-quit");
 const config_1 = require("../config");
@@ -50,6 +51,17 @@ const renderStillFlow = async ({ remotionRoot, fullEntryPoint, entryPointReason,
         }
         onProgress({ message, value: progress, ...aggregate });
     };
+    const onBrowserDownload = (0, browser_download_bar_1.defaultBrowserDownloadProgress)({
+        quiet: (0, parse_command_line_1.quietFlagProvided)(),
+        indent,
+        logLevel,
+    });
+    await renderer_1.RenderInternals.internalEnsureBrowser({
+        browserExecutable,
+        indent,
+        logLevel,
+        onBrowserDownload,
+    });
     const browserInstance = renderer_1.RenderInternals.internalOpenBrowser({
         browser,
         browserExecutable,
@@ -58,6 +70,7 @@ const renderStillFlow = async ({ remotionRoot, fullEntryPoint, entryPointReason,
         indent,
         viewport: null,
         logLevel,
+        onBrowserDownload,
     });
     const { cleanup: cleanupBundle, urlOrBundle } = await (0, setup_cache_1.bundleOnCliOrTakeServeUrl)({
         fullPath: fullEntryPoint,
@@ -123,6 +136,7 @@ const renderStillFlow = async ({ remotionRoot, fullEntryPoint, entryPointReason,
         server,
         offthreadVideoCacheSizeInBytes,
         binariesDirectory,
+        onBrowserDownload,
     });
     const { format: imageFormat, source } = (0, determine_image_format_1.determineFinalStillImageFormat)({
         cliFlag: (_a = parse_command_line_1.parsedCli['image-format']) !== null && _a !== void 0 ? _a : null,
@@ -196,6 +210,7 @@ const renderStillFlow = async ({ remotionRoot, fullEntryPoint, entryPointReason,
         }).serializedString,
         offthreadVideoCacheSizeInBytes,
         binariesDirectory,
+        onBrowserDownload,
     });
     aggregate.rendering = {
         frames: 1,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/cli",
-  "version": "4.0.136",
+  "version": "4.0.137",
   "description": "CLI for Remotion",
   "main": "dist/index.js",
   "sideEffects": false,
@@ -32,13 +32,13 @@
     "dotenv": "9.0.2",
     "minimist": "1.2.6",
     "prompts": "2.4.2",
-    "@remotion/bundler": "4.0.136",
-    "@remotion/media-utils": "4.0.136",
-    "@remotion/player": "4.0.136",
-    "@remotion/renderer": "4.0.136",
-    "@remotion/studio-server": "4.0.136",
-    "@remotion/studio": "4.0.136",
-    "remotion": "4.0.136"
+    "@remotion/bundler": "4.0.137",
+    "@remotion/media-utils": "4.0.137",
+    "remotion": "4.0.137",
+    "@remotion/player": "4.0.137",
+    "@remotion/studio-server": "4.0.137",
+    "@remotion/renderer": "4.0.137",
+    "@remotion/studio": "4.0.137"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -63,8 +63,8 @@
     "react-dom": "18.2.0",
     "vitest": "0.31.1",
     "zod": "^3.22.3",
-    "@remotion/tailwind": "4.0.136",
-    "@remotion/zod-types": "4.0.136"
+    "@remotion/zod-types": "4.0.137",
+    "@remotion/tailwind": "4.0.137"
   },
   "keywords": [
     "remotion",