npm - @vitest/browser - Versions diffs - 4.0.15 → 4.0.17 - Mend

@vitest/browser 4.0.15 → 4.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/dist/client/.vite/manifest.json +2 -2
package/dist/client/__vitest__/assets/index-BUCFJtth.js +57 -0
package/dist/client/__vitest__/index.html +1 -1
package/dist/client/__vitest_browser__/{orchestrator-8U3FyXSU.js → orchestrator-S_3e_uzt.js} +40 -8
package/dist/client/__vitest_browser__/{tester-CrGChK3u.js → tester-k74mgIRa.js} +63 -36
package/dist/client/error-catcher.js +5 -1
package/dist/client/esm-client-injector.js +2 -1
package/dist/client/orchestrator.html +1 -1
package/dist/client/tester/tester.html +1 -1
package/dist/client.js +197 -211
package/dist/expect-element.js +3 -3
package/dist/{index-CEutxZap.js → index-D6m36C6U.js} +1 -1
package/dist/index.js +403 -307
package/dist/locators.js +1 -1
package/dist/shared/screenshotMatcher/types.d.ts +1 -1
package/package.json +9 -8
package/dist/client/__vitest__/assets/index-CfDzoXo3.js +0 -57

package/dist/client/__vitest__/index.html CHANGED Viewed

@@ -23,7 +23,7 @@
       })();
     </script>
     <!-- !LOAD_METADATA! -->
-    <script type="module" src="./assets/index-CfDzoXo3.js"></script>
+    <script type="module" src="./assets/index-BUCFJtth.js"></script>
     <link rel="stylesheet" href="./assets/index-DlhE0rqZ.css">
   </head>
   <body>

package/dist/client/__vitest_browser__/{orchestrator-8U3FyXSU.js → orchestrator-S_3e_uzt.js} RENAMED Viewed

@@ -1,5 +1,6 @@
 import { g as getBrowserState, a as getConfig, r as relative, b as generateFileHash } from "./utils-uxqdqUz8.js";
 import { channel, globalChannel, client } from "@vitest/browser/client";
+import { Traces } from "vitest/internal/browser";
 // @__NO_SIDE_EFFECTS__
 function getUiAPI() {
   return window.__vitest_ui_api__;
@@ -10,8 +11,14 @@ class IframeOrchestrator {
   recreateNonIsolatedIframe = false;
   iframes = /* @__PURE__ */ new Map();
   eventTarget = new EventTarget();
+  traces;
   constructor() {
     debug("init orchestrator", getBrowserState().sessionId);
+    const otelConfig = getBrowserState().config.experimental.openTelemetry;
+    this.traces = new Traces({
+      enabled: !!((otelConfig == null ? void 0 : otelConfig.enabled) && otelConfig.browserSdkPath),
+      sdkPath: `/@fs/${otelConfig == null ? void 0 : otelConfig.browserSdkPath}`
+    });
     channel.addEventListener(
       "message",
       (e) => this.onIframeEvent(e)
@@ -22,6 +29,21 @@ class IframeOrchestrator {
     );
   }
   async createTesters(options) {
+    await this.traces.waitInit();
+    this.traces.recordInitSpan(
+      this.traces.getContextFromCarrier(getBrowserState().otelCarrier)
+    );
+    const orchestratorSpan = this.traces.startContextSpan(
+      "vitest.browser.orchestrator.run",
+      this.traces.getContextFromCarrier(options.otelCarrier)
+    );
+    orchestratorSpan.span.setAttributes({
+      "vitest.browser.files": options.files.map((f) => f.filepath)
+    });
+    const endSpan = async () => {
+      orchestratorSpan.span.end();
+      await this.traces.flush();
+    };
     const startTime = performance.now();
     this.cancelled = false;
     const config = getConfig();
@@ -35,13 +57,15 @@ class IframeOrchestrator {
       }
     }
     if (config.browser.isolate === false) {
-      await this.runNonIsolatedTests(container, options, startTime);
+      await this.runNonIsolatedTests(container, options, startTime, orchestratorSpan.context);
+      await endSpan();
       return;
     }
     this.iframes.forEach((iframe) => iframe.remove());
     this.iframes.clear();
     for (let i = 0; i < options.files.length; i++) {
       if (this.cancelled) {
+        await endSpan();
         return;
       }
       const file = options.files[i];
@@ -50,9 +74,11 @@ class IframeOrchestrator {
         container,
         file,
         options,
-        startTime
+        startTime,
+        orchestratorSpan.context
       );
     }
+    await endSpan();
   }
   async cleanupTesters() {
     const config = getConfig();
@@ -75,7 +101,7 @@ class IframeOrchestrator {
     });
     this.recreateNonIsolatedIframe = true;
   }
-  async runNonIsolatedTests(container, options, startTime) {
+  async runNonIsolatedTests(container, options, startTime, otelContext) {
     if (this.recreateNonIsolatedIframe) {
       this.recreateNonIsolatedIframe = false;
       this.iframes.get(ID_ALL).remove();
@@ -84,7 +110,7 @@ class IframeOrchestrator {
     }
     if (!this.iframes.has(ID_ALL)) {
       debug("preparing non-isolated iframe");
-      await this.prepareIframe(container, ID_ALL, startTime);
+      await this.prepareIframe(container, ID_ALL, startTime, otelContext);
     }
     const config = getConfig();
     const { width, height } = config.browser.viewport;
@@ -100,7 +126,7 @@ class IframeOrchestrator {
     });
     debug("finished running tests", options.files.join(", "));
   }
-  async runIsolatedTestInIframe(container, spec, options, startTime) {
+  async runIsolatedTestInIframe(container, spec, options, startTime, otelContext) {
     const config = getConfig();
     const { width, height } = config.browser.viewport;
     const file = spec.filepath;
@@ -108,7 +134,12 @@ class IframeOrchestrator {
       this.iframes.get(file).remove();
       this.iframes.delete(file);
     }
-    const iframe = await this.prepareIframe(container, file, startTime);
+    const iframe = await this.prepareIframe(
+      container,
+      file,
+      startTime,
+      otelContext
+    );
     await setIframeViewport(iframe, width, height);
     await sendEventToIframe({
       event: "execute",
@@ -127,7 +158,7 @@ class IframeOrchestrator {
     this.eventTarget.dispatchEvent(event);
     return error;
   }
-  async prepareIframe(container, iframeId, startTime) {
+  async prepareIframe(container, iframeId, startTime, otelContext) {
     const iframe = this.createTestIframe(iframeId);
     container.appendChild(iframe);
     await new Promise((resolve, reject) => {
@@ -146,7 +177,8 @@ Expected: ${iframe.src}`
           sendEventToIframe({
             event: "prepare",
             iframeId,
-            startTime
+            startTime,
+            otelCarrier: this.traces.getContextCarrier(otelContext)
           }).then(resolve, (error) => reject(this.dispatchIframeError(error)));
         }
       };

package/dist/client/__vitest_browser__/{tester-CrGChK3u.js → tester-k74mgIRa.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { c as resolve, m as moduleRunner, d as getWorkerState, g as getBrowserState, e as getTestName, a as getConfig } from "./utils-uxqdqUz8.js";
 import { onCancel, globalChannel, channel, client } from "@vitest/browser/client";
 import { userEvent, page, server } from "vitest/browser";
-import { getSafeTimers, DecodedMap as DecodedMap$1, getOriginalPosition as getOriginalPosition$1, loadDiffConfig, loadSnapshotSerializers, takeCoverageInsideWorker, stringify, format, setupCommonEnv, startCoverageInsideWorker, stopCoverageInsideWorker, startTests, collectTests, SpyModule } from "vitest/internal/browser";
+import { getSafeTimers, DecodedMap as DecodedMap$1, getOriginalPosition as getOriginalPosition$1, loadDiffConfig, loadSnapshotSerializers, takeCoverageInsideWorker, browserFormat, Traces, setupCommonEnv, startCoverageInsideWorker, stopCoverageInsideWorker, startTests, collectTests, SpyModule } from "vitest/internal/browser";
 import { VitestTestRunner, NodeBenchmarkRunner } from "vitest/runners";
 const scriptRel = "modulepreload";
 const assetsURL = function(dep) {
@@ -811,11 +811,13 @@ function createBrowserRunner(runnerClass, mocker, state, coverageModule) {
     sourceMapCache = /* @__PURE__ */ new Map();
     method = "run";
     commands;
+    _otel;
     constructor(options) {
       super(options.config);
       this.config = options.config;
       this.commands = getBrowserState().commands;
       this.viteEnvironment = "__browser__";
+      this._otel = getBrowserState().traces;
     }
     setMethod(method) {
       this.method = method;
@@ -865,28 +867,28 @@ function createBrowserRunner(runnerClass, mocker, state, coverageModule) {
       if (!this.traces.has(test.id)) {
         this.traces.set(test.id, []);
       }
-      const traces = this.traces.get(test.id);
+      const traces2 = this.traces.get(test.id);
       const { tracePath } = await this.commands.triggerCommand(
         "__vitest_stopChunkTrace",
         [{ name }]
       );
-      traces.push(tracePath);
+      traces2.push(tracePath);
     };
     onAfterRunTask = async (task) => {
       var _a, _b, _c;
       await ((_a = super.onAfterRunTask) == null ? void 0 : _a.call(this, task));
       const trace = this.config.browser.trace;
-      const traces = this.traces.get(task.id) || [];
-      if (traces.length) {
+      const traces2 = this.traces.get(task.id) || [];
+      if (traces2.length) {
         if (trace === "retain-on-failure" && ((_b = task.result) == null ? void 0 : _b.state) === "pass") {
           await this.commands.triggerCommand(
             "__vitest_deleteTracing",
-            [{ traces }]
+            [{ traces: traces2 }]
           );
         } else {
           await this.commands.triggerCommand(
             "__vitest_annotateTraces",
-            [{ testId: task.id, traces }]
+            [{ testId: task.id, traces: traces2 }]
           );
         }
       }
@@ -1024,9 +1026,10 @@ function createBrowserRunner(runnerClass, mocker, state, coverageModule) {
         throw new Error(`Failed to import test file ${filepath}`, { cause: err });
       }
     };
-    // disable tracing in the browser for now
-    trace = void 0;
-    __setTraces = void 0;
+    trace = (name, attributes, cb) => {
+      const options = typeof attributes === "object" ? { attributes } : {};
+      return this._otel.$(`vitest.test.runner.${name}`, options, cb || attributes);
+    };
   };
 }
 let cachedRunner = null;
@@ -1128,7 +1131,7 @@ function setupConsoleLogSpy() {
   console$1.warn = stderr(warn);
   console$1.dir = (item, options) => {
     dir(item, options);
-    sendLog("stdout", formatInput(item));
+    sendLog("stdout", browserFormat(item));
   };
   console$1.dirxml = (...args) => {
     dirxml(...args);
@@ -1198,17 +1201,8 @@ function stderr(base) {
     sendLog("stderr", processLog(args));
   };
 }
-function formatInput(input) {
-  if (typeof input === "object") {
-    return stringify(input, void 0, {
-      printBasicPrototype: false,
-      escapeString: false
-    });
-  }
-  return format(input);
-}
 function processLog(args) {
-  return args.map(formatInput).join(" ");
+  return browserFormat(...args);
 }
 function sendLog(type, content, disableStack) {
   var _a, _b, _c;
@@ -1940,27 +1934,42 @@ class CommandsManager {
     var _a, _b;
     const state = getWorkerState();
     const rpc2 = state.rpc;
-    const { sessionId } = getBrowserState();
+    const { sessionId, traces: traces2 } = getBrowserState();
     const filepath = state.filepath || ((_b = (_a = state.current) == null ? void 0 : _a.file) == null ? void 0 : _b.filepath);
     args = args.filter((arg) => arg !== void 0);
     if (this._listeners.length) {
       await Promise.all(this._listeners.map((listener) => listener(command, args)));
     }
-    return rpc2.triggerCommand(sessionId, command, filepath, args).catch((err) => {
-      var _a2;
-      clientError.message = err.message;
-      clientError.name = err.name;
-      clientError.stack = (_a2 = clientError.stack) == null ? void 0 : _a2.replace(clientError.message, err.message);
-      throw clientError;
-    });
+    return traces2.$(
+      "vitest.browser.tester.command",
+      {
+        attributes: {
+          "vitest.browser.command": command,
+          "code.file.path": filepath
+        }
+      },
+      () => rpc2.triggerCommand(sessionId, command, filepath, args).catch((err) => {
+        var _a2;
+        clientError.message = err.message;
+        clientError.name = err.name;
+        clientError.stack = (_a2 = clientError.stack) == null ? void 0 : _a2.replace(clientError.message, err.message);
+        throw clientError;
+      })
+    );
   }
 }
-const __vite_import_meta_env__ = { "BASE_URL": "/", "DEV": false, "MODE": "production", "PROD": true, "SSR": false, "VITE_TEST_WATCHER_DEBUG": "false" };
 const debugVar = getConfig().env.VITEST_BROWSER_DEBUG;
 const debug = debugVar && debugVar !== "false" ? (...args) => {
   var _a, _b;
   return (_b = (_a = client.rpc).debug) == null ? void 0 : _b.call(_a, ...args.map(String));
 } : void 0;
+const otelConfig = getConfig().experimental.openTelemetry;
+const traces = new Traces({
+  enabled: !!((otelConfig == null ? void 0 : otelConfig.enabled) && (otelConfig == null ? void 0 : otelConfig.browserSdkPath)),
+  sdkPath: `/@fs/${otelConfig == null ? void 0 : otelConfig.browserSdkPath}`
+});
+let rootTesterSpan;
+getBrowserState().traces = traces;
 channel.addEventListener("message", async (e) => {
   await client.waitForConnection();
   const data = e.data;
@@ -1989,9 +1998,19 @@ channel.addEventListener("message", async (e) => {
     }
     case "cleanup": {
       await cleanup().catch((err) => unhandledError(err, "Cleanup Error"));
+      rootTesterSpan == null ? void 0 : rootTesterSpan.span.end();
+      await traces.finish();
       break;
     }
     case "prepare": {
+      await traces.waitInit();
+      const tracesContext = traces.getContextFromCarrier(data.otelCarrier);
+      traces.recordInitSpan(tracesContext);
+      rootTesterSpan = traces.startContextSpan(
+        `vitest.browser.tester.run`,
+        tracesContext
+      );
+      traces.bind(rootTesterSpan.context);
       await prepare(data).catch((err) => unhandledError(err, "Prepare Error"));
       break;
     }
@@ -2021,7 +2040,7 @@ async function prepareTestEnvironment(options) {
   const config = getConfig();
   const rpc2 = createSafeRpc(client);
   const state = getWorkerState();
-  state.metaEnv = __vite_import_meta_env__;
+  state.metaEnv = __vitest_browser_import_meta_env_init__;
   state.onCancel = onCancel;
   state.ctx.rpc = rpc2;
   state.rpc = rpc2;
@@ -2080,11 +2099,19 @@ async function executeTests(method, specifications) {
   for (const file of specifications) {
     state.filepath = file.filepath;
     debug == null ? void 0 : debug("running test file", file.filepath);
-    if (method === "run") {
-      await startTests([file], runner);
-    } else {
-      await collectTests([file], runner);
-    }
+    await traces.$(
+      `vitest.test.runner.${method}.module`,
+      {
+        attributes: { "code.file.path": file.filepath }
+      },
+      async () => {
+        if (method === "run") {
+          await startTests([file], runner);
+        } else {
+          await collectTests([file], runner);
+        }
+      }
+    );
   }
 }
 async function prepare(options) {

package/dist/client/error-catcher.js CHANGED Viewed

@@ -31,7 +31,11 @@ function catchWindowErrors(errorEvent, prop, cb) {
       cb(e)
     }
     else {
-      console.error(e[prop])
+      // `ErrorEvent` doesn't necessary have `ErrotEvent.error` defined
+      // but some has `ErrorEvent.message` defined, e.g. ResizeObserver error.
+      // https://developer.mozilla.org/en-US/docs/Web/API/ErrorEvent/error
+      // https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver#observation_errors
+      console.error(e.message ? new Error(e.message) : e)
     }
   }
   const addEventListener = window.addEventListener.bind(window)

package/dist/client/esm-client-injector.js CHANGED Viewed

@@ -9,7 +9,7 @@
     }
     const { evaluatedModules } = __vitest_worker__
-    const moduleId = crypto.randomUUID()
+    const moduleId = `${Math.random()}`
     const viteModule = evaluatedModules.ensureModule(moduleId, moduleId)
     viteModule.evaluated = false
@@ -38,6 +38,7 @@
     type: { __VITEST_TYPE__ },
     sessionId: { __VITEST_SESSION_ID__ },
     testerId: { __VITEST_TESTER_ID__ },
+    otelCarrier: { __VITEST_OTEL_CARRIER__ },
     provider: { __VITEST_PROVIDER__ },
     method: { __VITEST_METHOD__ },
     providedContext: { __VITEST_PROVIDED_CONTEXT__ },

package/dist/client/orchestrator.html CHANGED Viewed

@@ -26,7 +26,7 @@
     {__VITEST_INJECTOR__}
     {__VITEST_ERROR_CATCHER__}
     {__VITEST_SCRIPTS__}
-    <script type="module" crossorigin src="/__vitest_browser__/orchestrator-8U3FyXSU.js"></script>
+    <script type="module" crossorigin src="/__vitest_browser__/orchestrator-S_3e_uzt.js"></script>
     <link rel="modulepreload" crossorigin href="/__vitest_browser__/utils-uxqdqUz8.js">
   </head>
   <body>

package/dist/client/tester/tester.html CHANGED Viewed

@@ -5,7 +5,7 @@
     <link rel="icon" href="{__VITEST_FAVICON__}" type="image/svg+xml">
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vitest Browser Tester</title>
-    <script type="module" crossorigin src="/__vitest_browser__/tester-CrGChK3u.js"></script>
+    <script type="module" crossorigin src="/__vitest_browser__/tester-k74mgIRa.js"></script>
     <link rel="modulepreload" crossorigin href="/__vitest_browser__/utils-uxqdqUz8.js">
   </head>
   <body>