@remotion/cli 4.1.0-alpha5 → 4.1.0-alpha8

package/dist/symbolicate-error.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.symbolicateError = void 0;
+const symbolicate_stacktrace_1 = require("../symbolicate-stacktrace");
+const handle_javascript_exception_1 = require("./handle-javascript-exception");
+const truthy_1 = require("./truthy");
+const symbolicateError = async (symbolicateableError) => {
+    const { delayRenderCall, stackFrame } = symbolicateableError;
+    const [mainErrorFrames, delayRenderFrames] = await Promise.all([
+        stackFrame ? (0, symbolicate_stacktrace_1.symbolicateStackTraceFromRemoteFrames)(stackFrame) : null,
+        delayRenderCall
+            ? (0, symbolicate_stacktrace_1.symbolicateStackTraceFromRemoteFrames)(delayRenderCall)
+            : null,
+    ].filter(truthy_1.truthy));
+    const symbolicatedErr = new handle_javascript_exception_1.ErrorWithStackFrame({
+        message: symbolicateableError.message,
+        symbolicatedStackFrames: mainErrorFrames,
+        frame: symbolicateableError.frame,
+        name: symbolicateableError.name,
+        delayRenderCall: delayRenderFrames,
+    });
+    return symbolicatedErr;
+};
+exports.symbolicateError = symbolicateError;

package/dist/symbolicate-errors.d.ts

@@ -0,0 +1,7 @@
+import type { SymbolicatedStackFrame, UnsymbolicatedStackFrame } from '@remotion/renderer';
+import type { SourceMapConsumer } from 'source-map';
+import { ErrorWithStackFrame } from './error-with-stack-frame';
+export declare const symbolicateError: (symbolicateableError: SymbolicateableError) => Promise<ErrorWithStackFrame>;
+export declare const symbolicateStackTraceFromRemoteFrames: (frames: UnsymbolicatedStackFrame[]) => Promise<SymbolicatedStackFrame[]>;
+export declare const getSourceMapFromRemoteFile: (fileName: string) => Promise<any>;
+export declare const symbolicateFromSources: (frames: UnsymbolicatedStackFrame[], mapValues: Record<string, SourceMapConsumer | null>) => SymbolicatedStackFrame[];

package/dist/symbolicate-errors.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.symbolicateFromSources = exports.getSourceMapFromRemoteFile = exports.symbolicateStackTraceFromRemoteFrames = exports.symbolicateError = void 0;
+const renderer_1 = require("@remotion/renderer");
+const truthy_1 = require("./truthy");
+const error_with_stack_frame_1 = require("./error-with-stack-frame");
+const symbolicateError = async (symbolicateableError) => {
+    const { delayRenderCall, stackFrame } = symbolicateableError;
+    const [mainErrorFrames, delayRenderFrames] = await Promise.all([
+        stackFrame ? (0, exports.symbolicateStackTraceFromRemoteFrames)(stackFrame) : null,
+        delayRenderCall
+            ? (0, exports.symbolicateStackTraceFromRemoteFrames)(delayRenderCall)
+            : null,
+    ].filter(truthy_1.truthy));
+    const symbolicatedErr = new error_with_stack_frame_1.ErrorWithStackFrame({
+        message: symbolicateableError.message,
+        symbolicatedStackFrames: mainErrorFrames,
+        frame: symbolicateableError.frame,
+        name: symbolicateableError.name,
+        delayRenderCall: delayRenderFrames,
+    });
+    return symbolicatedErr;
+};
+exports.symbolicateError = symbolicateError;
+const symbolicateStackTraceFromRemoteFrames = async (frames) => {
+    const uniqueFileNames = [
+        ...new Set(frames
+            .map((f) => f.fileName)
+            .filter((f) => f.startsWith('http://') || f.startsWith('https://'))
+            .filter(truthy_1.truthy)),
+    ];
+    const maps = await Promise.all(uniqueFileNames.map((fileName) => {
+        return (0, exports.getSourceMapFromRemoteFile)(fileName);
+    }));
+    const mapValues = {};
+    for (let i = 0; i < uniqueFileNames.length; i++) {
+        mapValues[uniqueFileNames[i]] = maps[i];
+    }
+    return (0, exports.symbolicateFromSources)(frames, mapValues);
+};
+exports.symbolicateStackTraceFromRemoteFrames = symbolicateStackTraceFromRemoteFrames;
+const getSourceMapFromRemoteFile = async (fileName) => {
+    const fileContents = await renderer_1.RenderInternals.fetchUrl(fileName);
+    return renderer_1.RenderInternals.getSourceMap(fileName, fileContents, 'remote');
+};
+exports.getSourceMapFromRemoteFile = getSourceMapFromRemoteFile;
+const symbolicateFromSources = (frames, mapValues) => {
+    return frames
+        .map((frame) => {
+        const map = mapValues[frame.fileName];
+        if (!map) {
+            return null;
+        }
+        return symbolicateStackFrame(frame, map);
+    })
+        .filter(truthy_1.truthy);
+};
+exports.symbolicateFromSources = symbolicateFromSources;
+const symbolicateStackFrame = (frame, map) => {
+    const pos = getOriginalPosition(map, frame.lineNumber, frame.columnNumber);
+    const hasSource = pos.source ? map.sourceContentFor(pos.source, false) : null;
+    const scriptCode = hasSource && pos.line
+        ? getLinesAround(pos.line, 3, hasSource.split('\n'))
+        : null;
+    return {
+        originalColumnNumber: pos.column,
+        originalFileName: pos.source,
+        originalFunctionName: frame.functionName,
+        originalLineNumber: pos.line,
+        originalScriptCode: scriptCode,
+    };
+};
+const getOriginalPosition = (source_map, line, column) => {
+    const result = source_map.originalPositionFor({
+        line,
+        column,
+    });
+    return { line: result.line, column: result.column, source: result.source };
+};
+function getLinesAround(line, count, lines) {
+    const result = [];
+    for (let index = Math.max(0, line - 1 - count) + 1; index <= Math.min(lines.length - 1, line - 1 + count); ++index) {
+        result.push({
+            lineNumber: index + 1,
+            content: lines[index],
+            highlight: index + 1 === line,
+        });
+    }
+    return result;
+}

package/dist/symbolicate-stacktrace.d.ts

@@ -0,0 +1,28 @@
+import type { BasicSourceMapConsumer, IndexedSourceMapConsumer } from 'source-map';
+import { SourceMapConsumer } from 'source-map';
+import type { UnsymbolicatedStackFrame } from './parse-browser-error-stack';
+type ScriptLine = {
+    lineNumber: number;
+    content: string;
+    highlight: boolean;
+};
+export type SymbolicatedStackFrame = {
+    originalFunctionName: string | null;
+    originalFileName: string | null;
+    originalLineNumber: number | null;
+    originalColumnNumber: number | null;
+    originalScriptCode: ScriptLine[] | null;
+};
+export declare const symbolicateStackTraceFromRemoteFrames: (frames: UnsymbolicatedStackFrame[]) => Promise<SymbolicatedStackFrame[]>;
+export declare const symbolicateFromSources: (frames: UnsymbolicatedStackFrame[], mapValues: Record<string, SourceMapConsumer | null>) => SymbolicatedStackFrame[];
+export declare const symbolicateStackFrame: (frame: UnsymbolicatedStackFrame, map: SourceMapConsumer) => {
+    originalColumnNumber: number | null;
+    originalFileName: string | null;
+    originalFunctionName: any;
+    originalLineNumber: number | null;
+    originalScriptCode: ScriptLine[] | null;
+};
+export declare const getSourceMapFromRemoteFile: (fileName: string) => Promise<SourceMapConsumer | null>;
+export declare const getSourceMapFromLocalFile: (fileName: string) => Promise<SourceMapConsumer | null>;
+export type AnySourceMapConsumer = BasicSourceMapConsumer | IndexedSourceMapConsumer;
+export {};

package/dist/symbolicate-stacktrace.js

@@ -0,0 +1,135 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSourceMapFromLocalFile = exports.getSourceMapFromRemoteFile = exports.symbolicateStackFrame = exports.symbolicateFromSources = exports.symbolicateStackTraceFromRemoteFrames = void 0;
+const fs_1 = require("fs");
+const path_1 = __importDefault(require("path"));
+const source_map_1 = require("source-map");
+const read_file_1 = require("./assets/read-file");
+const truthy_1 = require("./truthy");
+function extractSourceMapUrl(fileContents) {
+    const regex = /\/\/[#@] ?sourceMappingURL=([^\s'"]+)\s*$/gm;
+    let match = null;
+    for (;;) {
+        const next = regex.exec(fileContents);
+        if (next === null || next === undefined) {
+            break;
+        }
+        match = next;
+    }
+    if (!(match === null || match === void 0 ? void 0 : match[1])) {
+        return null;
+    }
+    return match[1].toString();
+}
+const getSourceMap = async (filePath, fileContents, type) => {
+    const sm = extractSourceMapUrl(fileContents);
+    if (sm === null) {
+        return null;
+    }
+    if (sm.indexOf('data:') === 0) {
+        const base64 = /^data:application\/json;([\w=:"-]+;)*base64,/;
+        const match2 = sm.match(base64);
+        if (!match2) {
+            throw new Error('Sorry, non-base64 inline source-map encoding is not supported.');
+        }
+        const converted = window.atob(sm.substring(match2[0].length));
+        return new source_map_1.SourceMapConsumer(JSON.parse(converted));
+    }
+    if (type === 'local') {
+        // Find adjacent file: bundle.js -> bundle.js.map
+        const newFilePath = path_1.default.join(path_1.default.dirname(filePath), sm);
+        return new source_map_1.SourceMapConsumer((0, fs_1.readFileSync)(newFilePath, 'utf8'));
+    }
+    const index = filePath.lastIndexOf('/');
+    const url = filePath.substring(0, index + 1) + sm;
+    const obj = await fetchUrl(url);
+    return new source_map_1.SourceMapConsumer(obj);
+};
+const fetchUrl = async (url) => {
+    const res = await (0, read_file_1.readFile)(url);
+    return new Promise((resolve, reject) => {
+        let downloaded = '';
+        res.on('data', (d) => {
+            downloaded += d;
+        });
+        res.on('end', () => {
+            resolve(downloaded);
+        });
+        res.on('error', (err) => reject(err));
+    });
+};
+function getLinesAround(line, count, lines) {
+    const result = [];
+    for (let index = Math.max(0, line - 1 - count) + 1; index <= Math.min(lines.length - 1, line - 1 + count); ++index) {
+        result.push({
+            lineNumber: index + 1,
+            content: lines[index],
+            highlight: index + 1 === line,
+        });
+    }
+    return result;
+}
+const getOriginalPosition = (source_map, line, column) => {
+    const result = source_map.originalPositionFor({
+        line,
+        column,
+    });
+    return { line: result.line, column: result.column, source: result.source };
+};
+const symbolicateStackTraceFromRemoteFrames = async (frames) => {
+    const uniqueFileNames = [
+        ...new Set(frames
+            .map((f) => f.fileName)
+            .filter((f) => f.startsWith('http://') || f.startsWith('https://'))
+            .filter(truthy_1.truthy)),
+    ];
+    const maps = await Promise.all(uniqueFileNames.map((fileName) => {
+        return (0, exports.getSourceMapFromRemoteFile)(fileName);
+    }));
+    const mapValues = {};
+    for (let i = 0; i < uniqueFileNames.length; i++) {
+        mapValues[uniqueFileNames[i]] = maps[i];
+    }
+    return (0, exports.symbolicateFromSources)(frames, mapValues);
+};
+exports.symbolicateStackTraceFromRemoteFrames = symbolicateStackTraceFromRemoteFrames;
+const symbolicateFromSources = (frames, mapValues) => {
+    return frames
+        .map((frame) => {
+        const map = mapValues[frame.fileName];
+        if (!map) {
+            return null;
+        }
+        return (0, exports.symbolicateStackFrame)(frame, map);
+    })
+        .filter(truthy_1.truthy);
+};
+exports.symbolicateFromSources = symbolicateFromSources;
+const symbolicateStackFrame = (frame, map) => {
+    const pos = getOriginalPosition(map, frame.lineNumber, frame.columnNumber);
+    const hasSource = pos.source ? map.sourceContentFor(pos.source, false) : null;
+    const scriptCode = hasSource && pos.line
+        ? getLinesAround(pos.line, 3, hasSource.split('\n'))
+        : null;
+    return {
+        originalColumnNumber: pos.column,
+        originalFileName: pos.source,
+        originalFunctionName: frame.functionName,
+        originalLineNumber: pos.line,
+        originalScriptCode: scriptCode,
+    };
+};
+exports.symbolicateStackFrame = symbolicateStackFrame;
+const getSourceMapFromRemoteFile = async (fileName) => {
+    const fileContents = await fetchUrl(fileName);
+    return getSourceMap(fileName, fileContents, 'remote');
+};
+exports.getSourceMapFromRemoteFile = getSourceMapFromRemoteFile;
+const getSourceMapFromLocalFile = (fileName) => {
+    const fileContents = (0, fs_1.readFileSync)(fileName, 'utf8');
+    return getSourceMap(fileName, fileContents, 'local');
+};
+exports.getSourceMapFromLocalFile = getSourceMapFromLocalFile;

package/dist/symbolicateable-error.d.ts

@@ -0,0 +1,16 @@
+/**
+ * A symbolicateable error is an error that can be symolicated by fetching the original sources. By throwing a symbolicateable error, Remotion CLI will attempt to symplicate it
+ */
+import type { UnsymbolicatedStackFrame } from '../parse-browser-error-stack';
+export declare class SymbolicateableError extends Error {
+    stackFrame: UnsymbolicatedStackFrame[] | null;
+    delayRenderCall: UnsymbolicatedStackFrame[] | null;
+    frame: number | null;
+    constructor({ message, stack, stackFrame, frame, name, }: {
+        message: string;
+        stack: string | undefined;
+        frame: number | null;
+        name: string;
+        stackFrame: UnsymbolicatedStackFrame[] | null;
+    });
+}

package/dist/symbolicateable-error.js

@@ -0,0 +1,18 @@
+"use strict";
+/**
+ * A symbolicateable error is an error that can be symolicated by fetching the original sources. By throwing a symbolicateable error, Remotion CLI will attempt to symplicate it
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SymbolicateableError = void 0;
+const delay_render_embedded_stack_1 = require("../delay-render-embedded-stack");
+class SymbolicateableError extends Error {
+    constructor({ message, stack, stackFrame, frame, name, }) {
+        super(message);
+        this.stack = stack;
+        this.stackFrame = stackFrame;
+        this.frame = frame;
+        this.name = name;
+        this.delayRenderCall = stack ? (0, delay_render_embedded_stack_1.parseDelayRenderEmbeddedStack)(stack) : null;
+    }
+}
+exports.SymbolicateableError = SymbolicateableError;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/cli",
-  "version": "4.1.0-alpha5",
+  "version": "4.1.0-alpha8",
   "description": "CLI for Remotion",
   "main": "dist/index.js",
   "sideEffects": false,
@@ -33,13 +33,13 @@
     "minimist": "1.2.6",
     "open": "^8.4.2",
     "prompts": "2.4.1",
-    "semver": "7.3.5",
+    "semver": "7.5.3",
     "source-map": "0.6.1",
-    "@remotion/media-utils": "4.1.0-alpha5",
-    "@remotion/player": "4.1.0-alpha5",
-    "@remotion/renderer": "4.1.0-alpha5",
-    "@remotion/bundler": "4.1.0-alpha5",
-    "remotion": "4.1.0-alpha5"
+    "@remotion/bundler": "4.1.0-alpha8",
+    "@remotion/player": "4.1.0-alpha8",
+    "@remotion/media-utils": "4.1.0-alpha8",
+    "@remotion/renderer": "4.1.0-alpha8",
+    "remotion": "4.1.0-alpha8"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -56,7 +56,7 @@
     "@types/semver": "^7.3.4",
     "eslint": "8.42.0",
     "eslint-plugin-10x": "1.5.2",
-    "eslint-plugin-react": "7.29.4",
+    "eslint-plugin-react": "7.32.2",
     "eslint-plugin-react-hooks": "4.4.0",
     "prettier": "^2.7.1",
     "prettier-plugin-organize-imports": "^2.3.4",
@@ -65,8 +65,8 @@
     "typescript": "4.9.5",
     "vitest": "0.31.1",
     "zod": "^3.21.4",
-    "@remotion/tailwind": "4.1.0-alpha5",
-    "@remotion/zod-types": "4.1.0-alpha5"
+    "@remotion/zod-types": "4.1.0-alpha8",
+    "@remotion/tailwind": "4.1.0-alpha8"
   },
   "keywords": [
     "remotion",