@remotion/renderer 4.0.289 → 4.0.291

package/dist/browser/Browser.d.ts

@@ -43,6 +43,7 @@ export declare class HeadlessBrowser extends EventEmitter {
         indent: boolean;
     }): Promise<HeadlessBrowser>;
     connection: Connection;
+    id: string;
     runner: BrowserRunner;
     get _targets(): Map<string, Target>;
     constructor({ connection, defaultViewport, runner, }: {

package/dist/browser/Browser.js

@@ -63,6 +63,7 @@ class HeadlessBrowser extends EventEmitter_1.EventEmitter {
         _HeadlessBrowser_targets.set(this, void 0);
         __classPrivateFieldSet(this, _HeadlessBrowser_defaultViewport, defaultViewport, "f");
         this.connection = connection;
+        this.id = Math.random().toString(36).substring(2, 15);
         __classPrivateFieldSet(this, _HeadlessBrowser_defaultContext, new BrowserContext(this), "f");
         __classPrivateFieldSet(this, _HeadlessBrowser_contexts, new Map(), "f");
         __classPrivateFieldSet(this, _HeadlessBrowser_targets, new Map(), "f");

package/dist/browser/BrowserRunner.js

@@ -70,7 +70,7 @@ const makeBrowserRunner = async ({ executablePath, processArguments, userDataDir
     const dumpio = (0, log_level_1.isEqualOrBelowLogLevel)(logLevel, 'verbose');
     const stdio = dumpio
         ? ['ignore', 'pipe', 'pipe']
-        : ['pipe', 'ignore', 'pipe'];
+        : ['pipe', 'pipe', 'pipe'];
     const proc = childProcess.spawn(executablePath, processArguments, {
         // On non-windows platforms, `detached: true` makes child process a
         // leader of a new process group, making it possible to kill child
@@ -235,13 +235,17 @@ const makeBrowserRunner = async ({ executablePath, processArguments, userDataDir
 exports.makeBrowserRunner = makeBrowserRunner;
 function waitForWSEndpoint({ browserProcess, timeout, logLevel, indent, }) {
     const browserStderr = browserProcess.stderr;
+    const browserStdout = browserProcess.stdout;
     (0, assert_1.assert)(browserStderr, '`browserProcess` does not have stderr.');
-    let stderrString = '';
+    (0, assert_1.assert)(browserStdout, '`browserProcess` does not have stdout.');
+    let stdioString = '';
     return new Promise((resolve, reject) => {
-        browserStderr.addListener('data', onData);
+        browserStderr.addListener('data', onStdIoData);
+        browserStdout.addListener('data', onStdIoData);
         browserStderr.addListener('close', onClose);
         const listeners = [
-            () => browserStderr.removeListener('data', onData),
+            () => browserStderr.removeListener('data', onStdIoData),
+            () => browserStdout.removeListener('data', onStdIoData),
             () => browserStderr.removeListener('close', onClose),
             (0, util_1.addEventListener)(browserProcess, 'exit', (code, signal) => {
                 logger_1.Log.verbose({ indent, logLevel }, 'Browser process exited with code', code, 'signal', signal);
@@ -257,7 +261,7 @@ function waitForWSEndpoint({ browserProcess, timeout, logLevel, indent, }) {
             reject(new Error([
                 'Failed to launch the browser process!',
                 error ? error.stack : null,
-                stderrString,
+                stdioString,
                 'Troubleshooting: https://remotion.dev/docs/troubleshooting/browser-launch',
             ]
                 .filter(truthy_1.truthy)
@@ -265,11 +269,11 @@ function waitForWSEndpoint({ browserProcess, timeout, logLevel, indent, }) {
         }
         function onTimeout() {
             cleanup();
-            reject(new Errors_1.TimeoutError(`Timed out after ${timeout} ms while trying to connect to the browser! Chrome logged the following: ${stderrString}`));
+            reject(new Errors_1.TimeoutError(`Timed out after ${timeout} ms while trying to connect to the browser! Chrome logged the following: ${stdioString}`));
         }
-        function onData(data) {
-            stderrString += data.toString('utf8');
-            const match = stderrString.match(/DevTools listening on (ws:\/\/.*)/);
+        function onStdIoData(data) {
+            stdioString += data.toString('utf8');
+            const match = stdioString.match(/DevTools listening on (ws:\/\/.*)/);
             if (!match) {
                 return;
             }

package/dist/browser/LaunchOptions.d.ts

@@ -22,4 +22,5 @@ export interface LaunchOptions {
     indent: boolean;
     defaultViewport: Viewport;
     userDataDir: string;
+    timeout: number;
 }

package/dist/browser/Launcher.d.ts

@@ -15,4 +15,4 @@
  */
 import { HeadlessBrowser } from './Browser';
 import type { LaunchOptions } from './LaunchOptions';
-export declare const launchChrome: ({ args, executablePath, defaultViewport, indent, logLevel, userDataDir, }: LaunchOptions) => Promise<HeadlessBrowser>;
+export declare const launchChrome: ({ args, executablePath, defaultViewport, indent, logLevel, userDataDir, timeout, }: LaunchOptions) => Promise<HeadlessBrowser>;

package/dist/browser/Launcher.js

@@ -17,8 +17,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.launchChrome = void 0;
 const Browser_1 = require("./Browser");
-const launchChrome = async ({ args, executablePath, defaultViewport, indent, logLevel, userDataDir, }) => {
-    const timeout = 60000;
+const launchChrome = async ({ args, executablePath, defaultViewport, indent, logLevel, userDataDir, timeout, }) => {
     const browser = await Browser_1.HeadlessBrowser.create({
         defaultViewport,
         args,

package/dist/browser/should-log-message.js

@@ -33,6 +33,15 @@ const shouldLogBrowserMessage = (message) => {
     if (message.includes('Received HEADERS for invalid stream')) {
         return false;
     }
+    if (message.includes('CVDisplayLinkCreateWithCGDisplay failed')) {
+        return false;
+    }
+    if (message.includes('Falling back to ALSA for audio output')) {
+        return false;
+    }
+    if (message.includes('VizNullHypothesis is disabled')) {
+        return false;
+    }
     return true;
 };
 exports.shouldLogBrowserMessage = shouldLogBrowserMessage;

package/dist/collect-assets.js

@@ -16,16 +16,22 @@ const collectAssets = async ({ frame, freePage, timeoutInMilliseconds, }) => {
         if (asset.type !== 'artifact') {
             return asset;
         }
-        if (typeof asset.content !== 'string') {
-            throw new Error(`Expected string content for artifact ${asset.id}, but got ${asset.content}`);
+        if (asset.contentType === 'binary' || asset.contentType === 'text') {
+            if (typeof asset.content !== 'string') {
+                throw new Error(`Expected string content for artifact ${asset.id}, but got ${asset.content}`);
+            }
+            const stringOrUintArray = asset.contentType === 'binary'
+                ? new TextEncoder().encode(atob(asset.content))
+                : asset.content;
+            return {
+                ...asset,
+                content: stringOrUintArray,
+            };
         }
-        const stringOrUintArray = asset.binary
-            ? new TextEncoder().encode(atob(asset.content))
-            : asset.content;
-        return {
-            ...asset,
-            content: stringOrUintArray,
-        };
+        if (asset.contentType === 'thumbnail') {
+            return asset;
+        }
+        return asset;
     });
     return fixedArtifacts;
 };

package/dist/esm/index.mjs

@@ -3175,6 +3175,15 @@ var shouldLogBrowserMessage = (message) => {
   if (message.includes("Received HEADERS for invalid stream")) {
     return false;
   }
+  if (message.includes("CVDisplayLinkCreateWithCGDisplay failed")) {
+    return false;
+  }
+  if (message.includes("Falling back to ALSA for audio output")) {
+    return false;
+  }
+  if (message.includes("VizNullHypothesis is disabled")) {
+    return false;
+  }
   return true;
 };
 var parseBrowserLogMessage = (input) => {
@@ -3234,7 +3243,7 @@ var makeBrowserRunner = async ({
   timeout
 }) => {
   const dumpio = isEqualOrBelowLogLevel(logLevel, "verbose");
-  const stdio = dumpio ? ["ignore", "pipe", "pipe"] : ["pipe", "ignore", "pipe"];
+  const stdio = dumpio ? ["ignore", "pipe", "pipe"] : ["pipe", "pipe", "pipe"];
   const proc = childProcess.spawn(executablePath, processArguments, {
     detached: process.platform !== "win32",
     env: process.env,
@@ -3368,13 +3377,17 @@ function waitForWSEndpoint({
   indent
 }) {
   const browserStderr = browserProcess.stderr;
+  const browserStdout = browserProcess.stdout;
   assert(browserStderr, "`browserProcess` does not have stderr.");
-  let stderrString = "";
+  assert(browserStdout, "`browserProcess` does not have stdout.");
+  let stdioString = "";
   return new Promise((resolve, reject) => {
-    browserStderr.addListener("data", onData);
+    browserStderr.addListener("data", onStdIoData);
+    browserStdout.addListener("data", onStdIoData);
     browserStderr.addListener("close", onClose);
     const listeners = [
-      () => browserStderr.removeListener("data", onData),
+      () => browserStderr.removeListener("data", onStdIoData),
+      () => browserStdout.removeListener("data", onStdIoData),
       () => browserStderr.removeListener("close", onClose),
       addEventListener(browserProcess, "exit", (code, signal) => {
         Log.verbose({ indent, logLevel }, "Browser process exited with code", code, "signal", signal);
@@ -3390,18 +3403,18 @@ function waitForWSEndpoint({
       reject(new Error([
         "Failed to launch the browser process!",
         error ? error.stack : null,
-        stderrString,
+        stdioString,
         "Troubleshooting: https://remotion.dev/docs/troubleshooting/browser-launch"
       ].filter(truthy).join(`
 `)));
     }
     function onTimeout() {
       cleanup();
-      reject(new TimeoutError(`Timed out after ${timeout} ms while trying to connect to the browser! Chrome logged the following: ${stderrString}`));
+      reject(new TimeoutError(`Timed out after ${timeout} ms while trying to connect to the browser! Chrome logged the following: ${stdioString}`));
     }
-    function onData(data) {
-      stderrString += data.toString("utf8");
-      const match = stderrString.match(/DevTools listening on (ws:\/\/.*)/);
+    function onStdIoData(data) {
+      stdioString += data.toString("utf8");
+      const match = stdioString.match(/DevTools listening on (ws:\/\/.*)/);
       if (!match) {
         return;
       }
@@ -3569,6 +3582,7 @@ class HeadlessBrowser extends EventEmitter {
   #defaultContext;
   #contexts;
   #targets;
+  id;
   runner;
   get _targets() {
     return this.#targets;
@@ -3581,6 +3595,7 @@ class HeadlessBrowser extends EventEmitter {
     super();
     this.#defaultViewport = defaultViewport;
     this.connection = connection;
+    this.id = Math.random().toString(36).substring(2, 15);
     this.#defaultContext = new BrowserContext(this);
     this.#contexts = new Map;
     this.#targets = new Map;
@@ -4632,9 +4647,9 @@ var launchChrome = async ({
   defaultViewport,
   indent,
   logLevel,
-  userDataDir
+  userDataDir,
+  timeout
 }) => {
-  const timeout = 60000;
   const browser = await HeadlessBrowser.create({
     defaultViewport,
     args,
@@ -5088,6 +5103,7 @@ var internalOpenBrowser = async ({
   if (browser === "firefox") {
     throw new TypeError("Firefox supported is not yet turned on. Stay tuned for the future.");
   }
+  Log.verbose({ indent, logLevel }, "Ensuring browser executable");
   await internalEnsureBrowser({
     browserExecutable,
     logLevel,
@@ -5095,6 +5111,7 @@ var internalOpenBrowser = async ({
     onBrowserDownload,
     chromeMode
   });
+  Log.verbose({ indent, logLevel }, "Ensured browser is available.");
   const executablePath = getLocalBrowserExecutable({
     preferredBrowserExecutable: browserExecutable,
     logLevel,
@@ -5105,7 +5122,7 @@ var internalOpenBrowser = async ({
   const enableMultiProcessOnLinux = chromiumOptions.enableMultiProcessOnLinux ?? true;
   Log.verbose({ indent, logLevel, tag: "openBrowser()" }, `Opening browser: gl = ${chromiumOptions.gl}, executable = ${executablePath}, enableMultiProcessOnLinux = ${enableMultiProcessOnLinux}`);
   if (chromiumOptions.userAgent) {
-    Log.verbose({ indent, logLevel: "verbose", tag: "openBrowser()" }, `Using custom user agent: ${chromiumOptions.userAgent}`);
+    Log.verbose({ indent, logLevel, tag: "openBrowser()" }, `Using custom user agent: ${chromiumOptions.userAgent}`);
   }
   const userDataDir = await fs9.promises.mkdtemp(path9.join(os3.tmpdir(), "puppeteer_dev_chrome_profile-"));
   const browserInstance = await launchChrome({
@@ -5113,6 +5130,7 @@ var internalOpenBrowser = async ({
     logLevel,
     indent,
     userDataDir,
+    timeout: 25000,
     args: [
       "about:blank",
       "--allow-pre-commit-input",
@@ -16832,9 +16850,7 @@ __export(exports_perf, {
   getPerf: () => getPerf
 });
 var perf = {
-  "activate-target": [],
   capture: [],
-  save: [],
   "extract-frame": [],
   piping: []
 };
@@ -17717,8 +17733,31 @@ import path19 from "path";
 var onlyAudioAndVideoAssets = (assets) => {
   return assets.filter((asset) => asset.type === "audio" || asset.type === "video");
 };
-var onlyArtifact = (assets) => {
-  return assets.filter((asset) => asset.type === "artifact");
+var onlyArtifact = ({
+  assets,
+  frameBuffer
+}) => {
+  const artifacts = assets.filter((asset) => asset.type === "artifact");
+  return artifacts.map((artifact) => {
+    if (artifact.contentType === "binary" || artifact.contentType === "text") {
+      return {
+        frame: artifact.frame,
+        content: artifact.content,
+        filename: artifact.filename
+      };
+    }
+    if (artifact.contentType === "thumbnail") {
+      if (frameBuffer === null) {
+        return null;
+      }
+      return {
+        frame: artifact.frame,
+        content: new Uint8Array(frameBuffer),
+        filename: artifact.filename
+      };
+    }
+    throw new Error("Unknown artifact type: " + artifact);
+  }).filter(truthy);
 };
 
 // src/collect-assets.ts
@@ -17740,14 +17779,20 @@ var collectAssets = async ({
     if (asset.type !== "artifact") {
       return asset;
     }
-    if (typeof asset.content !== "string") {
-      throw new Error(`Expected string content for artifact ${asset.id}, but got ${asset.content}`);
+    if (asset.contentType === "binary" || asset.contentType === "text") {
+      if (typeof asset.content !== "string") {
+        throw new Error(`Expected string content for artifact ${asset.id}, but got ${asset.content}`);
+      }
+      const stringOrUintArray = asset.contentType === "binary" ? new TextEncoder().encode(atob(asset.content)) : asset.content;
+      return {
+        ...asset,
+        content: stringOrUintArray
+      };
+    }
+    if (asset.contentType === "thumbnail") {
+      return asset;
     }
-    const stringOrUintArray = asset.binary ? new TextEncoder().encode(atob(asset.content)) : asset.content;
-    return {
-      ...asset,
-      content: stringOrUintArray
-    };
+    return asset;
   });
   return fixedArtifacts;
 };
@@ -17769,16 +17814,14 @@ var screenshotTask = async ({
 }) => {
   const client = page._client();
   const target = page.target();
-  const perfTarget = startPerfMeasure("activate-target");
   await client.send("Target.activateTarget", {
     targetId: target._targetId
   });
-  stopPerfMeasure(perfTarget);
-  const shouldSetDefaultBackground = omitBackground;
-  if (shouldSetDefaultBackground)
+  if (omitBackground) {
     await client.send("Emulation.setDefaultBackgroundColorOverride", {
       color: { r: 0, g: 0, b: 0, a: 0 }
     });
+  }
   const cap = startPerfMeasure("capture");
   try {
     let result;
@@ -17814,13 +17857,13 @@ var screenshotTask = async ({
       result = value;
     }
     stopPerfMeasure(cap);
-    if (shouldSetDefaultBackground)
+    if (omitBackground) {
       await client.send("Emulation.setDefaultBackgroundColorOverride");
-    const saveMarker = startPerfMeasure("save");
+    }
     const buffer = Buffer.from(result.data, "base64");
-    if (path19)
+    if (path19) {
       await fs12.promises.writeFile(path19, buffer);
-    stopPerfMeasure(saveMarker);
+    }
     return buffer;
   } catch (err) {
     if (err.message.includes("Unable to capture screenshot")) {
@@ -17853,18 +17896,27 @@ var screenshot = (options) => {
   }));
 };
 
-// src/screenshot-dom-element.ts
-var screenshotDOMElement = async ({
-  page,
+// src/take-frame.ts
+var takeFrame = async ({
+  freePage,
   imageFormat,
   jpegQuality,
-  opts,
-  height,
+  frame,
   width,
-  timeoutInMilliseconds,
-  scale
+  height,
+  output,
+  scale,
+  wantsBuffer,
+  timeoutInMilliseconds
 }) => {
-  const { path: path19 } = opts;
+  const collectedAssets = await collectAssets({
+    frame,
+    freePage,
+    timeoutInMilliseconds
+  });
+  if (imageFormat === "none") {
+    return { buffer: null, collectedAssets };
+  }
   if (imageFormat === "png" || imageFormat === "pdf" || imageFormat === "webp") {
     await puppeteerEvaluateWithCatch({
       pageFunction: () => {
@@ -17872,7 +17924,7 @@ var screenshotDOMElement = async ({
       },
       args: [],
       frame: null,
-      page,
+      page: freePage,
       timeoutInMilliseconds
     });
   } else {
@@ -17882,93 +17934,21 @@ var screenshotDOMElement = async ({
       },
       args: [],
       frame: null,
-      page,
+      page: freePage,
       timeoutInMilliseconds
     });
   }
-  if (imageFormat === "none") {
-    throw new TypeError('Tried to make a screenshot with format "none"');
-  }
   const buf = await screenshot({
-    page,
+    page: freePage,
     omitBackground: imageFormat === "png",
-    path: path19 ?? undefined,
+    path: (wantsBuffer ? undefined : output) ?? undefined,
     type: imageFormat,
     jpegQuality,
     width,
     height,
     scale
   });
-  if (typeof buf === "string") {
-    throw new TypeError("Expected a buffer");
-  }
-  return buf;
-};
-
-// src/provide-screenshot.ts
-var provideScreenshot = ({
-  page,
-  imageFormat,
-  options,
-  jpegQuality,
-  height,
-  width,
-  timeoutInMilliseconds,
-  scale
-}) => {
-  return screenshotDOMElement({
-    page,
-    opts: {
-      path: options.output
-    },
-    imageFormat,
-    jpegQuality,
-    height,
-    width,
-    timeoutInMilliseconds,
-    scale
-  });
-};
-
-// src/take-frame.ts
-var takeFrame = async ({
-  freePage,
-  imageFormat,
-  jpegQuality,
-  frame,
-  width,
-  height,
-  output,
-  scale,
-  wantsBuffer,
-  timeoutInMilliseconds
-}) => {
-  const collectedAssets = await collectAssets({
-    frame,
-    freePage,
-    timeoutInMilliseconds
-  });
-  if (imageFormat === "none") {
-    return { buffer: null, collectedAssets };
-  }
-  const shouldMakeBuffer = wantsBuffer;
-  const buf = await provideScreenshot({
-    page: freePage,
-    imageFormat,
-    jpegQuality,
-    options: {
-      frame,
-      output: wantsBuffer ? null : output
-    },
-    height,
-    width,
-    timeoutInMilliseconds,
-    scale
-  });
-  if (shouldMakeBuffer) {
-    return { buffer: buf, collectedAssets };
-  }
-  return { buffer: null, collectedAssets };
+  return { buffer: buf, collectedAssets };
 };
 
 // src/render-frame-with-option-to-reject.ts
@@ -18038,7 +18018,6 @@ var renderFrameWithOptionToReject = async ({
   if (outputDir && onFrameBuffer && imageFormat !== "none") {
     throw new Error("Pass either `outputDir` or `onFrameBuffer` to renderFrames(), not both.");
   }
-  const id = startPerfMeasure("save");
   const { buffer, collectedAssets } = await takeFrame({
     frame,
     freePage: page,
@@ -18064,12 +18043,14 @@ var renderFrameWithOptionToReject = async ({
     }
     onFrameBuffer(buffer, frame);
   }
-  stopPerfMeasure(id);
   const onlyAvailableAssets = assets.filter(truthy);
   const previousAudioRenderAssets = onlyAvailableAssets.map((a) => a.audioAndVideoAssets).flat(2);
   const previousArtifactAssets = onlyAvailableAssets.map((a) => a.artifactAssets).flat(2);
   const audioAndVideoAssets = onlyAudioAndVideoAssets(collectedAssets);
-  const artifactAssets = onlyArtifact(collectedAssets);
+  const artifactAssets = onlyArtifact({
+    assets: collectedAssets,
+    frameBuffer: buffer
+  });
   for (const artifact of artifactAssets) {
     for (const previousArtifact of previousArtifactAssets) {
       if (artifact.filename === previousArtifact.filename) {
@@ -21695,7 +21676,10 @@ var innerRenderStill = async ({
     wantsBuffer: !output,
     timeoutInMilliseconds
   });
-  const artifactAssets = onlyArtifact(collectedAssets);
+  const artifactAssets = onlyArtifact({
+    assets: collectedAssets,
+    frameBuffer: buffer
+  });
   const previousArtifactAssets = [];
   for (const artifact of artifactAssets) {
     for (const previousArtifact of previousArtifactAssets) {

package/dist/filter-asset-types.d.ts

@@ -1,3 +1,7 @@
-import type { ArtifactAsset, AudioOrVideoAsset, TRenderAsset } from 'remotion/no-react';
+import type { AudioOrVideoAsset, TRenderAsset } from 'remotion/no-react';
+import type { EmittedArtifact } from './serialize-artifact';
 export declare const onlyAudioAndVideoAssets: (assets: TRenderAsset[]) => AudioOrVideoAsset[];
-export declare const onlyArtifact: (assets: TRenderAsset[]) => ArtifactAsset[];
+export declare const onlyArtifact: ({ assets, frameBuffer, }: {
+    assets: TRenderAsset[];
+    frameBuffer: Buffer | null;
+}) => EmittedArtifact[];

package/dist/filter-asset-types.js

@@ -1,11 +1,38 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.onlyArtifact = exports.onlyAudioAndVideoAssets = void 0;
+const truthy_1 = require("./truthy");
 const onlyAudioAndVideoAssets = (assets) => {
     return assets.filter((asset) => asset.type === 'audio' || asset.type === 'video');
 };
 exports.onlyAudioAndVideoAssets = onlyAudioAndVideoAssets;
-const onlyArtifact = (assets) => {
-    return assets.filter((asset) => asset.type === 'artifact');
+const onlyArtifact = ({ assets, frameBuffer, }) => {
+    const artifacts = assets.filter((asset) => asset.type === 'artifact');
+    return artifacts
+        .map((artifact) => {
+        if (artifact.contentType === 'binary' ||
+            artifact.contentType === 'text') {
+            return {
+                frame: artifact.frame,
+                content: artifact.content,
+                filename: artifact.filename,
+            };
+        }
+        if (artifact.contentType === 'thumbnail') {
+            if (frameBuffer === null) {
+                // A thumbnail artifact was defined to be emitted, but the output was not a video.
+                // Also, in Lambda, there are extra frames which are not video frames.
+                // This could happen if a thumbnail is unconditionally emitted.
+                return null;
+            }
+            return {
+                frame: artifact.frame,
+                content: new Uint8Array(frameBuffer),
+                filename: artifact.filename,
+            };
+        }
+        throw new Error('Unknown artifact type: ' + artifact);
+    })
+        .filter(truthy_1.truthy);
 };
 exports.onlyArtifact = onlyArtifact;

package/dist/open-browser.js

@@ -55,6 +55,7 @@ const internalOpenBrowser = async ({ browser, browserExecutable, chromiumOptions
     if (browser === 'firefox') {
         throw new TypeError('Firefox supported is not yet turned on. Stay tuned for the future.');
     }
+    logger_1.Log.verbose({ indent, logLevel }, 'Ensuring browser executable');
     await (0, ensure_browser_1.internalEnsureBrowser)({
         browserExecutable,
         logLevel,
@@ -62,6 +63,7 @@ const internalOpenBrowser = async ({ browser, browserExecutable, chromiumOptions
         onBrowserDownload,
         chromeMode,
     });
+    logger_1.Log.verbose({ indent, logLevel }, 'Ensured browser is available.');
     const executablePath = (0, get_local_browser_executable_1.getLocalBrowserExecutable)({
         preferredBrowserExecutable: browserExecutable,
         logLevel,
@@ -72,7 +74,7 @@ const internalOpenBrowser = async ({ browser, browserExecutable, chromiumOptions
     const enableMultiProcessOnLinux = (_b = chromiumOptions.enableMultiProcessOnLinux) !== null && _b !== void 0 ? _b : true;
     logger_1.Log.verbose({ indent, logLevel, tag: 'openBrowser()' }, `Opening browser: gl = ${chromiumOptions.gl}, executable = ${executablePath}, enableMultiProcessOnLinux = ${enableMultiProcessOnLinux}`);
     if (chromiumOptions.userAgent) {
-        logger_1.Log.verbose({ indent, logLevel: 'verbose', tag: 'openBrowser()' }, `Using custom user agent: ${chromiumOptions.userAgent}`);
+        logger_1.Log.verbose({ indent, logLevel, tag: 'openBrowser()' }, `Using custom user agent: ${chromiumOptions.userAgent}`);
     }
     const userDataDir = await node_fs_1.default.promises.mkdtemp(node_path_1.default.join(node_os_1.default.tmpdir(), 'puppeteer_dev_chrome_profile-'));
     const browserInstance = await (0, Launcher_1.launchChrome)({
@@ -80,6 +82,7 @@ const internalOpenBrowser = async ({ browser, browserExecutable, chromiumOptions
         logLevel,
         indent,
         userDataDir,
+        timeout: 25000,
         args: [
             'about:blank',
             '--allow-pre-commit-input',

package/dist/perf.d.ts

@@ -1,4 +1,4 @@
-type PerfId = 'activate-target' | 'capture' | 'save' | 'extract-frame' | 'piping';
+type PerfId = 'capture' | 'extract-frame' | 'piping';
 export declare const startPerfMeasure: (marker: PerfId) => number;
 export declare const stopPerfMeasure: (id: number) => void;
 export declare const getPerf: () => string[];

package/dist/perf.js

@@ -2,9 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getPerf = exports.stopPerfMeasure = exports.startPerfMeasure = void 0;
 const perf = {
-    'activate-target': [],
     capture: [],
-    save: [],
     'extract-frame': [],
     piping: [],
 };

package/dist/puppeteer-screenshot.d.ts

@@ -9,4 +9,4 @@ export declare const screenshot: (options: {
     width: number;
     height: number;
     scale: number;
-}) => Promise<Buffer | string>;
+}) => Promise<Buffer>;

package/dist/render-frame-with-option-to-reject.js

@@ -11,7 +11,6 @@ const handle_javascript_exception_1 = require("./error-handling/handle-javascrip
 const filter_asset_types_1 = require("./filter-asset-types");
 const get_frame_padded_index_1 = require("./get-frame-padded-index");
 const logger_1 = require("./logger");
-const perf_1 = require("./perf");
 const seek_to_frame_1 = require("./seek-to-frame");
 const take_frame_1 = require("./take-frame");
 const truthy_1 = require("./truthy");
@@ -51,7 +50,6 @@ const renderFrameWithOptionToReject = async ({ reject, width, height, compId, at
     if (outputDir && onFrameBuffer && imageFormat !== 'none') {
         throw new Error('Pass either `outputDir` or `onFrameBuffer` to renderFrames(), not both.');
     }
-    const id = (0, perf_1.startPerfMeasure)('save');
     const { buffer, collectedAssets } = await (0, take_frame_1.takeFrame)({
         frame,
         freePage: page,
@@ -79,7 +77,6 @@ const renderFrameWithOptionToReject = async ({ reject, width, height, compId, at
         }
         onFrameBuffer(buffer, frame);
     }
-    (0, perf_1.stopPerfMeasure)(id);
     const onlyAvailableAssets = assets.filter(truthy_1.truthy);
     const previousAudioRenderAssets = onlyAvailableAssets
         .map((a) => a.audioAndVideoAssets)
@@ -88,7 +85,10 @@ const renderFrameWithOptionToReject = async ({ reject, width, height, compId, at
         .map((a) => a.artifactAssets)
         .flat(2);
     const audioAndVideoAssets = (0, filter_asset_types_1.onlyAudioAndVideoAssets)(collectedAssets);
-    const artifactAssets = (0, filter_asset_types_1.onlyArtifact)(collectedAssets);
+    const artifactAssets = (0, filter_asset_types_1.onlyArtifact)({
+        assets: collectedAssets,
+        frameBuffer: buffer,
+    });
     for (const artifact of artifactAssets) {
         for (const previousArtifact of previousArtifactAssets) {
             if (artifact.filename === previousArtifact.filename) {

package/dist/render-still.js

@@ -209,7 +209,10 @@ const innerRenderStill = async ({ composition, imageFormat = image_format_1.DEFA
         wantsBuffer: !output,
         timeoutInMilliseconds,
     });
-    const artifactAssets = (0, filter_asset_types_1.onlyArtifact)(collectedAssets);
+    const artifactAssets = (0, filter_asset_types_1.onlyArtifact)({
+        assets: collectedAssets,
+        frameBuffer: buffer,
+    });
     const previousArtifactAssets = [];
     for (const artifact of artifactAssets) {
         for (const previousArtifact of previousArtifactAssets) {

package/dist/screenshot-task.d.ts

@@ -9,4 +9,4 @@ export declare const screenshotTask: ({ format, height, omitBackground, page, wi
     width: number;
     height: number;
     scale: number;
-}) => Promise<Buffer | string>;
+}) => Promise<Buffer>;

package/dist/screenshot-task.js

@@ -10,16 +10,14 @@ const screenshotTask = async ({ format, height, omitBackground, page, width, pat
     var _a;
     const client = page._client();
     const target = page.target();
-    const perfTarget = (0, perf_1.startPerfMeasure)('activate-target');
     await client.send('Target.activateTarget', {
         targetId: target._targetId,
     });
-    (0, perf_1.stopPerfMeasure)(perfTarget);
-    const shouldSetDefaultBackground = omitBackground;
-    if (shouldSetDefaultBackground)
+    if (omitBackground) {
         await client.send('Emulation.setDefaultBackgroundColorOverride', {
             color: { r: 0, g: 0, b: 0, a: 0 },
         });
+    }
     const cap = (0, perf_1.startPerfMeasure)('capture');
     try {
         let result;
@@ -63,13 +61,13 @@ const screenshotTask = async ({ format, height, omitBackground, page, width, pat
             result = value;
         }
         (0, perf_1.stopPerfMeasure)(cap);
-        if (shouldSetDefaultBackground)
+        if (omitBackground) {
             await client.send('Emulation.setDefaultBackgroundColorOverride');
-        const saveMarker = (0, perf_1.startPerfMeasure)('save');
+        }
         const buffer = Buffer.from(result.data, 'base64');
-        if (path)
+        if (path) {
             await node_fs_1.default.promises.writeFile(path, buffer);
-        (0, perf_1.stopPerfMeasure)(saveMarker);
+        }
         return buffer;
     }
     catch (err) {

package/dist/take-frame.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.takeFrame = void 0;
 const collect_assets_1 = require("./collect-assets");
-const provide_screenshot_1 = require("./provide-screenshot");
+const puppeteer_evaluate_1 = require("./puppeteer-evaluate");
+const puppeteer_screenshot_1 = require("./puppeteer-screenshot");
 const takeFrame = async ({ freePage, imageFormat, jpegQuality, frame, width, height, output, scale, wantsBuffer, timeoutInMilliseconds, }) => {
+    var _a;
     const collectedAssets = await (0, collect_assets_1.collectAssets)({
         frame,
         freePage,
@@ -12,23 +14,40 @@ const takeFrame = async ({ freePage, imageFormat, jpegQuality, frame, width, hei
     if (imageFormat === 'none') {
         return { buffer: null, collectedAssets };
     }
-    const shouldMakeBuffer = wantsBuffer;
-    const buf = await (0, provide_screenshot_1.provideScreenshot)({
+    if (imageFormat === 'png' ||
+        imageFormat === 'pdf' ||
+        imageFormat === 'webp') {
+        await (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
+            pageFunction: () => {
+                document.body.style.background = 'transparent';
+            },
+            args: [],
+            frame: null,
+            page: freePage,
+            timeoutInMilliseconds,
+        });
+    }
+    else {
+        await (0, puppeteer_evaluate_1.puppeteerEvaluateWithCatch)({
+            pageFunction: () => {
+                document.body.style.background = 'black';
+            },
+            args: [],
+            frame: null,
+            page: freePage,
+            timeoutInMilliseconds,
+        });
+    }
+    const buf = await (0, puppeteer_screenshot_1.screenshot)({
         page: freePage,
-        imageFormat,
+        omitBackground: imageFormat === 'png',
+        path: (_a = (wantsBuffer ? undefined : output)) !== null && _a !== void 0 ? _a : undefined,
+        type: imageFormat,
         jpegQuality,
-        options: {
-            frame,
-            output: wantsBuffer ? null : output,
-        },
-        height,
         width,
-        timeoutInMilliseconds,
+        height,
         scale,
     });
-    if (shouldMakeBuffer) {
-        return { buffer: buf, collectedAssets };
-    }
-    return { buffer: null, collectedAssets };
+    return { buffer: buf, collectedAssets };
 };
 exports.takeFrame = takeFrame;

package/package.json

@@ -3,7 +3,7 @@
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/renderer"
   },
   "name": "@remotion/renderer",
-  "version": "4.0.289",
+  "version": "4.0.291",
   "description": "Render Remotion videos using Node.js or Bun",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -18,8 +18,8 @@
     "extract-zip": "2.0.1",
     "source-map": "^0.8.0-beta.0",
     "ws": "8.17.1",
-    "remotion": "4.0.289",
-    "@remotion/streaming": "4.0.289"
+    "remotion": "4.0.291",
+    "@remotion/streaming": "4.0.291"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -33,17 +33,17 @@
     "react-dom": "19.0.0",
     "@types/ws": "8.5.10",
     "eslint": "9.19.0",
-    "@remotion/example-videos": "4.0.289",
-    "@remotion/eslint-config-internal": "4.0.289"
+    "@remotion/example-videos": "4.0.291",
+    "@remotion/eslint-config-internal": "4.0.291"
   },
   "optionalDependencies": {
-    "@remotion/compositor-darwin-arm64": "4.0.289",
-    "@remotion/compositor-linux-arm64-musl": "4.0.289",
-    "@remotion/compositor-linux-x64-gnu": "4.0.289",
-    "@remotion/compositor-darwin-x64": "4.0.289",
-    "@remotion/compositor-linux-x64-musl": "4.0.289",
-    "@remotion/compositor-win32-x64-msvc": "4.0.289",
-    "@remotion/compositor-linux-arm64-gnu": "4.0.289"
+    "@remotion/compositor-darwin-arm64": "4.0.291",
+    "@remotion/compositor-darwin-x64": "4.0.291",
+    "@remotion/compositor-linux-arm64-musl": "4.0.291",
+    "@remotion/compositor-linux-arm64-gnu": "4.0.291",
+    "@remotion/compositor-linux-x64-gnu": "4.0.291",
+    "@remotion/compositor-linux-x64-musl": "4.0.291",
+    "@remotion/compositor-win32-x64-msvc": "4.0.291"
   },
   "keywords": [
     "remotion",

package/build-browser-downloader.ts

@@ -1,8 +0,0 @@
-const out = await Bun.build({
-	entrypoints: ['src/ensure-browser.ts'],
-	target: 'node',
-});
-
-Bun.write('ensure-browser.mjs', await out.outputs[0].arrayBuffer());
-
-export {};

package/bundle.ts

@@ -1,27 +0,0 @@
-import {buildPackage} from '../.monorepo/builder';
-
-await buildPackage({
-	formats: {
-		cjs: 'use-tsc',
-		esm: 'build',
-	},
-	external: 'dependencies',
-	entrypoints: [
-		{
-			path: 'src/index.ts',
-			target: 'node',
-		},
-		{
-			path: 'src/client.ts',
-			target: 'node',
-		},
-		{
-			path: 'src/pure.ts',
-			target: 'browser',
-		},
-		{
-			path: 'src/error-handling.ts',
-			target: 'node',
-		},
-	],
-});

package/eslint.config.mjs

@@ -1,25 +0,0 @@
-import {remotionFlatConfig} from '@remotion/eslint-config-internal';
-
-const config = remotionFlatConfig({react: false});
-
-export default [
-	{
-		...config,
-		rules: {
-			...config.rules,
-			'@typescript-eslint/no-use-before-define': 'off',
-			'no-restricted-imports': [
-				'error',
-				{
-					patterns: ['@remotion/*/src/*', 'remotion/src/*'],
-					paths: ['remotion', 'react', 'react-dom'],
-				},
-			],
-		},
-		ignores: ['src/browser/**'],
-	},
-	{
-		...config,
-		files: ['src/test/**'],
-	},
-];