@vitest/browser 2.0.0 → 2.0.2

package/dist/client.js

@@ -0,0 +1,333 @@
+const DEFAULT_TIMEOUT = 6e4;
+function defaultSerialize(i) {
+  return i;
+}
+const defaultDeserialize = defaultSerialize;
+const { clearTimeout: clearTimeout$1, setTimeout: setTimeout$1 } = globalThis;
+const random = Math.random.bind(Math);
+function createBirpc(functions, options) {
+  const {
+    post,
+    on,
+    eventNames = [],
+    serialize = defaultSerialize,
+    deserialize = defaultDeserialize,
+    resolver,
+    timeout = DEFAULT_TIMEOUT
+  } = options;
+  const rpcPromiseMap = /* @__PURE__ */ new Map();
+  let _promise;
+  const rpc = new Proxy({}, {
+    get(_, method) {
+      if (method === "$functions")
+        return functions;
+      if (method === "then" && !eventNames.includes("then") && !("then" in functions))
+        return void 0;
+      const sendEvent = (...args) => {
+        post(serialize({ m: method, a: args, t: "q" }));
+      };
+      if (eventNames.includes(method)) {
+        sendEvent.asEvent = sendEvent;
+        return sendEvent;
+      }
+      const sendCall = async (...args) => {
+        await _promise;
+        return new Promise((resolve, reject) => {
+          const id = nanoid();
+          let timeoutId;
+          if (timeout >= 0) {
+            timeoutId = setTimeout$1(() => {
+              try {
+                options.onTimeoutError?.(method, args);
+                throw new Error(`[birpc] timeout on calling "${method}"`);
+              } catch (e) {
+                reject(e);
+              }
+              rpcPromiseMap.delete(id);
+            }, timeout);
+            if (typeof timeoutId === "object")
+              timeoutId = timeoutId.unref?.();
+          }
+          rpcPromiseMap.set(id, { resolve, reject, timeoutId });
+          post(serialize({ m: method, a: args, i: id, t: "q" }));
+        });
+      };
+      sendCall.asEvent = sendEvent;
+      return sendCall;
+    }
+  });
+  _promise = on(async (data, ...extra) => {
+    const msg = deserialize(data);
+    if (msg.t === "q") {
+      const { m: method, a: args } = msg;
+      let result, error;
+      const fn = resolver ? resolver(method, functions[method]) : functions[method];
+      if (!fn) {
+        error = new Error(`[birpc] function "${method}" not found`);
+      } else {
+        try {
+          result = await fn.apply(rpc, args);
+        } catch (e) {
+          error = e;
+        }
+      }
+      if (msg.i) {
+        if (error && options.onError)
+          options.onError(error, method, args);
+        post(serialize({ t: "s", i: msg.i, r: result, e: error }), ...extra);
+      }
+    } else {
+      const { i: ack, r: result, e: error } = msg;
+      const promise = rpcPromiseMap.get(ack);
+      if (promise) {
+        clearTimeout$1(promise.timeoutId);
+        if (error)
+          promise.reject(error);
+        else
+          promise.resolve(result);
+      }
+      rpcPromiseMap.delete(ack);
+    }
+  });
+  return rpc;
+}
+const urlAlphabet = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
+function nanoid(size = 21) {
+  let id = "";
+  let i = size;
+  while (i--)
+    id += urlAlphabet[random() * 64 | 0];
+  return id;
+}
+
+/// <reference types="../types/index.d.ts" />
+
+// (c) 2020-present Andrea Giammarchi
+
+const {parse: $parse, stringify: $stringify} = JSON;
+const {keys} = Object;
+
+const Primitive = String;   // it could be Number
+const primitive = 'string'; // it could be 'number'
+
+const ignore = {};
+const object = 'object';
+
+const noop = (_, value) => value;
+
+const primitives = value => (
+  value instanceof Primitive ? Primitive(value) : value
+);
+
+const Primitives = (_, value) => (
+  typeof value === primitive ? new Primitive(value) : value
+);
+
+const revive = (input, parsed, output, $) => {
+  const lazy = [];
+  for (let ke = keys(output), {length} = ke, y = 0; y < length; y++) {
+    const k = ke[y];
+    const value = output[k];
+    if (value instanceof Primitive) {
+      const tmp = input[value];
+      if (typeof tmp === object && !parsed.has(tmp)) {
+        parsed.add(tmp);
+        output[k] = ignore;
+        lazy.push({k, a: [input, parsed, tmp, $]});
+      }
+      else
+        output[k] = $.call(output, k, tmp);
+    }
+    else if (output[k] !== ignore)
+      output[k] = $.call(output, k, value);
+  }
+  for (let {length} = lazy, i = 0; i < length; i++) {
+    const {k, a} = lazy[i];
+    output[k] = $.call(output, k, revive.apply(null, a));
+  }
+  return output;
+};
+
+const set = (known, input, value) => {
+  const index = Primitive(input.push(value) - 1);
+  known.set(value, index);
+  return index;
+};
+
+/**
+ * Converts a specialized flatted string into a JS value.
+ * @param {string} text
+ * @param {(this: any, key: string, value: any) => any} [reviver]
+ * @returns {any}
+ */
+const parse = (text, reviver) => {
+  const input = $parse(text, Primitives).map(primitives);
+  const value = input[0];
+  const $ = reviver || noop;
+  const tmp = typeof value === object && value ?
+              revive(input, new Set, value, $) :
+              value;
+  return $.call({'': tmp}, '', tmp);
+};
+
+/**
+ * Converts a JS value into a specialized flatted string.
+ * @param {any} value
+ * @param {((this: any, key: string, value: any) => any) | (string | number)[] | null | undefined} [replacer]
+ * @param {string | number | undefined} [space]
+ * @returns {string}
+ */
+const stringify = (value, replacer, space) => {
+  const $ = replacer && typeof replacer === object ?
+            (k, v) => (k === '' || -1 < replacer.indexOf(k) ? v : void 0) :
+            (replacer || noop);
+  const known = new Map;
+  const input = [];
+  const output = [];
+  let i = +set(known, input, $.call({'': value}, '', value));
+  let firstRun = !i;
+  while (i < input.length) {
+    firstRun = true;
+    output[i] = $stringify(input[i++], replace, space);
+  }
+  return '[' + output.join(',') + ']';
+  function replace(key, value) {
+    if (firstRun) {
+      firstRun = !firstRun;
+      return value;
+    }
+    const after = $.call(this, key, value);
+    switch (typeof after) {
+      case object:
+        if (after === null) return after;
+      case primitive:
+        return known.get(after) || set(known, input, after);
+    }
+    return after;
+  }
+};
+
+// @__NO_SIDE_EFFECTS__
+function getBrowserState() {
+  return window.__vitest_browser_runner__;
+}
+
+const channel = new BroadcastChannel(
+  `vitest:${getBrowserState().contextId}`
+);
+const globalChannel = new BroadcastChannel("vitest:global");
+function waitForChannel(event) {
+  return new Promise((resolve) => {
+    channel.addEventListener(
+      "message",
+      (e) => {
+        if (e.data?.type === event) {
+          resolve();
+        }
+      },
+      { once: true }
+    );
+  });
+}
+
+const PAGE_TYPE = getBrowserState().type;
+const PORT = location.port;
+const HOST = [location.hostname, PORT].filter(Boolean).join(":");
+const SESSION_ID = PAGE_TYPE === "orchestrator" ? getBrowserState().contextId : getBrowserState().testerId;
+const ENTRY_URL = `${location.protocol === "https:" ? "wss:" : "ws:"}//${HOST}/__vitest_browser_api__?type=${PAGE_TYPE}&sessionId=${SESSION_ID}`;
+let setCancel = (_) => {
+};
+const onCancel = new Promise((resolve) => {
+  setCancel = resolve;
+});
+function createClient() {
+  const reconnectInterval = 2e3;
+  const reconnectTries = 10;
+  const connectTimeout = 6e4;
+  let tries = reconnectTries;
+  const ctx = {
+    ws: new WebSocket(ENTRY_URL),
+    waitForConnection
+  };
+  let onMessage;
+  ctx.rpc = createBirpc(
+    {
+      onCancel: setCancel,
+      async createTesters(files) {
+        if (PAGE_TYPE !== "orchestrator") {
+          return;
+        }
+        getBrowserState().createTesters?.(files);
+      },
+      cdpEvent(event, payload) {
+        const cdp = getBrowserState().cdp;
+        if (!cdp) {
+          return;
+        }
+        cdp.emit(event, payload);
+      }
+    },
+    {
+      post: (msg) => ctx.ws.send(msg),
+      on: (fn) => onMessage = fn,
+      serialize: (e) => stringify(e, (_, v) => {
+        if (v instanceof Error) {
+          return {
+            name: v.name,
+            message: v.message,
+            stack: v.stack
+          };
+        }
+        return v;
+      }),
+      deserialize: parse,
+      onTimeoutError(functionName) {
+        throw new Error(`[vitest-browser]: Timeout calling "${functionName}"`);
+      }
+    }
+  );
+  let openPromise;
+  function reconnect(reset = false) {
+    if (reset) {
+      tries = reconnectTries;
+    }
+    ctx.ws = new WebSocket(ENTRY_URL);
+    registerWS();
+  }
+  function registerWS() {
+    openPromise = new Promise((resolve, reject) => {
+      const timeout = setTimeout(() => {
+        reject(
+          new Error(
+            `Cannot connect to the server in ${connectTimeout / 1e3} seconds`
+          )
+        );
+      }, connectTimeout)?.unref?.();
+      if (ctx.ws.OPEN === ctx.ws.readyState) {
+        resolve();
+      }
+      ctx.ws.addEventListener("open", () => {
+        tries = reconnectTries;
+        resolve();
+        clearTimeout(timeout);
+      });
+    });
+    ctx.ws.addEventListener("message", (v) => {
+      onMessage(v.data);
+    });
+    ctx.ws.addEventListener("close", () => {
+      tries -= 1;
+      if (tries > 0) {
+        setTimeout(reconnect, reconnectInterval);
+      }
+    });
+  }
+  registerWS();
+  function waitForConnection() {
+    return openPromise;
+  }
+  return ctx;
+}
+const client = createClient();
+
+export { ENTRY_URL, HOST, PORT, SESSION_ID, channel, client, globalChannel, onCancel, waitForChannel };

package/dist/index.d.ts

@@ -103,6 +103,7 @@ declare class BrowserServer implements BrowserServer$1 {
     testerHtml: Promise<string> | string;
     orchestratorHtml: Promise<string> | string;
     injectorJs: Promise<string> | string;
+    errorCatcherPath: Promise<string> | string;
     stateJs: Promise<string> | string;
     state: BrowserServerState;
     provider: BrowserProvider;
@@ -119,7 +120,7 @@ declare class BrowserServer implements BrowserServer$1 {
     initBrowserProvider(): Promise<void>;
     parseErrorStacktrace(e: ErrorWithDiff, options?: StackTraceParserOptions): vitest.ParsedStack[];
     parseStacktrace(trace: string, options?: StackTraceParserOptions): vitest.ParsedStack[];
-    private cdpSessions;
+    private cdpSessionsPromises;
     ensureCDPHandler(contextId: string, sessionId: string): Promise<BrowserServerCDPHandler>;
     close(): Promise<void>;
 }

package/dist/index.js

@@ -13,8 +13,8 @@ import { P as PlaywrightBrowserProvider, W as WebdriverBrowserProvider } from '.
 import { resolve as resolve$1, dirname as dirname$1, normalize as normalize$1 } from 'node:path';
 import MagicString from 'magic-string';
 import { esmWalker } from '@vitest/utils/ast';
-import * as nodeos from 'node:os';
 import crypto from 'node:crypto';
+import * as nodeos from 'node:os';
 
 const _DRIVE_LETTER_START_RE = /^[A-Za-z]:\//;
 function normalizeWindowsPath(input = "") {
@@ -868,6 +868,7 @@ class BrowserServer {
       resolve(distRoot, "client/esm-client-injector.js"),
       "utf8"
     ).then((js) => this.injectorJs = js);
+    this.errorCatcherPath = resolve(distRoot, "client/error-catcher.js");
     this.stateJs = readFile$1(
       resolve(distRoot, "state.js"),
       "utf-8"
@@ -881,6 +882,7 @@ class BrowserServer {
   testerHtml;
   orchestratorHtml;
   injectorJs;
+  errorCatcherPath;
   stateJs;
   state;
   provider;
@@ -952,7 +954,7 @@ class BrowserServer {
       ...options
     });
   }
-  cdpSessions = /* @__PURE__ */ new Map();
+  cdpSessionsPromises = /* @__PURE__ */ new Map();
   async ensureCDPHandler(contextId, sessionId) {
     const cachedHandler = this.state.cdps.get(sessionId);
     if (cachedHandler) {
@@ -962,11 +964,11 @@ class BrowserServer {
     if (!provider.getCDPSession) {
       throw new Error(`CDP is not supported by the provider "${provider.name}".`);
     }
-    const promise = this.cdpSessions.get(sessionId) ?? await (async () => {
+    const promise = this.cdpSessionsPromises.get(sessionId) ?? await (async () => {
       const promise2 = provider.getCDPSession(contextId).finally(() => {
-        this.cdpSessions.delete(sessionId);
+        this.cdpSessionsPromises.delete(sessionId);
       });
-      this.cdpSessions.set(sessionId, promise2);
+      this.cdpSessionsPromises.set(sessionId, promise2);
       return promise2;
     })();
     const session = await promise;
@@ -1433,7 +1435,7 @@ const keyboard = async (context, text) => {
         throw new TypeError(`Provider "${context.provider.name}" does not support selecting all text`);
       }
     },
-    false
+    true
   );
 };
 async function keyboardImplementation(provider, contextId, text, selectAll, skipRelease) {
@@ -1930,6 +1932,7 @@ async function resolveOrchestrator(server, url, res) {
     __VITEST_FILES__: JSON.stringify(files),
     __VITEST_TYPE__: '"orchestrator"',
     __VITEST_CONTEXT_ID__: JSON.stringify(contextId),
+    __VITEST_TESTER_ID__: '"none"',
     __VITEST_PROVIDED_CONTEXT__: "{}"
   });
   res.removeHeader("Content-Security-Policy");
@@ -1946,7 +1949,8 @@ async function resolveOrchestrator(server, url, res) {
     baseHtml = baseHtml.replaceAll("./assets/", `${base}__vitest__/assets/`).replace(
       "<!-- !LOAD_METADATA! -->",
       [
-        "<script>{__VITEST_INJECTOR__}<\/script>",
+        "{__VITEST_INJECTOR__}",
+        "{__VITEST_ERROR_CATCHER__}",
         "{__VITEST_SCRIPTS__}",
         `<script type="module" crossorigin src="${base}${jsEntry}"><\/script>`
       ].join("\n")
@@ -1956,7 +1960,8 @@ async function resolveOrchestrator(server, url, res) {
     __VITEST_FAVICON__: server.faviconUrl,
     __VITEST_TITLE__: "Vitest Browser Runner",
     __VITEST_SCRIPTS__: server.orchestratorScripts,
-    __VITEST_INJECTOR__: injector,
+    __VITEST_INJECTOR__: `<script type="module">${injector}<\/script>`,
+    __VITEST_ERROR_CATCHER__: `<script type="module" src="${server.errorCatcherPath}"><\/script>`,
     __VITEST_CONTEXT_ID__: JSON.stringify(contextId)
   });
 }
@@ -1989,6 +1994,7 @@ async function resolveTester(server, url, res) {
     }),
     __VITEST_TYPE__: '"tester"',
     __VITEST_CONTEXT_ID__: JSON.stringify(contextId),
+    __VITEST_TESTER_ID__: JSON.stringify(crypto.randomUUID()),
     __VITEST_PROVIDED_CONTEXT__: JSON.stringify(stringify(project.getProvidedContext()))
   });
   if (!server.testerScripts) {
@@ -2005,7 +2011,8 @@ async function resolveTester(server, url, res) {
     __VITEST_FAVICON__: server.faviconUrl,
     __VITEST_TITLE__: "Vitest Browser Tester",
     __VITEST_SCRIPTS__: server.testerScripts,
-    __VITEST_INJECTOR__: injector,
+    __VITEST_INJECTOR__: `<script type="module">${injector}<\/script>`,
+    __VITEST_ERROR_CATCHER__: `<script type="module" src="${server.errorCatcherPath}"><\/script>`,
     __VITEST_APPEND__: `<script type="module">
 __vitest_browser_runner__.runningFiles = ${tests}
 __vitest_browser_runner__.iframeId = ${iframeId}
@@ -2018,7 +2025,6 @@ var BrowserPlugin = (browserServer, base = "/") => {
   const pkgRoot = resolve(fileURLToPath(import.meta.url), "../..");
   const distRoot = resolve(pkgRoot, "dist");
   const project = browserServer.project;
-  let loupePath;
   return [
     {
       enforce: "pre",
@@ -2144,6 +2150,8 @@ var BrowserPlugin = (browserServer, base = "/") => {
               "vitest/utils",
               "vitest/browser",
               "vitest/runners",
+              "@vitest/browser",
+              "@vitest/browser/client",
               "@vitest/utils",
               "@vitest/utils/source-map",
               "@vitest/runner",
@@ -2154,21 +2162,15 @@ var BrowserPlugin = (browserServer, base = "/") => {
               "std-env",
               "tinybench",
               "tinyspy",
+              "tinyrainbow",
               "pathe",
               "msw",
               "msw/browser"
             ],
             include: [
-              "vitest > @vitest/utils > pretty-format",
-              "vitest > @vitest/snapshot > pretty-format",
               "vitest > @vitest/snapshot > magic-string",
-              "vitest > pretty-format",
-              "vitest > pretty-format > ansi-styles",
-              "vitest > pretty-format > ansi-regex",
               "vitest > chai",
               "vitest > chai > loupe",
-              "vitest > @vitest/runner > pretty-format",
-              "vitest > @vitest/utils > diff-sequences",
               "vitest > @vitest/utils > loupe",
               "@vitest/browser > @testing-library/user-event",
               "@vitest/browser > @testing-library/dom"
@@ -2193,17 +2195,6 @@ var BrowserPlugin = (browserServer, base = "/") => {
     {
       name: "vitest:browser:resolve-virtual",
       async resolveId(rawId) {
-        if (rawId.startsWith("/__virtual_vitest__")) {
-          const url = new URL(rawId, "http://localhost");
-          if (!url.searchParams.has("id")) {
-            return;
-          }
-          const id = decodeURIComponent(url.searchParams.get("id"));
-          const resolved = await this.resolve(id, distRoot, {
-            skipSelf: true
-          });
-          return resolved;
-        }
         if (rawId === "/__vitest_msw__") {
           return this.resolve("msw/mockServiceWorker.js", distRoot, {
             skipSelf: true
@@ -2218,11 +2209,8 @@ var BrowserPlugin = (browserServer, base = "/") => {
           return resolve(distRoot, "client", id.slice(1));
         }
       },
-      configResolved(config) {
-        loupePath = resolve(config.cacheDir, "deps/loupe.js");
-      },
       transform(code, id) {
-        if (id.startsWith(loupePath)) {
+        if (id.includes(browserServer.vite.config.cacheDir) && id.includes("loupe.js")) {
           const utilRequire = "nodeUtil = require_util();";
           return code.replace(utilRequire, " ".repeat(utilRequire.length));
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vitest/browser",
   "type": "module",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "description": "Browser running for Vitest",
   "license": "MIT",
   "funding": "https://opencollective.com/vitest",
@@ -28,6 +28,9 @@
       "types": "./context.d.ts",
       "default": "./context.js"
     },
+    "./client": {
+      "default": "./dist/client.js"
+    },
     "./matchers": {
       "types": "./matchers.d.ts"
     },
@@ -51,7 +54,7 @@
   "peerDependencies": {
     "playwright": "*",
     "webdriverio": "*",
-    "vitest": "2.0.0"
+    "vitest": "2.0.2"
   },
   "peerDependenciesMeta": {
     "playwright": {
@@ -71,7 +74,7 @@
     "msw": "^2.3.1",
     "sirv": "^2.0.4",
     "ws": "^8.17.1",
-    "@vitest/utils": "2.0.0"
+    "@vitest/utils": "2.0.2"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.4.6",
@@ -85,10 +88,10 @@
     "playwright-core": "^1.45.0",
     "safaridriver": "^0.1.2",
     "webdriverio": "^8.39.0",
-    "@vitest/ws-client": "2.0.0",
-    "@vitest/runner": "2.0.0",
-    "@vitest/ui": "2.0.0",
-    "vitest": "2.0.0"
+    "@vitest/runner": "2.0.2",
+    "@vitest/ui": "2.0.2",
+    "@vitest/ws-client": "2.0.2",
+    "vitest": "2.0.2"
   },
   "scripts": {
     "build": "rimraf dist && pnpm build:node && pnpm build:client",