@remotion/renderer 4.0.0-alpha13 → 4.0.0-alpha16

package/dist/assets/download-and-map-assets-to-file.d.ts

@@ -1,13 +1,14 @@
 import type { TAsset } from 'remotion';
+import { OffthreadVideoServerEmitter } from '../offthread-video-server';
 import type { DownloadMap } from './download-map';
-export declare type RenderMediaOnDownload = (src: string) => ((progress: {
+export type RenderMediaOnDownload = (src: string) => ((progress: {
     percent: number | null;
     downloaded: number;
     totalSize: number | null;
 }) => void) | undefined | void;
-export declare const downloadAsset: ({ src, onDownload, downloadMap, }: {
+export declare const downloadAsset: ({ src, downloadMap, emitter, }: {
     src: string;
-    onDownload: RenderMediaOnDownload;
+    emitter: OffthreadVideoServerEmitter;
     downloadMap: DownloadMap;
 }) => Promise<string>;
 export declare const markAllAssetsAsDownloaded: (downloadMap: DownloadMap) => void;
@@ -19,6 +20,7 @@ export declare const getSanitizedFilenameForAssetUrl: ({ src, downloadDir, conte
 }) => string;
 export declare const downloadAndMapAssetsToFileUrl: ({ asset, onDownload, downloadMap, }: {
     asset: TAsset;
-    onDownload: RenderMediaOnDownload;
+    onDownload: RenderMediaOnDownload | null;
     downloadMap: DownloadMap;
 }) => Promise<TAsset>;
+export declare const attachDownloadListenerToEmitter: (emitter: OffthreadVideoServerEmitter, onDownload: RenderMediaOnDownload | null) => () => void;

package/dist/assets/download-and-map-assets-to-file.js

@@ -26,13 +26,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.downloadAndMapAssetsToFileUrl = exports.getSanitizedFilenameForAssetUrl = exports.markAllAssetsAsDownloaded = exports.downloadAsset = void 0;
+exports.attachDownloadListenerToEmitter = exports.downloadAndMapAssetsToFileUrl = exports.getSanitizedFilenameForAssetUrl = exports.markAllAssetsAsDownloaded = exports.downloadAsset = void 0;
 const node_fs_1 = __importDefault(require("node:fs"));
 const node_path_1 = __importStar(require("node:path"));
 const remotion_1 = require("remotion");
 const compress_assets_1 = require("../compress-assets");
 const ensure_output_directory_1 = require("../ensure-output-directory");
 const mime_types_1 = require("../mime-types");
+const offthread_video_server_1 = require("../offthread-video-server");
 const download_file_1 = require("./download-file");
 const sanitize_filepath_1 = require("./sanitize-filepath");
 const waitForAssetToBeDownloaded = ({ src, downloadDir, downloadMap, }) => {
@@ -52,7 +53,7 @@ const waitForAssetToBeDownloaded = ({ src, downloadDir, downloadMap, }) => {
     return new Promise((resolve) => {
         downloadMap.listeners[src][downloadDir].push(() => {
             const srcMap = downloadMap.hasBeenDownloadedMap[src];
-            if (!srcMap || !srcMap[downloadDir]) {
+            if (!(srcMap === null || srcMap === void 0 ? void 0 : srcMap[downloadDir])) {
                 throw new Error('Expected file for ' + src + 'to be available in ' + downloadDir);
             }
             resolve(srcMap[downloadDir]);
@@ -115,7 +116,7 @@ function validateBufferEncoding(potentialEncoding, dataUrl) {
         throw new TypeError(errMessage);
     }
 }
-const downloadAsset = async ({ src, onDownload, downloadMap, }) => {
+const downloadAsset = async ({ src, downloadMap, emitter, }) => {
     var _a, _b, _c;
     if ((0, compress_assets_1.isAssetCompressed)(src)) {
         return src;
@@ -145,7 +146,7 @@ const downloadAsset = async ({ src, onDownload, downloadMap, }) => {
     if (process.env.NODE_ENV === 'test') {
         console.log('Actually downloading asset', src);
     }
-    const onProgress = onDownload(src);
+    emitter.dispatchDownload(src);
     if (src.startsWith('data:')) {
         const [assetDetails, assetData] = src.substring('data:'.length).split(',');
         if (!assetDetails.includes(';')) {
@@ -175,7 +176,7 @@ const downloadAsset = async ({ src, onDownload, downloadMap, }) => {
     const { to } = await (0, download_file_1.downloadFile)({
         url: src,
         onProgress: (progress) => {
-            onProgress === null || onProgress === void 0 ? void 0 : onProgress(progress);
+            emitter.dispatchDownloadProgress(src, progress.percent, progress.downloaded, progress.totalSize);
         },
         to: (contentDisposition, contentType) => (0, exports.getSanitizedFilenameForAssetUrl)({
             contentDisposition,
@@ -242,14 +243,37 @@ const getSanitizedFilenameForAssetUrl = ({ src, downloadDir, contentDisposition,
 };
 exports.getSanitizedFilenameForAssetUrl = getSanitizedFilenameForAssetUrl;
 const downloadAndMapAssetsToFileUrl = async ({ asset, onDownload, downloadMap, }) => {
+    const emitter = new offthread_video_server_1.OffthreadVideoServerEmitter();
+    const cleanup = (0, exports.attachDownloadListenerToEmitter)(emitter, onDownload);
     const newSrc = await (0, exports.downloadAsset)({
         src: asset.src,
-        onDownload,
+        emitter,
         downloadMap,
     });
+    cleanup();
     return {
         ...asset,
         src: newSrc,
     };
 };
 exports.downloadAndMapAssetsToFileUrl = downloadAndMapAssetsToFileUrl;
+const attachDownloadListenerToEmitter = (emitter, onDownload) => {
+    const cleanup = [];
+    if (!onDownload) {
+        return () => undefined;
+    }
+    const a = emitter.addEventListener('download', ({ detail: { src: initialSrc } }) => {
+        const progress = onDownload(initialSrc);
+        const b = emitter.addEventListener('progress', ({ detail: { downloaded, percent, src: progressSrc, totalSize } }) => {
+            if (initialSrc === progressSrc) {
+                progress === null || progress === void 0 ? void 0 : progress({ downloaded, percent, totalSize });
+            }
+        });
+        cleanup.push(b);
+    });
+    cleanup.push(() => a());
+    return () => {
+        cleanup.forEach((c) => c());
+    };
+};
+exports.attachDownloadListenerToEmitter = attachDownloadListenerToEmitter;

package/dist/assets/download-file.d.ts

@@ -1,8 +1,8 @@
-declare type Response = {
+type Response = {
     sizeInBytes: number;
     to: string;
 };
-declare type Options = {
+type Options = {
     url: string;
     to: (contentDisposition: string | null, contentType: string | null) => string;
     onProgress: ((progress: {

package/dist/assets/download-map.d.ts

@@ -1,9 +1,9 @@
 import type { TAsset } from 'remotion';
-export declare type AudioChannelsAndDurationResultCache = {
+export type AudioChannelsAndDurationResultCache = {
     channels: number;
     duration: number | null;
 };
-export declare type DownloadMap = {
+export type DownloadMap = {
     id: string;
     isDownloadingMap: {
         [src: string]: {
@@ -33,7 +33,7 @@ export declare type DownloadMap = {
         [key: string]: string;
     };
 };
-export declare type RenderAssetInfo = {
+export type RenderAssetInfo = {
     assets: TAsset[][];
     imageSequenceName: string;
     firstFrameIndex: number;

package/dist/assets/ffmpeg-volume-expression.d.ts

@@ -1,6 +1,6 @@
 import type { AssetVolume } from './types';
-declare type FfmpegEval = 'once' | 'frame';
-declare type FfmpegVolumeExpression = {
+type FfmpegEval = 'once' | 'frame';
+type FfmpegVolumeExpression = {
     eval: FfmpegEval;
     value: string;
 };

package/dist/assets/get-audio-channels.d.ts

@@ -1,2 +1,3 @@
 import type { AudioChannelsAndDurationResultCache, DownloadMap } from './download-map';
+export declare const getAudioChannelsAndDurationWithoutCache: (src: string) => Promise<AudioChannelsAndDurationResultCache>;
 export declare const getAudioChannelsAndDuration: (downloadMap: DownloadMap, src: string) => Promise<AudioChannelsAndDurationResultCache>;

package/dist/assets/get-audio-channels.js

@@ -1,13 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAudioChannelsAndDuration = void 0;
+exports.getAudioChannelsAndDuration = exports.getAudioChannelsAndDurationWithoutCache = void 0;
 const call_ffmpeg_1 = require("../call-ffmpeg");
 const p_limit_1 = require("../p-limit");
 const limit = (0, p_limit_1.pLimit)(1);
-async function getAudioChannelsAndDurationUnlimited(downloadMap, src) {
-    if (downloadMap.durationOfAssetCache[src]) {
-        return downloadMap.durationOfAssetCache[src];
-    }
+const getAudioChannelsAndDurationWithoutCache = async (src) => {
     const args = [
         ['-v', 'error'],
         ['-show_entries', 'stream=channels:format=duration'],
@@ -23,6 +20,14 @@ async function getAudioChannelsAndDurationUnlimited(downloadMap, src) {
         channels: channels ? parseInt(channels[1], 10) : 0,
         duration: duration ? parseFloat(duration[1]) : null,
     };
+    return result;
+};
+exports.getAudioChannelsAndDurationWithoutCache = getAudioChannelsAndDurationWithoutCache;
+async function getAudioChannelsAndDurationUnlimited(downloadMap, src) {
+    if (downloadMap.durationOfAssetCache[src]) {
+        return downloadMap.durationOfAssetCache[src];
+    }
+    const result = await (0, exports.getAudioChannelsAndDurationWithoutCache)(src);
     downloadMap.durationOfAssetCache[src] = result;
     return result;
 }

package/dist/assets/read-file.js

@@ -14,7 +14,7 @@ const getClient = (url) => {
     if (url.startsWith('http://')) {
         return node_http_1.default.get;
     }
-    throw new Error('Can only download URLs starting with http:// or https://');
+    throw new Error(`Can only download URLs starting with http:// or https://, got "${url}"`);
 };
 const readFileWithoutRedirect = (url) => {
     return new Promise((resolve, reject) => {

package/dist/assets/types.d.ts

@@ -1,5 +1,5 @@
 import type { TAsset } from 'remotion';
-export declare type UnsafeAsset = Omit<TAsset, 'frame' | 'id' | 'volume' | 'mediaFrame'> & {
+export type UnsafeAsset = Omit<TAsset, 'frame' | 'id' | 'volume' | 'mediaFrame'> & {
     startInVideo: number;
     duration: number | null;
     trimLeft: number;
@@ -8,10 +8,10 @@ export declare type UnsafeAsset = Omit<TAsset, 'frame' | 'id' | 'volume' | 'medi
     playbackRate: number;
     allowAmplificationDuringRender: boolean;
 };
-export declare type AssetVolume = number | number[];
-export declare type MediaAsset = Omit<UnsafeAsset, 'duration' | 'volume'> & {
+export type AssetVolume = number | number[];
+export type MediaAsset = Omit<UnsafeAsset, 'duration' | 'volume'> & {
     duration: number;
     volume: AssetVolume;
 };
 export declare const uncompressMediaAsset: (allAssets: TAsset[], assetToUncompress: TAsset) => TAsset;
-export declare type Assets = MediaAsset[];
+export type Assets = MediaAsset[];

package/dist/audio-codec.d.ts

@@ -1,6 +1,6 @@
 import type { Codec } from './codec';
 export declare const validAudioCodecs: readonly ["pcm-16", "aac", "mp3", "opus"];
-export declare type AudioCodec = typeof validAudioCodecs[number];
+export type AudioCodec = typeof validAudioCodecs[number];
 export declare const supportedAudioCodecs: {
     readonly h264: readonly ["aac", "pcm-16"];
     readonly 'h264-mkv': readonly ["pcm-16"];
@@ -14,7 +14,7 @@ export declare const supportedAudioCodecs: {
     readonly wav: readonly ["pcm-16"];
 };
 declare const audioCodecNames: readonly ["pcm_s16le", "aac", "libmp3lame", "libopus"];
-declare type FfmpegAudioCodecName = typeof audioCodecNames[number];
+type FfmpegAudioCodecName = typeof audioCodecNames[number];
 export declare const mapAudioCodecToFfmpegAudioCodecName: (audioCodec: AudioCodec) => FfmpegAudioCodecName;
 export declare const defaultAudioCodecs: {
     [key in Codec]: {

package/dist/browser/Browser.d.ts

@@ -13,12 +13,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import type { AnySourceMapConsumer } from '../symbolicate-stacktrace';
 import type { Page } from './BrowserPage';
 import type { Connection } from './Connection';
 import { EventEmitter } from './EventEmitter';
 import type { Viewport } from './PuppeteerViewport';
 import { Target } from './Target';
-declare type BrowserCloseCallback = () => Promise<void> | void;
+type BrowserCloseCallback = () => Promise<void> | void;
 interface WaitForTargetOptions {
     timeout?: number;
 }
@@ -30,18 +31,17 @@ export declare const enum BrowserEmittedEvents {
 }
 export declare class HeadlessBrowser extends EventEmitter {
     #private;
-    static _create({ connection, contextIds, defaultViewport, closeCallback, }: {
+    static _create({ connection, defaultViewport, closeCallback, }: {
         connection: Connection;
-        contextIds: string[];
         defaultViewport: Viewport;
-        closeCallback?: BrowserCloseCallback;
+        closeCallback: BrowserCloseCallback;
     }): Promise<HeadlessBrowser>;
     connection: Connection;
     get _targets(): Map<string, Target>;
-    constructor(connection: Connection, contextIds: string[], defaultViewport: Viewport, closeCallback?: BrowserCloseCallback);
+    constructor(connection: Connection, defaultViewport: Viewport, closeCallback?: BrowserCloseCallback);
     browserContexts(): BrowserContext[];
-    newPage(): Promise<Page>;
-    _createPageInContext(contextId?: string): Promise<Page>;
+    newPage(context: AnySourceMapConsumer | null): Promise<Page>;
+    _createPageInContext(context: AnySourceMapConsumer | null): Promise<Page>;
     targets(): Target[];
     waitForTarget(predicate: (x: Target) => boolean | Promise<boolean>, options?: WaitForTargetOptions): Promise<Target>;
     pages(): Promise<Page[]>;
@@ -50,13 +50,13 @@ export declare class HeadlessBrowser extends EventEmitter {
 }
 export declare class BrowserContext extends EventEmitter {
     #private;
-    constructor(browser: HeadlessBrowser, contextId?: string);
+    constructor(browser: HeadlessBrowser);
     targets(): Target[];
     waitForTarget(predicate: (x: Target) => boolean | Promise<boolean>, options?: {
         timeout?: number;
     }): Promise<Target>;
     pages(): Promise<Page[]>;
-    newPage(): Promise<Page>;
+    newPage(context: AnySourceMapConsumer | null): Promise<Page>;
     browser(): HeadlessBrowser;
 }
 export {};

package/dist/browser/Browser.js

@@ -14,18 +14,18 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
 var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
     if (kind === "m") throw new TypeError("Private method is not writable");
     if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var _HeadlessBrowser_instances, _HeadlessBrowser_defaultViewport, _HeadlessBrowser_closeCallback, _HeadlessBrowser_defaultContext, _HeadlessBrowser_contexts, _HeadlessBrowser_targets, _HeadlessBrowser_targetCreated, _HeadlessBrowser_targetDestroyed, _HeadlessBrowser_targetInfoChanged, _BrowserContext_browser, _BrowserContext_id;
+var _HeadlessBrowser_instances, _HeadlessBrowser_defaultViewport, _HeadlessBrowser_closeCallback, _HeadlessBrowser_defaultContext, _HeadlessBrowser_contexts, _HeadlessBrowser_targets, _HeadlessBrowser_targetCreated, _HeadlessBrowser_targetDestroyed, _HeadlessBrowser_targetInfoChanged, _BrowserContext_browser;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BrowserContext = exports.HeadlessBrowser = void 0;
 const assert_1 = require("./assert");
@@ -33,8 +33,15 @@ const EventEmitter_1 = require("./EventEmitter");
 const Target_1 = require("./Target");
 const util_1 = require("./util");
 class HeadlessBrowser extends EventEmitter_1.EventEmitter {
-    // eslint-disable-next-line max-params
-    constructor(connection, contextIds, defaultViewport, closeCallback) {
+    static async _create({ connection, defaultViewport, closeCallback, }) {
+        const browser = new HeadlessBrowser(connection, defaultViewport, closeCallback);
+        await connection.send('Target.setDiscoverTargets', { discover: true });
+        return browser;
+    }
+    get _targets() {
+        return __classPrivateFieldGet(this, _HeadlessBrowser_targets, "f");
+    }
+    constructor(connection, defaultViewport, closeCallback) {
         super();
         _HeadlessBrowser_instances.add(this);
         _HeadlessBrowser_defaultViewport.set(this, void 0);
@@ -50,32 +57,21 @@ class HeadlessBrowser extends EventEmitter_1.EventEmitter {
             }, "f");
         __classPrivateFieldSet(this, _HeadlessBrowser_defaultContext, new BrowserContext(this), "f");
         __classPrivateFieldSet(this, _HeadlessBrowser_contexts, new Map(), "f");
-        for (const contextId of contextIds) {
-            __classPrivateFieldGet(this, _HeadlessBrowser_contexts, "f").set(contextId, new BrowserContext(this, contextId));
-        }
         __classPrivateFieldSet(this, _HeadlessBrowser_targets, new Map(), "f");
         this.connection.on('Target.targetCreated', __classPrivateFieldGet(this, _HeadlessBrowser_instances, "m", _HeadlessBrowser_targetCreated).bind(this));
         this.connection.on('Target.targetDestroyed', __classPrivateFieldGet(this, _HeadlessBrowser_instances, "m", _HeadlessBrowser_targetDestroyed).bind(this));
         this.connection.on('Target.targetInfoChanged', __classPrivateFieldGet(this, _HeadlessBrowser_instances, "m", _HeadlessBrowser_targetInfoChanged).bind(this));
     }
-    static async _create({ connection, contextIds, defaultViewport, closeCallback, }) {
-        const browser = new HeadlessBrowser(connection, contextIds, defaultViewport, closeCallback);
-        await connection.send('Target.setDiscoverTargets', { discover: true });
-        return browser;
-    }
-    get _targets() {
-        return __classPrivateFieldGet(this, _HeadlessBrowser_targets, "f");
-    }
     browserContexts() {
         return [__classPrivateFieldGet(this, _HeadlessBrowser_defaultContext, "f"), ...Array.from(__classPrivateFieldGet(this, _HeadlessBrowser_contexts, "f").values())];
     }
-    newPage() {
-        return __classPrivateFieldGet(this, _HeadlessBrowser_defaultContext, "f").newPage();
+    newPage(context) {
+        return __classPrivateFieldGet(this, _HeadlessBrowser_defaultContext, "f").newPage(context);
     }
-    async _createPageInContext(contextId) {
+    async _createPageInContext(context) {
         const { targetId } = await this.connection.send('Target.createTarget', {
             url: 'about:blank',
-            browserContextId: contextId || undefined,
+            browserContextId: undefined,
         });
         const target = __classPrivateFieldGet(this, _HeadlessBrowser_targets, "f").get(targetId);
         if (!target) {
@@ -85,9 +81,9 @@ class HeadlessBrowser extends EventEmitter_1.EventEmitter {
         if (!initialized) {
             throw new Error(`Failed to create target for page (id = ${targetId})`);
         }
-        const page = await target.page();
+        const page = await target.page(context);
         if (!page) {
-            throw new Error(`Failed to create a page for context (id = ${contextId})`);
+            throw new Error(`Failed to create a page for context`);
         }
         return page;
     }
@@ -185,12 +181,10 @@ _HeadlessBrowser_defaultViewport = new WeakMap(), _HeadlessBrowser_closeCallback
     }
 };
 class BrowserContext extends EventEmitter_1.EventEmitter {
-    constructor(browser, contextId) {
+    constructor(browser) {
         super();
         _BrowserContext_browser.set(this, void 0);
-        _BrowserContext_id.set(this, void 0);
         __classPrivateFieldSet(this, _BrowserContext_browser, browser, "f");
-        __classPrivateFieldSet(this, _BrowserContext_id, contextId, "f");
     }
     targets() {
         return __classPrivateFieldGet(this, _BrowserContext_browser, "f").targets().filter((target) => {
@@ -205,17 +199,17 @@ class BrowserContext extends EventEmitter_1.EventEmitter {
     async pages() {
         const pages = await Promise.all(this.targets()
             .filter((target) => target.type() === 'page')
-            .map((target) => target.page()));
+            .map((target) => target.page(null)));
         return pages.filter((page) => {
             return Boolean(page);
         });
     }
-    newPage() {
-        return __classPrivateFieldGet(this, _BrowserContext_browser, "f")._createPageInContext(__classPrivateFieldGet(this, _BrowserContext_id, "f"));
+    newPage(context) {
+        return __classPrivateFieldGet(this, _BrowserContext_browser, "f")._createPageInContext(context);
     }
     browser() {
         return __classPrivateFieldGet(this, _BrowserContext_browser, "f");
     }
 }
 exports.BrowserContext = BrowserContext;
-_BrowserContext_browser = new WeakMap(), _BrowserContext_id = new WeakMap();
+_BrowserContext_browser = new WeakMap();

package/dist/browser/BrowserFetcher.d.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import type { Product } from './Product';
-declare type Platform = 'linux' | 'mac' | 'mac_arm' | 'win32' | 'win64';
+type Platform = 'linux' | 'mac' | 'mac_arm' | 'win32' | 'win64';
 interface BrowserFetcherRevisionInfo {
     folderPath: string;
     executablePath: string;

package/dist/browser/BrowserPage.d.ts

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import type { AnySourceMapConsumer } from '../symbolicate-stacktrace';
 import type { HeadlessBrowser } from './Browser';
 import type { CDPSession } from './Connection';
 import { ConsoleMessage } from './ConsoleMessage';
@@ -40,11 +41,18 @@ interface PageEventObject {
 export declare class Page extends EventEmitter {
     #private;
     id: string;
-    static _create(client: CDPSession, target: Target, defaultViewport: Viewport, browser: HeadlessBrowser): Promise<Page>;
+    static _create({ client, target, defaultViewport, browser, sourcemapContext, }: {
+        client: CDPSession;
+        target: Target;
+        defaultViewport: Viewport;
+        browser: HeadlessBrowser;
+        sourcemapContext: AnySourceMapConsumer | null;
+    }): Promise<Page>;
     closed: boolean;
     browser: HeadlessBrowser;
     screenshotTaskQueue: TaskQueue;
-    constructor(client: CDPSession, target: Target, browser: HeadlessBrowser);
+    sourcemapContext: AnySourceMapConsumer | null;
+    constructor(client: CDPSession, target: Target, browser: HeadlessBrowser, sourcemapContext: AnySourceMapConsumer | null);
     /**
      * Listen to page events.
      */
@@ -76,5 +84,6 @@ export declare class Page extends EventEmitter {
     close(options?: {
         runBeforeUnload?: boolean;
     }): Promise<void>;
+    setBrowserSourceMapContext(context: AnySourceMapConsumer | null): void;
 }
 export {};

package/dist/browser/BrowserPage.js

@@ -14,20 +14,23 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
 var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
     if (kind === "m") throw new TypeError("Private method is not writable");
     if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
 var _Page_instances, _Page_client, _Page_target, _Page_timeoutSettings, _Page_frameManager, _Page_pageBindings, _Page_initialize, _Page_onTargetCrashed, _Page_onLogEntryAdded, _Page_onConsoleAPI, _Page_onBindingCalled, _Page_addConsoleMessage;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Page = void 0;
+const remotion_1 = require("remotion");
+const logger_1 = require("../logger");
+const truthy_1 = require("../truthy");
 const assert_1 = require("./assert");
 const ConsoleMessage_1 = require("./ConsoleMessage");
 const EventEmitter_1 = require("./EventEmitter");
@@ -37,7 +40,13 @@ const TaskQueue_1 = require("./TaskQueue");
 const TimeoutSettings_1 = require("./TimeoutSettings");
 const util_1 = require("./util");
 class Page extends EventEmitter_1.EventEmitter {
-    constructor(client, target, browser) {
+    static async _create({ client, target, defaultViewport, browser, sourcemapContext, }) {
+        const page = new Page(client, target, browser, sourcemapContext);
+        await __classPrivateFieldGet(page, _Page_instances, "m", _Page_initialize).call(page);
+        await page.setViewport(defaultViewport);
+        return page;
+    }
+    constructor(client, target, browser, sourcemapContext) {
         super();
         _Page_instances.add(this);
         this.closed = false;
@@ -52,6 +61,7 @@ class Page extends EventEmitter_1.EventEmitter {
         this.screenshotTaskQueue = new TaskQueue_1.TaskQueue();
         this.browser = browser;
         this.id = String(Math.random());
+        this.sourcemapContext = sourcemapContext;
         client.on('Target.attachedToTarget', (event) => {
             switch (event.targetInfo.type) {
                 case 'iframe':
@@ -84,12 +94,34 @@ class Page extends EventEmitter_1.EventEmitter {
         client.on('Log.entryAdded', (event) => {
             return __classPrivateFieldGet(this, _Page_instances, "m", _Page_onLogEntryAdded).call(this, event);
         });
-    }
-    static async _create(client, target, defaultViewport, browser) {
-        const page = new Page(client, target, browser);
-        await __classPrivateFieldGet(page, _Page_instances, "m", _Page_initialize).call(page);
-        await page.setViewport(defaultViewport);
-        return page;
+        this.on('console', (log) => {
+            var _a;
+            const { url, columnNumber, lineNumber } = log.location();
+            if ((url === null || url === void 0 ? void 0 : url.endsWith(remotion_1.Internals.bundleName)) &&
+                lineNumber &&
+                this.sourcemapContext) {
+                const origPosition = (_a = this.sourcemapContext) === null || _a === void 0 ? void 0 : _a.originalPositionFor({
+                    column: columnNumber !== null && columnNumber !== void 0 ? columnNumber : 0,
+                    line: lineNumber,
+                });
+                const file = [
+                    origPosition === null || origPosition === void 0 ? void 0 : origPosition.source,
+                    origPosition === null || origPosition === void 0 ? void 0 : origPosition.line,
+                    origPosition === null || origPosition === void 0 ? void 0 : origPosition.column,
+                ]
+                    .filter(truthy_1.truthy)
+                    .join(':');
+                logger_1.Log.verboseAdvanced({
+                    logLevel: (0, logger_1.getLogLevel)(),
+                    tag: `console.${log.type}()`,
+                    secondTag: [origPosition.name, file].filter(truthy_1.truthy).join('@'),
+                    indent: false,
+                }, log.text);
+            }
+            else {
+                logger_1.Log.verboseAdvanced({ logLevel: (0, logger_1.getLogLevel)(), tag: `console.${log.type}`, indent: false }, log.text);
+            }
+        });
     }
     /**
      * Listen to page events.
@@ -181,6 +213,9 @@ class Page extends EventEmitter_1.EventEmitter {
             await __classPrivateFieldGet(this, _Page_target, "f")._isClosedPromise;
         }
     }
+    setBrowserSourceMapContext(context) {
+        this.sourcemapContext = context;
+    }
 }
 exports.Page = Page;
 _Page_client = new WeakMap(), _Page_target = new WeakMap(), _Page_timeoutSettings = new WeakMap(), _Page_frameManager = new WeakMap(), _Page_pageBindings = new WeakMap(), _Page_instances = new WeakSet(), _Page_initialize = async function _Page_initialize() {

package/dist/browser/BrowserRunner.js

@@ -60,6 +60,7 @@ const assert_1 = require("./assert");
 const Connection_1 = require("./Connection");
 const Errors_1 = require("./Errors");
 const NodeWebSocketTransport_1 = require("./NodeWebSocketTransport");
+const should_log_message_1 = require("./should-log-message");
 const util_1 = require("./util");
 const PROCESS_ERROR_EXPLANATION = `Puppeteer was unable to kill the process which ran the browser binary.
  This means that, on future Puppeteer launches, Puppeteer might not be able to launch the browser.
@@ -95,10 +96,26 @@ class BrowserRunner {
         });
         if (dumpio) {
             (_a = this.proc.stdout) === null || _a === void 0 ? void 0 : _a.on('data', (d) => {
-                logger_1.Log.verboseAdvanced({ indent: options.indent, logLevel: (0, logger_1.getLogLevel)(), tag: 'chrome' }, d.toString().trim());
+                const message = d.toString('utf8').trim();
+                if ((0, should_log_message_1.shouldLogBrowserMessage)(message)) {
+                    const formatted = (0, should_log_message_1.formatChromeMessage)(message);
+                    if (!formatted) {
+                        return;
+                    }
+                    const { output, tag } = formatted;
+                    logger_1.Log.verboseAdvanced({ indent: options.indent, logLevel: (0, logger_1.getLogLevel)(), tag }, output);
+                }
             });
             (_b = this.proc.stderr) === null || _b === void 0 ? void 0 : _b.on('data', (d) => {
-                logger_1.Log.verboseAdvanced({ indent: options.indent, logLevel: (0, logger_1.getLogLevel)(), tag: 'chrome' }, d.toString().trim());
+                const message = d.toString('utf8').trim();
+                if ((0, should_log_message_1.shouldLogBrowserMessage)(message)) {
+                    const formatted = (0, should_log_message_1.formatChromeMessage)(message);
+                    if (!formatted) {
+                        return;
+                    }
+                    const { output, tag } = formatted;
+                    logger_1.Log.verboseAdvanced({ indent: options.indent, logLevel: (0, logger_1.getLogLevel)(), tag }, output);
+                }
             });
         }
         __classPrivateFieldSet(this, _BrowserRunner_closed, false, "f");

package/dist/browser/ConsoleMessage.d.ts

@@ -19,7 +19,7 @@ export interface ConsoleMessageLocation {
     lineNumber?: number;
     columnNumber?: number;
 }
-export declare type ConsoleMessageType = 'log' | 'debug' | 'info' | 'error' | 'warning' | 'dir' | 'dirxml' | 'table' | 'trace' | 'clear' | 'startGroup' | 'startGroupCollapsed' | 'endGroup' | 'assert' | 'profile' | 'profileEnd' | 'count' | 'timeEnd' | 'verbose';
+export type ConsoleMessageType = 'log' | 'debug' | 'info' | 'error' | 'warning' | 'dir' | 'dirxml' | 'table' | 'trace' | 'clear' | 'startGroup' | 'startGroupCollapsed' | 'endGroup' | 'assert' | 'profile' | 'profileEnd' | 'count' | 'timeEnd' | 'verbose';
 export declare class ConsoleMessage {
     #private;
     type: ConsoleMessageType;