@jsenv/terminal-recorder 1.1.1 → 1.1.3

package/dist/js/terminal_recorder.js

@@ -1194,6 +1194,8 @@ const initTerminal = ({
     }
   };
 
+  log("init", { cols, rows, fontFamily, fontSize, convertEol, gif, video });
+
   const cssUrl = new URL("/css/xterm.css", import.meta.url);
   const link = document.createElement("link");
   link.rel = "stylesheet";
@@ -1314,7 +1316,24 @@ const initTerminal = ({
           };
           mediaRecorder.start();
         });
-        await startPromise;
+        let timeout;
+        let hasTimedout = false;
+        const MS_ALLOCATED_TO_MEDIA_RECORDER = 2_000;
+        await Promise.race([
+          startPromise,
+          new Promise((resolve) => {
+            timeout = setTimeout(() => {
+              hasTimedout = true;
+              resolve();
+            }, MS_ALLOCATED_TO_MEDIA_RECORDER);
+          }),
+        ]);
+        if (hasTimedout) {
+          throw new Error(
+            `media recorder did not start in less than ${MS_ALLOCATED_TO_MEDIA_RECORDER}ms`,
+          );
+        }
+        clearTimeout(timeout);
         log("media recorder started");
 
         stopCallbackSet.add(async () => {
@@ -1410,6 +1429,7 @@ const initTerminal = ({
       return {
         writeIntoTerminal: async (data) => {
           await new Promise((resolve) => {
+            log(`write data: "${data}"`);
             term.write(data, () => {
               term._core._renderService._renderDebouncer._innerRefresh();
               replicateXterm();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/terminal-recorder",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "Record terminal output as .svg, .gif, .webm, .mp4",
   "license": "MIT",
   "repository": {
@@ -32,11 +32,11 @@
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "@jsenv/server": "15.2.4",
-    "@playwright/browser-chromium": "1.45.0",
+    "@jsenv/server": "15.2.6",
+    "@playwright/browser-webkit": "1.45.1",
     "ansi-regex": "6.0.1",
     "he": "1.2.0",
-    "playwright": "1.45.0",
+    "playwright": "1.45.1",
     "strip-ansi": "7.1.0",
     "string-width": "5.1.2",
     "webm-to-mp4": "1.0.0"

package/src/client/source.txt

@@ -0,0 +1,47 @@
+------------ 3 executions to run ------------
+1 with chromium (chromium@120.0.6099.28)
+1 with firefox (firefox@119.0)
+1 with webkit (webkit@17.4)
+---------------------------------------------
+
+✔ console.spec.html [chromium/<mock>/<mock>] 1/3 (1 completed, 2 remaining)
+----- console (✖ 1 ⚠ 3 ℹ 1 ◆ 1) ------
+⚠ toto
+✖ hey
+⚠ hey
+  ho
+ℹ info
+⚠ test
+  multiline
+◆ verbose log
+  la
+--------------------------------------
+✔ console.spec.html [firefox/<mock>] 2/3 (2 completed, 1 remaining)
+----- console (✖ 1 ⚠ 3 ℹ 1 ◆ 1) ------
+⚠ toto
+✖ hey
+⚠ hey
+  ho
+ℹ info
+⚠ test
+  multiline
+◆ verbose log
+  la
+--------------------------------------
+✔ console.spec.html [webkit/<mock>] 3/3 (all completed)
+----- console (✖ 1 ⚠ 3 ℹ 1 ◆ 1) ------
+⚠ toto
+✖ hey
+⚠ hey
+  ho
+ℹ info
+⚠ test
+  multiline
+◆ verbose log
+  la
+--------------------------------------
+
+------------------ summary ------------------
+3 executions: all completed
+duration: <mock>
+---------------------------------------------

package/src/client/terminal_recorder.js

@@ -43,6 +43,8 @@ export const initTerminal = ({
     }
   };
 
+  log("init", { cols, rows, fontFamily, fontSize, convertEol, gif, video });
+
   const cssUrl = new URL("xterm/css/xterm.css", import.meta.url);
   const link = document.createElement("link");
   link.rel = "stylesheet";
@@ -163,7 +165,24 @@ export const initTerminal = ({
           };
           mediaRecorder.start();
         });
-        await startPromise;
+        let timeout;
+        let hasTimedout = false;
+        const MS_ALLOCATED_TO_MEDIA_RECORDER = 2_000;
+        await Promise.race([
+          startPromise,
+          new Promise((resolve) => {
+            timeout = setTimeout(() => {
+              hasTimedout = true;
+              resolve();
+            }, MS_ALLOCATED_TO_MEDIA_RECORDER);
+          }),
+        ]);
+        if (hasTimedout) {
+          throw new Error(
+            `media recorder did not start in less than ${MS_ALLOCATED_TO_MEDIA_RECORDER}ms`,
+          );
+        }
+        clearTimeout(timeout);
         log("media recorder started");
 
         stopCallbackSet.add(async () => {
@@ -259,6 +278,7 @@ export const initTerminal = ({
       return {
         writeIntoTerminal: async (data) => {
           await new Promise((resolve) => {
+            log(`write data: "${data}"`);
             term.write(data, () => {
               term._core._renderService._renderDebouncer._innerRefresh();
               replicateXterm();

package/src/client/xterm_dev.html

@@ -19,12 +19,17 @@
           repeat: true,
           msAddedAtTheEnd: 3_000,
         },
-        video: true,
+        logs: true,
+        // video: true,
       });
       const { writeIntoTerminal, stopRecording } = await startRecording();
-      writeIntoTerminal("hello\n");
-      await new Promise((resolve) => setTimeout(resolve, 500));
-      writeIntoTerminal("world");
+      const sourceResponse = await fetch("./source.txt");
+      const source = await sourceResponse.text();
+      const lines = source.split("\n");
+      for (const line of lines) {
+        writeIntoTerminal(`${line}\n`);
+        await new Promise((resolve) => setTimeout(resolve, 200));
+      }
       await new Promise((resolve) => setTimeout(resolve, 1000));
       const terminalRecords = await stopRecording();
       const video = terminalRecords.video;

package/src/terminal_recording.js

@@ -90,10 +90,10 @@ export const startTerminalRecording = async ({
     });
   }
   if (gif || video) {
-    const { chromium } = await import("playwright");
+    const { webkit } = await import("playwright");
     const server = await startLocalServer();
-    const browser = await chromium.launch({
-      channel: "chrome", // https://github.com/microsoft/playwright/issues/7716#issuecomment-882634893
+    const browser = await webkit.launch({
+      // channel: "chrome", // https://github.com/microsoft/playwright/issues/7716#issuecomment-882634893
       headless: !debug,
       // needed because https-localhost fails to trust cert on chrome + linux (ubuntu 20.04)
       args: ["--ignore-certificate-errors"],