@smoothdeploy/playwright-core 1.57.1 → 1.58.1-beta-1770452953000

package/lib/server/registry/oopDownloadBrowserMain.js

@@ -29,6 +29,7 @@ var import_path = __toESM(require("path"));
 var import_manualPromise = require("../../utils/isomorphic/manualPromise");
 var import_network = require("../utils/network");
 var import_zipBundle = require("../../zipBundle");
+var import_fileUtils = require("../utils/fileUtils");
 function log(message) {
   process.send?.({ method: "log", params: { message } });
 }
@@ -99,6 +100,8 @@ function downloadFile(options) {
 async function main(options) {
   await downloadFile(options);
   log(`SUCCESS downloading ${options.title}`);
+  log(`removing existing browser directory if any`);
+  await (0, import_fileUtils.removeFolders)([options.browserDirectory]);
   log(`extracting archive`);
   await (0, import_zipBundle.extract)(options.zipPath, { dir: options.browserDirectory });
   if (options.executablePath) {

package/lib/server/screencast.js

@@ -0,0 +1,190 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var screencast_exports = {};
+__export(screencast_exports, {
+  Screencast: () => Screencast
+});
+module.exports = __toCommonJS(screencast_exports);
+var import_path = __toESM(require("path"));
+var import_utils = require("../utils");
+var import_utils2 = require("../utils");
+var import_videoRecorder = require("./videoRecorder");
+var import_page = require("./page");
+var import_registry = require("./registry");
+class Screencast {
+  constructor(page) {
+    this._videoRecorder = null;
+    this._videoId = null;
+    this._screencastClients = /* @__PURE__ */ new Set();
+    // Aiming at 25 fps by default - each frame is 40ms, but we give some slack with 35ms.
+    // When throttling for tracing, 200ms between frames, except for 10 frames around the action.
+    this._frameThrottler = new FrameThrottler(10, 35, 200);
+    this._frameListener = null;
+    this._page = page;
+  }
+  stopFrameThrottler() {
+    this._frameThrottler.dispose();
+  }
+  setOptions(options) {
+    this._setOptions(options).catch((e) => import_utils2.debugLogger.log("error", e));
+    this._frameThrottler.setThrottlingEnabled(!!options);
+  }
+  throttleFrameAck(ack) {
+    this._frameThrottler.ack(ack);
+  }
+  temporarilyDisableThrottling() {
+    this._frameThrottler.recharge();
+  }
+  launchVideoRecorder() {
+    const recordVideo = this._page.browserContext._options.recordVideo;
+    if (!recordVideo)
+      return void 0;
+    (0, import_utils.assert)(!this._videoId);
+    this._videoId = (0, import_utils.createGuid)();
+    const outputFile = import_path.default.join(recordVideo.dir, this._videoId + ".webm");
+    const videoOptions = {
+      // validateBrowserContextOptions ensures correct video size.
+      ...recordVideo.size,
+      outputFile
+    };
+    const ffmpegPath = import_registry.registry.findExecutable("ffmpeg").executablePathOrDie(this._page.browserContext._browser.sdkLanguage());
+    this._videoRecorder = new import_videoRecorder.VideoRecorder(ffmpegPath, videoOptions);
+    this._frameListener = import_utils.eventsHelper.addEventListener(this._page, import_page.Page.Events.ScreencastFrame, (frame) => this._videoRecorder.writeFrame(frame.buffer, frame.frameSwapWallTime / 1e3));
+    this._page.waitForInitializedOrError().then((p) => {
+      if (p instanceof Error)
+        this.stopVideoRecording().catch(() => {
+        });
+    });
+    return videoOptions;
+  }
+  async startVideoRecording(options) {
+    const videoId = this._videoId;
+    (0, import_utils.assert)(videoId);
+    this._page.once(import_page.Page.Events.Close, () => this.stopVideoRecording().catch(() => {
+    }));
+    const gotFirstFrame = new Promise((f) => this._page.once(import_page.Page.Events.ScreencastFrame, f));
+    await this._startScreencast(this._videoRecorder, {
+      quality: 90,
+      width: options.width,
+      height: options.height
+    });
+    gotFirstFrame.then(() => {
+      this._page.browserContext._browser._videoStarted(this._page.browserContext, videoId, options.outputFile, this._page.waitForInitializedOrError());
+    });
+  }
+  async stopVideoRecording() {
+    if (!this._videoId)
+      return;
+    if (this._frameListener)
+      import_utils.eventsHelper.removeEventListeners([this._frameListener]);
+    this._frameListener = null;
+    const videoId = this._videoId;
+    this._videoId = null;
+    const videoRecorder = this._videoRecorder;
+    this._videoRecorder = null;
+    await this._stopScreencast(videoRecorder);
+    await videoRecorder.stop();
+    const video = this._page.browserContext._browser._takeVideo(videoId);
+    video?.reportFinished();
+  }
+  async _setOptions(options) {
+    if (options)
+      await this._startScreencast(this, options);
+    else
+      await this._stopScreencast(this);
+  }
+  async _startScreencast(client, options) {
+    this._screencastClients.add(client);
+    if (this._screencastClients.size === 1) {
+      await this._page.delegate.startScreencast({
+        width: options.width,
+        height: options.height,
+        quality: options.quality
+      });
+    }
+  }
+  async _stopScreencast(client) {
+    this._screencastClients.delete(client);
+    if (!this._screencastClients.size)
+      await this._page.delegate.stopScreencast();
+  }
+}
+class FrameThrottler {
+  constructor(nonThrottledFrames, defaultInterval, throttlingInterval) {
+    this._acks = [];
+    this._throttlingEnabled = false;
+    this._nonThrottledFrames = nonThrottledFrames;
+    this._budget = nonThrottledFrames;
+    this._defaultInterval = defaultInterval;
+    this._throttlingInterval = throttlingInterval;
+    this._tick();
+  }
+  dispose() {
+    if (this._timeoutId) {
+      clearTimeout(this._timeoutId);
+      this._timeoutId = void 0;
+    }
+  }
+  setThrottlingEnabled(enabled) {
+    this._throttlingEnabled = enabled;
+  }
+  recharge() {
+    for (const ack of this._acks)
+      ack();
+    this._acks = [];
+    this._budget = this._nonThrottledFrames;
+    if (this._timeoutId) {
+      clearTimeout(this._timeoutId);
+      this._tick();
+    }
+  }
+  ack(ack) {
+    if (!this._timeoutId) {
+      ack();
+      return;
+    }
+    this._acks.push(ack);
+  }
+  _tick() {
+    const ack = this._acks.shift();
+    if (ack) {
+      --this._budget;
+      ack();
+    }
+    if (this._throttlingEnabled && this._budget <= 0) {
+      this._timeoutId = setTimeout(() => this._tick(), this._throttlingInterval);
+    } else {
+      this._timeoutId = setTimeout(() => this._tick(), this._defaultInterval);
+    }
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Screencast
+});

package/lib/server/screenshotCompositor.js

@@ -0,0 +1,153 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var screenshotCompositor_exports = {};
+__export(screenshotCompositor_exports, {
+  compositeHighlight: () => compositeHighlight,
+  cropFullWidth: () => cropFullWidth,
+  cropRegion: () => cropRegion,
+  resizeToWidth: () => resizeToWidth,
+  setPixel: () => setPixel
+});
+module.exports = __toCommonJS(screenshotCompositor_exports);
+var import_utilsBundle = require("../utilsBundle");
+function setPixel(data, width, height, x, y, color) {
+  if (x < 0 || x >= width || y < 0 || y >= height)
+    return;
+  const i = (y * width + x) * 4;
+  data[i] = color.r;
+  data[i + 1] = color.g;
+  data[i + 2] = color.b;
+  data[i + 3] = 255;
+}
+function cropFullWidth(data, imgWidth, imgHeight, by, bh) {
+  const cw = imgWidth;
+  let ch = Math.min(imgHeight, Math.round(cw / (16 / 9)));
+  const elementCenterY = by + Math.round(bh / 2);
+  let cy = Math.max(0, elementCenterY - Math.round(ch / 2));
+  if (cy + ch > imgHeight)
+    cy = Math.max(0, imgHeight - ch);
+  ch = Math.min(imgHeight - cy, ch);
+  const cropped = Buffer.alloc(cw * ch * 4);
+  for (let row = 0; row < ch; row++) {
+    const srcOffset = (cy + row) * cw * 4;
+    const dstOffset = row * cw * 4;
+    data.copy(cropped, dstOffset, srcOffset, srcOffset + cw * 4);
+  }
+  return { data: cropped, width: cw, height: ch };
+}
+function resizeToWidth(src, targetWidth) {
+  if (src.width === targetWidth)
+    return src;
+  const targetHeight = Math.round(src.height * targetWidth / src.width);
+  if (targetHeight <= 0 || targetWidth <= 0)
+    return src;
+  const dst = Buffer.alloc(targetWidth * targetHeight * 4);
+  const xRatio = src.width / targetWidth;
+  const yRatio = src.height / targetHeight;
+  for (let y = 0; y < targetHeight; y++) {
+    const srcY = Math.min(Math.floor(y * yRatio), src.height - 1);
+    for (let x = 0; x < targetWidth; x++) {
+      const srcX = Math.min(Math.floor(x * xRatio), src.width - 1);
+      const si = (srcY * src.width + srcX) * 4;
+      const di = (y * targetWidth + x) * 4;
+      dst[di] = src.data[si];
+      dst[di + 1] = src.data[si + 1];
+      dst[di + 2] = src.data[si + 2];
+      dst[di + 3] = src.data[si + 3];
+    }
+  }
+  return { data: dst, width: targetWidth, height: targetHeight };
+}
+function cropRegion(data, imgWidth, imgHeight, bx, by, bw, bh, dpr, padPx = 50) {
+  const pad = padPx * dpr;
+  let cx = Math.max(0, bx - pad);
+  let cy = Math.max(0, by - pad);
+  let cw = Math.min(imgWidth - cx, bw + 2 * pad);
+  let ch = Math.min(imgHeight - cy, bh + 2 * pad);
+  const targetRatio = 16 / 9;
+  if (cw / ch < targetRatio) {
+    const newCw = Math.round(ch * targetRatio);
+    const expand = newCw - cw;
+    cx = Math.max(0, cx - Math.round(expand / 2));
+    cw = Math.min(imgWidth - cx, newCw);
+  } else {
+    const newCh = Math.round(cw / targetRatio);
+    const expand = newCh - ch;
+    cy = Math.max(0, cy - Math.round(expand / 2));
+    ch = Math.min(imgHeight - cy, newCh);
+  }
+  const cropped = Buffer.alloc(cw * ch * 4);
+  for (let row = 0; row < ch; row++) {
+    const srcOffset = ((cy + row) * imgWidth + cx) * 4;
+    const dstOffset = row * cw * 4;
+    data.copy(cropped, dstOffset, srcOffset, srcOffset + cw * 4);
+  }
+  return { data: cropped, width: cw, height: ch };
+}
+function compositeHighlight(pngBuffer, box, viewport) {
+  const png = import_utilsBundle.PNG.sync.read(pngBuffer);
+  const { width, height, data } = png;
+  const scaleX = viewport ? width / viewport.width : 1;
+  const scaleY = viewport ? height / viewport.height : 1;
+  const bx = Math.max(0, Math.round(box.x * scaleX));
+  const by = Math.max(0, Math.round(box.y * scaleY));
+  const bw = Math.min(width - bx, Math.round(box.width * scaleX));
+  const bh = Math.min(height - by, Math.round(box.height * scaleY));
+  for (let y = 0; y < height; y++) {
+    for (let x = 0; x < width; x++) {
+      if (x >= bx && x < bx + bw && y >= by && y < by + bh)
+        continue;
+      const i = (y * width + x) * 4;
+      data[i] = data[i] * 0.5 | 0;
+      data[i + 1] = data[i + 1] * 0.5 | 0;
+      data[i + 2] = data[i + 2] * 0.5 | 0;
+    }
+  }
+  const borderColor = { r: 255, g: 0, b: 0 };
+  const dpr = Math.round(scaleX) || 1;
+  const offset = 2 * dpr;
+  const thickness = 3 * dpr;
+  const ox = bx - offset - thickness;
+  const oy = by - offset - thickness;
+  const ow = bw + (offset + thickness) * 2;
+  const oh = bh + (offset + thickness) * 2;
+  for (let t = 0; t < thickness; t++) {
+    for (let x = ox; x < ox + ow; x++)
+      setPixel(data, width, height, x, oy + t, borderColor);
+    for (let x = ox; x < ox + ow; x++)
+      setPixel(data, width, height, x, oy + oh - 1 - t, borderColor);
+    for (let y = oy; y < oy + oh; y++)
+      setPixel(data, width, height, ox + t, y, borderColor);
+    for (let y = oy; y < oy + oh; y++)
+      setPixel(data, width, height, ox + ow - 1 - t, y, borderColor);
+  }
+  const fullData = Buffer.from(data.buffer, data.byteOffset, data.byteLength);
+  const full = resizeToWidth(cropFullWidth(fullData, width, height, by, bh), NORMALIZED_WIDTH);
+  const cropped = resizeToWidth(cropRegion(fullData, width, height, bx, by, bw, bh, dpr, 50), NORMALIZED_WIDTH);
+  return { full, cropped };
+}
+const NORMALIZED_WIDTH = 1280;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  compositeHighlight,
+  cropFullWidth,
+  cropRegion,
+  resizeToWidth,
+  setPixel
+});

package/lib/server/trace/recorder/snapshotterInjected.js

@@ -61,6 +61,7 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
     constructor() {
       this._lastSnapshotNumber = 0;
       this._staleStyleSheets = /* @__PURE__ */ new Set();
+      this._modifiedStyleSheets = /* @__PURE__ */ new Set();
       this._readingStyleSheet = false;
       const invalidateCSSGroupingRule = (rule) => {
         if (rule.parentStyleSheet)
@@ -76,6 +77,10 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
       this._interceptNativeMethod(window.CSSGroupingRule.prototype, "insertRule", invalidateCSSGroupingRule);
       this._interceptNativeMethod(window.CSSGroupingRule.prototype, "deleteRule", invalidateCSSGroupingRule);
       this._interceptNativeGetter(window.CSSGroupingRule.prototype, "cssRules", invalidateCSSGroupingRule);
+      this._interceptNativeSetter(window.StyleSheet.prototype, "disabled", (sheet) => {
+        if (sheet instanceof CSSStyleSheet)
+          this._invalidateStyleSheet(sheet);
+      });
       this._interceptNativeAsyncMethod(window.CSSStyleSheet.prototype, "replace", (sheet) => this._invalidateStyleSheet(sheet));
       this._fakeBase = document.createElement("base");
       this._observer = new MutationObserver((list) => this._handleMutations(list));
@@ -148,6 +153,17 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
         }
       });
     }
+    _interceptNativeSetter(obj, prop, cb) {
+      const descriptor = Object.getOwnPropertyDescriptor(obj, prop);
+      Object.defineProperty(obj, prop, {
+        ...descriptor,
+        set: function(value) {
+          const result = descriptor.set.call(this, value);
+          cb(this, value);
+          return result;
+        }
+      });
+    }
     _handleMutations(list) {
       for (const mutation of list)
         ensureCachedData(mutation.target).attributesCached = void 0;
@@ -156,6 +172,8 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
       if (this._readingStyleSheet)
         return;
       this._staleStyleSheets.add(sheet);
+      if (sheet.href !== null)
+        this._modifiedStyleSheets.add(sheet);
     }
     _updateStyleElementStyleSheetTextIfNeeded(sheet, forceText) {
       const data = ensureCachedData(sheet);
@@ -248,6 +266,8 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
     _getSheetText(sheet) {
       this._readingStyleSheet = true;
       try {
+        if (sheet.disabled)
+          return "";
         const rules = [];
         for (const rule of sheet.cssRules)
           rules.push(rule.cssText);
@@ -518,7 +538,7 @@ function frameSnapshotStreamer(snapshotStreamer, removeNoScript) {
         wallTime: Date.now(),
         collectionTime: 0
       };
-      for (const sheet of this._staleStyleSheets) {
+      for (const sheet of this._modifiedStyleSheets) {
         if (sheet.href === null)
           continue;
         const content = this._updateLinkStyleSheetTextIfNeeded(sheet, snapshotNumber);

package/lib/server/trace/recorder/tracing.js

@@ -222,7 +222,7 @@ class Tracing extends import_instrumentation.SdkObject {
     if (!(this._context instanceof import_browserContext.BrowserContext))
       return;
     for (const page of this._context.pages())
-      page.setScreencastOptions(null);
+      page.screencast.setOptions(null);
   }
   _allocateNewTraceFile(state) {
     const suffix = state.chunkOrdinal ? `-chunk${state.chunkOrdinal}` : ``;
@@ -326,23 +326,21 @@ class Tracing extends import_instrumentation.SdkObject {
     return { artifact };
   }
   async _captureSnapshot(snapshotName, sdkObject, metadata) {
-    if (!this._snapshotter)
+    if (!snapshotName || !sdkObject.attribution.page)
       return;
-    if (!sdkObject.attribution.page)
-      return;
-    if (!this._snapshotter.started())
-      return;
-    if (!shouldCaptureSnapshot(metadata))
-      return;
-    await this._snapshotter.captureSnapshot(sdkObject.attribution.page, metadata.id, snapshotName).catch(() => {
+    await this._snapshotter?.captureSnapshot(sdkObject.attribution.page, metadata.id, snapshotName).catch(() => {
     });
   }
-  onBeforeCall(sdkObject, metadata) {
-    const event = createBeforeActionTraceEvent(metadata, this._currentGroupId());
+  _shouldCaptureSnapshot(sdkObject, metadata) {
+    return !!this._snapshotter?.started() && shouldCaptureSnapshot(metadata) && !!sdkObject.attribution.page;
+  }
+  onBeforeCall(sdkObject, metadata, parentId) {
+    const event = createBeforeActionTraceEvent(metadata, parentId ?? this._currentGroupId());
     if (!event)
       return Promise.resolve();
-    sdkObject.attribution.page?.temporarilyDisableTracingScreencastThrottling();
-    event.beforeSnapshot = `before@${metadata.id}`;
+    sdkObject.attribution.page?.screencast.temporarilyDisableThrottling();
+    if (this._shouldCaptureSnapshot(sdkObject, metadata))
+      event.beforeSnapshot = `before@${metadata.id}`;
     this._state?.callIds.add(metadata.id);
     this._appendTraceEvent(event);
     return this._captureSnapshot(event.beforeSnapshot, sdkObject, metadata);
@@ -353,8 +351,9 @@ class Tracing extends import_instrumentation.SdkObject {
     const event = createInputActionTraceEvent(metadata);
     if (!event)
       return Promise.resolve();
-    sdkObject.attribution.page?.temporarilyDisableTracingScreencastThrottling();
-    event.inputSnapshot = `input@${metadata.id}`;
+    sdkObject.attribution.page?.screencast.temporarilyDisableThrottling();
+    if (this._shouldCaptureSnapshot(sdkObject, metadata))
+      event.inputSnapshot = `input@${metadata.id}`;
     this._appendTraceEvent(event);
     return this._captureSnapshot(event.inputSnapshot, sdkObject, metadata);
   }
@@ -369,15 +368,16 @@ class Tracing extends import_instrumentation.SdkObject {
     if (event)
       this._appendTraceEvent(event);
   }
-  async onAfterCall(sdkObject, metadata) {
+  onAfterCall(sdkObject, metadata) {
     if (!this._state?.callIds.has(metadata.id))
-      return;
+      return Promise.resolve();
     this._state?.callIds.delete(metadata.id);
     const event = createAfterActionTraceEvent(metadata);
     if (!event)
-      return;
-    sdkObject.attribution.page?.temporarilyDisableTracingScreencastThrottling();
-    event.afterSnapshot = `after@${metadata.id}`;
+      return Promise.resolve();
+    sdkObject.attribution.page?.screencast.temporarilyDisableThrottling();
+    if (this._shouldCaptureSnapshot(sdkObject, metadata))
+      event.afterSnapshot = `after@${metadata.id}`;
     this._appendTraceEvent(event);
     return this._captureSnapshot(event.afterSnapshot, sdkObject, metadata);
   }
@@ -484,7 +484,7 @@ class Tracing extends import_instrumentation.SdkObject {
     this._appendTraceEvent(event);
   }
   _startScreencastInPage(page) {
-    page.setScreencastOptions(kScreencastOptions);
+    page.screencast.setOptions(kScreencastOptions);
     const prefix = page.guid;
     this._screencastListeners.push(
       import_eventsHelper.eventsHelper.addEventListener(page, import_page.Page.Events.ScreencastFrame, (params) => {

package/lib/server/trace/viewer/traceParser.js

@@ -0,0 +1,72 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var traceParser_exports = {};
+__export(traceParser_exports, {
+  ZipTraceLoaderBackend: () => ZipTraceLoaderBackend
+});
+module.exports = __toCommonJS(traceParser_exports);
+var import_url = __toESM(require("url"));
+var import_zipFile = require("../../utils/zipFile");
+class ZipTraceLoaderBackend {
+  constructor(traceFile) {
+    this._traceFile = traceFile;
+    this._zipFile = new import_zipFile.ZipFile(traceFile);
+  }
+  isLive() {
+    return false;
+  }
+  traceURL() {
+    return import_url.default.pathToFileURL(this._traceFile).toString();
+  }
+  async entryNames() {
+    return await this._zipFile.entries();
+  }
+  async hasEntry(entryName) {
+    const entries = await this.entryNames();
+    return entries.includes(entryName);
+  }
+  async readText(entryName) {
+    try {
+      const buffer = await this._zipFile.read(entryName);
+      return buffer.toString("utf-8");
+    } catch {
+    }
+  }
+  async readBlob(entryName) {
+    try {
+      const buffer = await this._zipFile.read(entryName);
+      return new Blob([new Uint8Array(buffer)]);
+    } catch {
+    }
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ZipTraceLoaderBackend
+});

package/lib/server/trace/viewer/traceViewer.js

@@ -47,20 +47,21 @@ var import_launchApp2 = require("../../launchApp");
 var import_playwright = require("../../playwright");
 var import_progress = require("../../progress");
 const tracesDirMarker = "traces.dir";
-function validateTraceUrl(traceUrl) {
-  if (!traceUrl)
-    return traceUrl;
-  if (traceUrl.startsWith("http://") || traceUrl.startsWith("https://"))
-    return traceUrl;
-  if (traceUrl.endsWith(".json"))
-    return traceUrl;
+function validateTraceUrl(traceFileOrUrl) {
+  if (!traceFileOrUrl)
+    return traceFileOrUrl;
+  if (traceFileOrUrl.startsWith("http://") || traceFileOrUrl.startsWith("https://"))
+    return traceFileOrUrl;
+  let traceFile = traceFileOrUrl;
+  if (traceFile.endsWith(".json"))
+    return toFilePathUrl(traceFile);
   try {
-    const stat = import_fs.default.statSync(traceUrl);
+    const stat = import_fs.default.statSync(traceFile);
     if (stat.isDirectory())
-      return import_path.default.join(traceUrl, tracesDirMarker);
-    return traceUrl;
+      traceFile = import_path.default.join(traceFile, tracesDirMarker);
+    return toFilePathUrl(traceFile);
   } catch {
-    throw new Error(`Trace file ${traceUrl} does not exist!`);
+    throw new Error(`Trace file ${traceFileOrUrl} does not exist!`);
   }
 }
 async function startTraceViewerServer(options) {
@@ -221,15 +222,18 @@ function traceDescriptor(traceDir, tracePrefix) {
   };
   for (const name of import_fs.default.readdirSync(traceDir)) {
     if (!tracePrefix || name.startsWith(tracePrefix))
-      result.entries.push({ name, path: import_path.default.join(traceDir, name) });
+      result.entries.push({ name, path: toFilePathUrl(import_path.default.join(traceDir, name)) });
   }
   const resourcesDir = import_path.default.join(traceDir, "resources");
   if (import_fs.default.existsSync(resourcesDir)) {
     for (const name of import_fs.default.readdirSync(resourcesDir))
-      result.entries.push({ name: "resources/" + name, path: import_path.default.join(resourcesDir, name) });
+      result.entries.push({ name: "resources/" + name, path: toFilePathUrl(import_path.default.join(resourcesDir, name)) });
   }
   return result;
 }
+function toFilePathUrl(filePath) {
+  return `file?path=${encodeURIComponent(filePath)}`;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   installRootRedirect,