@vitest/browser 2.0.0-beta.11 → 2.0.0-beta.13

package/dist/index.js

@@ -1,14 +1,15 @@
 import { createDebugger, isFileServingAllowed as isFileServingAllowed$1, getFilePoolName, resolveApiServerConfig, resolveFsAllow, distDir, createServer } from 'vitest/node';
-import fs, { existsSync, readdirSync, promises, readFileSync } from 'node:fs';
+import fs, { existsSync, readdirSync, readFileSync, promises } from 'node:fs';
 import { WebSocketServer } from 'ws';
 import { isFileServingAllowed } from 'vite';
 import { builtinModules, createRequire } from 'node:module';
 import { readFile as readFile$1, mkdir } from 'node:fs/promises';
 import { fileURLToPath } from 'node:url';
 import { createDefer, slash, toArray } from '@vitest/utils';
+import { parseErrorStacktrace, parseStacktrace } from '@vitest/utils/source-map';
 import sirv from 'sirv';
 import { defaultBrowserPort, coverageConfigDefaults } from 'vitest/config';
-import { P as PlaywrightBrowserProvider, W as WebdriverBrowserProvider } from './webdriver-BRud6NtS.js';
+import { P as PlaywrightBrowserProvider, W as WebdriverBrowserProvider } from './webdriver-BdVqnfdE.js';
 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';
@@ -406,7 +407,9 @@ const stringify = (value, replacer, space) => {
 async function resolveMock(project, rawId, importer, hasFactory) {
   const { id, fsPath, external } = await resolveId(project, rawId, importer);
   if (hasFactory) {
-    return { type: "factory", resolvedId: id };
+    const needsInteropMap = viteDepsInteropMap(project.browser.vite.config);
+    const needsInterop = needsInteropMap?.get(fsPath) ?? false;
+    return { type: "factory", resolvedId: id, needsInterop };
   }
   const mockPath = resolveMockPath(project.config.root, fsPath, external);
   return {
@@ -497,6 +500,29 @@ const postfixRE = /[?#].*$/;
 function cleanUrl(url) {
   return url.replace(postfixRE, "");
 }
+const metadata = /* @__PURE__ */ new WeakMap();
+function viteDepsInteropMap(config) {
+  if (metadata.has(config)) {
+    return metadata.get(config);
+  }
+  const cacheDirPath = getDepsCacheDir(config);
+  const metadataPath = resolve(cacheDirPath, "_metadata.json");
+  if (!existsSync(metadataPath)) {
+    return null;
+  }
+  const { optimized } = JSON.parse(readFileSync(metadataPath, "utf-8"));
+  const needsInteropMap = /* @__PURE__ */ new Map();
+  for (const name in optimized) {
+    const dep = optimized[name];
+    const file = resolve(cacheDirPath, dep.file);
+    needsInteropMap.set(file, dep.needsInterop);
+  }
+  metadata.set(config, needsInteropMap);
+  return needsInteropMap;
+}
+function getDepsCacheDir(config) {
+  return resolve(config.cacheDir, "deps");
+}
 
 const debug$1 = createDebugger("vitest:browser:api");
 const BROWSER_API_PATH = "/__vitest_browser_api__";
@@ -517,7 +543,7 @@ function setupBrowserRpc(server) {
     const sessionId = searchParams.get("sessionId") ?? "0";
     wss.handleUpgrade(request, socket, head, (ws) => {
       wss.emit("connection", ws, request);
-      const rpc = setupClient(ws);
+      const rpc = setupClient(sessionId, ws);
       const state = server.state;
       const clients = type === "tester" ? state.testers : state.orchestrators;
       clients.set(sessionId, rpc);
@@ -525,6 +551,7 @@ function setupBrowserRpc(server) {
       ws.on("close", () => {
         debug$1?.("[%s] Browser API disconnected from %s", sessionId, type);
         clients.delete(sessionId);
+        server.state.removeCDPHandler(sessionId);
       });
     });
   });
@@ -535,7 +562,7 @@ function setupBrowserRpc(server) {
       );
     }
   }
-  function setupClient(ws) {
+  function setupClient(sessionId, ws) {
     const rpc = createBirpc(
       {
         async onUnhandledError(error, type) {
@@ -653,12 +680,21 @@ function setupBrowserRpc(server) {
               moduleGraph.invalidateModule(module, /* @__PURE__ */ new Set(), Date.now(), true);
             }
           });
+        },
+        // CDP
+        async sendCdpEvent(contextId, event, payload) {
+          const cdp = await server.ensureCDPHandler(contextId, sessionId);
+          return cdp.send(event, payload);
+        },
+        async trackCdpEvent(contextId, type, event, listenerId) {
+          const cdp = await server.ensureCDPHandler(contextId, sessionId);
+          cdp[type](event, listenerId);
         }
       },
       {
         post: (msg) => ws.send(msg),
         on: (fn) => ws.on("message", fn),
-        eventNames: ["onCancel"],
+        eventNames: ["onCancel", "cdpEvent"],
         serialize: (data) => stringify(data, stringifyReplace),
         deserialize: parse,
         onTimeoutError(functionName) {
@@ -696,14 +732,16 @@ function stringifyReplace(key, value) {
 class BrowserServerState {
   orchestrators = /* @__PURE__ */ new Map();
   testers = /* @__PURE__ */ new Map();
+  cdps = /* @__PURE__ */ new Map();
   contexts = /* @__PURE__ */ new Map();
   getContext(contextId) {
     return this.contexts.get(contextId);
   }
-  createAsyncContext(contextId, files) {
+  createAsyncContext(method, contextId, files) {
     const defer = createDefer();
     this.contexts.set(contextId, {
       files,
+      method,
       resolve: () => {
         defer.resolve();
         this.contexts.delete(contextId);
@@ -712,6 +750,9 @@ class BrowserServerState {
     });
     return defer;
   }
+  async removeCDPHandler(sessionId) {
+    this.cdps.delete(sessionId);
+  }
 }
 
 function replacer(code, values) {
@@ -743,10 +784,71 @@ async function getBrowserProvider(options, project) {
   return customProviderModule.default;
 }
 
+class BrowserServerCDPHandler {
+  constructor(session, tester) {
+    this.session = session;
+    this.tester = tester;
+  }
+  listenerIds = {};
+  listeners = {};
+  send(method, params) {
+    return this.session.send(method, params);
+  }
+  on(event, id, once = false) {
+    if (!this.listenerIds[event]) {
+      this.listenerIds[event] = [];
+    }
+    this.listenerIds[event].push(id);
+    if (!this.listeners[event]) {
+      this.listeners[event] = (payload) => {
+        this.tester.cdpEvent(
+          event,
+          payload
+        );
+        if (once) {
+          this.off(event, id);
+        }
+      };
+      this.session.on(event, this.listeners[event]);
+    }
+  }
+  off(event, id) {
+    if (!this.listenerIds[event]) {
+      this.listenerIds[event] = [];
+    }
+    this.listenerIds[event] = this.listenerIds[event].filter((l) => l !== id);
+    if (!this.listenerIds[event].length) {
+      this.session.off(event, this.listeners[event]);
+      delete this.listeners[event];
+    }
+  }
+  once(event, listener) {
+    this.on(event, listener, true);
+  }
+}
+
 class BrowserServer {
   constructor(project, base) {
     this.project = project;
     this.base = base;
+    this.stackTraceOptions = {
+      frameFilter: project.config.onStackTrace,
+      getSourceMap: (id) => {
+        const result = this.vite.moduleGraph.getModuleById(id)?.transformResult;
+        return result?.map;
+      },
+      getFileName: (id) => {
+        const mod = this.vite.moduleGraph.getModuleById(id);
+        if (mod?.file) {
+          return mod.file;
+        }
+        const modUrl = this.vite.moduleGraph.urlToModuleMap.get(id);
+        if (modUrl?.file) {
+          return modUrl.file;
+        }
+        return id;
+      }
+    };
     this.state = new BrowserServerState();
     const pkgRoot = resolve(fileURLToPath(import.meta.url), "../..");
     const distRoot = resolve(pkgRoot, "dist");
@@ -783,6 +885,7 @@ class BrowserServer {
   state;
   provider;
   vite;
+  stackTraceOptions;
   setServer(server) {
     this.vite = server;
   }
@@ -837,6 +940,47 @@ class BrowserServer {
       options: providerOptions
     });
   }
+  parseErrorStacktrace(e, options = {}) {
+    return parseErrorStacktrace(e, {
+      ...this.stackTraceOptions,
+      ...options
+    });
+  }
+  parseStacktrace(trace, options = {}) {
+    return parseStacktrace(trace, {
+      ...this.stackTraceOptions,
+      ...options
+    });
+  }
+  cdpSessions = /* @__PURE__ */ new Map();
+  async ensureCDPHandler(contextId, sessionId) {
+    const cachedHandler = this.state.cdps.get(sessionId);
+    if (cachedHandler) {
+      return cachedHandler;
+    }
+    const provider = this.provider;
+    if (!provider.getCDPSession) {
+      throw new Error(`CDP is not supported by the provider "${provider.name}".`);
+    }
+    const promise = this.cdpSessions.get(sessionId) ?? await (async () => {
+      const promise2 = provider.getCDPSession(contextId).finally(() => {
+        this.cdpSessions.delete(sessionId);
+      });
+      this.cdpSessions.set(sessionId, promise2);
+      return promise2;
+    })();
+    const session = await promise;
+    const rpc = this.state.testers.get(sessionId);
+    if (!rpc) {
+      throw new Error(`Tester RPC "${sessionId}" was not established.`);
+    }
+    const handler = new BrowserServerCDPHandler(session, rpc);
+    this.state.cdps.set(
+      sessionId,
+      handler
+    );
+    return handler;
+  }
   async close() {
     await this.vite.close();
   }
@@ -849,35 +993,49 @@ function wrapConfig(config) {
   };
 }
 
-const click = async (context, xpath, options = {}) => {
+const click = async (context, selector, options = {}) => {
   const provider = context.provider;
   if (provider instanceof PlaywrightBrowserProvider) {
-    const tester = context.frame;
-    await tester.locator(`xpath=${xpath}`).click({
+    const tester = context.iframe;
+    await tester.locator(`css=${selector}`).click({
       timeout: 1e3,
       ...options
     });
   } else if (provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    await browser.$(markedXpath).click(options);
+    await browser.$(selector).click(options);
   } else {
     throw new TypeError(`Provider "${provider.name}" doesn't support click command`);
   }
 };
-const dblClick = async (context, xpath, options = {}) => {
+const dblClick = async (context, selector, options = {}) => {
   const provider = context.provider;
   if (provider instanceof PlaywrightBrowserProvider) {
-    const tester = context.frame;
-    await tester.locator(`xpath=${xpath}`).dblclick(options);
+    const tester = context.iframe;
+    await tester.locator(`css=${selector}`).dblclick(options);
   } else if (provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    await browser.$(markedXpath).doubleClick();
+    await browser.$(selector).doubleClick();
   } else {
     throw new TypeError(`Provider "${provider.name}" doesn't support dblClick command`);
   }
 };
+const tripleClick = async (context, selector, options = {}) => {
+  const provider = context.provider;
+  if (provider instanceof PlaywrightBrowserProvider) {
+    const tester = context.iframe;
+    await tester.locator(`css=${selector}`).click({
+      timeout: 1e3,
+      ...options,
+      clickCount: 3
+    });
+  } else if (provider instanceof WebdriverBrowserProvider) {
+    const browser = context.browser;
+    await browser.action("pointer", { parameters: { pointerType: "mouse" } }).move({ origin: await browser.$(selector) }).down().up().pause(50).down().up().pause(50).down().up().pause(50).perform();
+  } else {
+    throw new TypeError(`Provider "${provider.name}" doesn't support tripleClick command`);
+  }
+};
 
 var clickableInputTypes;
 (function(clickableInputTypes) {
@@ -1250,7 +1408,8 @@ const keyboard = async (context, text) => {
     }
   }
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    await context.frame.evaluate(focusIframe);
+    const frame = await context.frame();
+    await frame.evaluate(focusIframe);
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     await context.browser.execute(focusIframe);
   }
@@ -1266,7 +1425,8 @@ const keyboard = async (context, text) => {
         }
       }
       if (context.provider instanceof PlaywrightBrowserProvider) {
-        await context.frame.evaluate(selectAll);
+        const frame = await context.frame();
+        await frame.evaluate(selectAll);
       } else if (context.provider instanceof WebdriverBrowserProvider) {
         await context.browser.execute(selectAll);
       } else {
@@ -1347,11 +1507,11 @@ async function keyboardImplementation(provider, contextId, text, selectAll, skip
   };
 }
 
-const type = async (context, xpath, text, options = {}) => {
+const type = async (context, selector, text, options = {}) => {
   const { skipClick = false, skipAutoClose = false } = options;
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    const { frame } = context;
-    const element = frame.locator(`xpath=${xpath}`);
+    const { iframe } = context;
+    const element = iframe.locator(`css=${selector}`);
     if (!skipClick) {
       await element.focus();
     }
@@ -1364,8 +1524,7 @@ const type = async (context, xpath, text, options = {}) => {
     );
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    const element = browser.$(markedXpath);
+    const element = browser.$(selector);
     if (!skipClick && !await element.isFocused()) {
       await element.click();
     }
@@ -1386,47 +1545,45 @@ const type = async (context, xpath, text, options = {}) => {
   }
 };
 
-const clear = async (context, xpath) => {
+const clear = async (context, selector) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    const { frame } = context;
-    const element = frame.locator(`xpath=${xpath}`);
+    const { iframe } = context;
+    const element = iframe.locator(`css=${selector}`);
     await element.clear({
       timeout: 1e3
     });
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    const element = await browser.$(markedXpath);
+    const element = await browser.$(selector);
     await element.clearValue();
   } else {
     throw new TypeError(`Provider "${context.provider.name}" does not support clearing elements`);
   }
 };
 
-const fill = async (context, xpath, text, options = {}) => {
+const fill = async (context, selector, text, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    const { frame } = context;
-    const element = frame.locator(`xpath=${xpath}`);
+    const { iframe } = context;
+    const element = iframe.locator(`css=${selector}`);
     await element.fill(text, { timeout: 1e3, ...options });
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    await browser.$(markedXpath).setValue(text);
+    await browser.$(selector).setValue(text);
   } else {
     throw new TypeError(`Provider "${context.provider.name}" does not support clearing elements`);
   }
 };
 
-const selectOptions = async (context, xpath, userValues, options = {}) => {
+const selectOptions = async (context, selector, userValues, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const value = userValues;
-    const { frame } = context;
-    const selectElement = frame.locator(`xpath=${xpath}`);
+    const { iframe } = context;
+    const selectElement = iframe.locator(`css=${selector}`);
     const values = await Promise.all(value.map(async (v) => {
       if (typeof v === "string") {
         return v;
       }
-      const elementHandler = await frame.locator(`xpath=${v.element}`).elementHandle();
+      const elementHandler = await iframe.locator(`css=${v.element}`).elementHandle();
       if (!elementHandler) {
         throw new Error(`Element not found: ${v.element}`);
       }
@@ -1441,10 +1598,9 @@ const selectOptions = async (context, xpath, userValues, options = {}) => {
     if (!values.length) {
       return;
     }
-    const markedXpath = `//${xpath}`;
     const browser = context.browser;
     if (values.length === 1 && "index" in values[0]) {
-      const selectElement = browser.$(markedXpath);
+      const selectElement = browser.$(selector);
       await selectElement.selectByIndex(values[0].index);
     } else {
       throw new Error(`Provider "webdriverio" doesn't support selecting multiple values at once`);
@@ -1472,19 +1628,18 @@ const tab = async (context, options = {}) => {
 
 const dragAndDrop = async (context, source, target, options) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    await context.frame.dragAndDrop(
-      `xpath=${source}`,
-      `xpath=${target}`,
+    const frame = await context.frame();
+    await frame.dragAndDrop(
+      `css=${source}`,
+      `css=${target}`,
       {
         timeout: 1e3,
         ...options
       }
     );
   } else if (context.provider instanceof WebdriverBrowserProvider) {
-    const sourceXpath = `//${source}`;
-    const targetXpath = `//${target}`;
-    const $source = context.browser.$(sourceXpath);
-    const $target = context.browser.$(targetXpath);
+    const $source = context.browser.$(source);
+    const $target = context.browser.$(target);
     const duration = options?.duration ?? 10;
     await context.browser.action("pointer").move({ duration: 0, origin: $source, x: 0, y: 0 }).down({ button: 0 }).move({ duration: 0, origin: "pointer", x: 0, y: 0 }).pause(duration).move({ duration: 0, origin: $target, x: 0, y: 0 }).move({ duration: 0, origin: "pointer", x: 1, y: 0 }).move({ duration: 0, origin: "pointer", x: -1, y: 0 }).up({ button: 0 }).perform();
   } else {
@@ -1492,16 +1647,15 @@ const dragAndDrop = async (context, source, target, options) => {
   }
 };
 
-const hover = async (context, xpath, options = {}) => {
+const hover = async (context, selector, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    await context.frame.locator(`xpath=${xpath}`).hover({
+    await context.iframe.locator(`css=${selector}`).hover({
       timeout: 1e3,
       ...options
     });
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
-    const markedXpath = `//${xpath}`;
-    await browser.$(markedXpath).moveTo(options);
+    await browser.$(selector).moveTo(options);
   } else {
     throw new TypeError(`Provider "${context.provider.name}" does not support hover`);
   }
@@ -1550,26 +1704,31 @@ const screenshot = async (context, name, options = {}) => {
   await mkdir(dirname(path), { recursive: true });
   if (context.provider instanceof PlaywrightBrowserProvider) {
     if (options.element) {
-      const { element: elementXpath, ...config } = options;
-      const iframe = context.frame;
-      const element = iframe.locator(`xpath=${elementXpath}`);
-      await element.screenshot({ ...config, path: savePath });
-    } else {
-      await context.frame.locator("body").screenshot({ ...options, path: savePath });
+      const { element: css, ...config } = options;
+      const element = context.iframe.locator(`css=${css}`);
+      const buffer2 = await element.screenshot({
+        timeout: 1e3,
+        ...config,
+        path: savePath
+      });
+      return returnResult(options, path, buffer2);
     }
-    return path;
+    const buffer = await context.iframe.locator("body").screenshot({
+      ...options,
+      path: savePath
+    });
+    return returnResult(options, path, buffer);
   }
   if (context.provider instanceof WebdriverBrowserProvider) {
     const page = context.provider.browser;
     if (!options.element) {
       const body = await page.$("body");
-      await body.saveScreenshot(savePath);
-      return path;
+      const buffer2 = await body.saveScreenshot(savePath);
+      return returnResult(options, path, buffer2);
     }
-    const xpath = `//${options.element}`;
-    const element = await page.$(xpath);
-    await element.saveScreenshot(savePath);
-    return path;
+    const element = await page.$(`${options.element}`);
+    const buffer = await element.saveScreenshot(savePath);
+    return returnResult(options, path, buffer);
   }
   throw new Error(
     `Provider "${context.provider.name}" does not support screenshots`
@@ -1588,6 +1747,12 @@ function resolveScreenshotPath(testPath, name, config) {
   }
   return resolve(dir, "__screenshots__", base, name);
 }
+function returnResult(options, path, buffer) {
+  if (options.base64) {
+    return { path, base64: buffer.toString("base64") };
+  }
+  return path;
+}
 
 var builtinCommands = {
   readFile,
@@ -1595,6 +1760,7 @@ var builtinCommands = {
   writeFile,
   __vitest_click: click,
   __vitest_dblClick: dblClick,
+  __vitest_tripleClick: tripleClick,
   __vitest_screenshot: screenshot,
   __vitest_type: type,
   __vitest_clear: clear,
@@ -1650,7 +1816,7 @@ async function generateContextFile(server) {
   );
   const distContextPath = slash(`/@fs/${resolve(__dirname, "context.js")}`);
   return `
-import { page, userEvent as __userEvent_CDP__ } from '${distContextPath}'
+import { page, userEvent as __userEvent_CDP__, cdp } from '${distContextPath}'
 ${userEventNonProviderImport}
 const filepath = () => ${filepathCode}
 const rpc = () => __vitest_worker__.rpc
@@ -1667,7 +1833,7 @@ export const server = {
 }
 export const commands = server.commands
 export const userEvent = ${getUserEvent(provider)}
-export { page }
+export { page, cdp }
 `;
 }
 function getUserEvent(provider) {
@@ -1713,11 +1879,13 @@ ${err.message}`);
     onImportMeta() {
     },
     onDynamicImport(node) {
-      const replace = "__vitest_browser_runner__.wrapModule(() => import(";
+      const replaceString = "__vitest_browser_runner__.wrapModule(() => import(";
+      const importSubstring = code.substring(node.start, node.end);
+      const hasIgnore = importSubstring.includes("/* @vite-ignore */");
       s.overwrite(
         node.start,
         node.source.start,
-        replace
+        replaceString + (hasIgnore ? "/* @vite-ignore */ " : "")
       );
       s.overwrite(node.end - 1, node.end, "))");
     }
@@ -1807,7 +1975,9 @@ async function resolveTester(server, url, res) {
   const testFiles = await project.globTestFiles();
   const tests = testFile === "__vitest_all__" || !testFiles.includes(testFile) ? "__vitest_browser_runner__.files" : JSON.stringify([testFile]);
   const iframeId = JSON.stringify(testFile);
-  const files = state.getContext(contextId)?.files ?? [];
+  const context = state.getContext(contextId);
+  const files = context?.files ?? [];
+  const method = context?.method ?? "run";
   const injectorJs = typeof server.injectorJs === "string" ? server.injectorJs : await server.injectorJs;
   const config = server.getSerializableConfig();
   const injector = replacer(injectorJs, {
@@ -1839,7 +2009,7 @@ async function resolveTester(server, url, res) {
     __VITEST_APPEND__: `<script type="module">
 __vitest_browser_runner__.runningFiles = ${tests}
 __vitest_browser_runner__.iframeId = ${iframeId}
-__vitest_browser_runner__.runTests(__vitest_browser_runner__.runningFiles)
+__vitest_browser_runner__.${method === "run" ? "runTests" : "collectTests"}(__vitest_browser_runner__.runningFiles)
 <\/script>`
   });
 }
@@ -1848,6 +2018,7 @@ 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",
@@ -1926,16 +2097,48 @@ var BrowserPlugin = (browserServer, base = "/") => {
           (file) => getFilePoolName(project, file) === "browser"
         );
         const setupFiles = toArray(project.config.setupFiles);
+        const define = {};
+        for (const env in project.config.env || {}) {
+          const stringValue = JSON.stringify(project.config.env[env]);
+          define[`process.env.${env}`] = stringValue;
+          define[`import.meta.env.${env}`] = stringValue;
+        }
+        const entries = [
+          ...browserTestFiles,
+          ...setupFiles,
+          resolve(distDir, "index.js"),
+          resolve(distDir, "browser.js"),
+          resolve(distDir, "runners.js"),
+          resolve(distDir, "utils.js"),
+          ...project.config.snapshotSerializers || []
+        ];
+        if (project.config.diff) {
+          entries.push(project.config.diff);
+        }
+        if (project.ctx.coverageProvider) {
+          const coverage = project.ctx.config.coverage;
+          const provider = coverage.provider;
+          if (provider === "v8") {
+            const path = tryResolve("@vitest/coverage-v8", [project.ctx.config.root]);
+            if (path) {
+              entries.push(path);
+            }
+          } else if (provider === "istanbul") {
+            const path = tryResolve("@vitest/coverage-istanbul", [project.ctx.config.root]);
+            if (path) {
+              entries.push(path);
+            }
+          } else if (provider === "custom" && coverage.customProviderModule) {
+            entries.push(coverage.customProviderModule);
+          }
+        }
         return {
+          define,
+          resolve: {
+            dedupe: ["vitest"]
+          },
           optimizeDeps: {
-            entries: [
-              ...browserTestFiles,
-              ...setupFiles,
-              resolve(distDir, "index.js"),
-              resolve(distDir, "browser.js"),
-              resolve(distDir, "runners.js"),
-              resolve(distDir, "utils.js")
-            ],
+            entries,
             exclude: [
               "vitest",
               "vitest/utils",
@@ -1964,8 +2167,9 @@ var BrowserPlugin = (browserServer, base = "/") => {
               "vitest > pretty-format > ansi-regex",
               "vitest > chai",
               "vitest > chai > loupe",
-              "vitest > @vitest/runner > p-limit",
+              "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"
             ]
@@ -1992,7 +2196,7 @@ var BrowserPlugin = (browserServer, base = "/") => {
         if (rawId.startsWith("/__virtual_vitest__")) {
           const url = new URL(rawId, "http://localhost");
           if (!url.searchParams.has("id")) {
-            throw new TypeError(`Invalid virtual module id: ${rawId}, requires "id" query.`);
+            return;
           }
           const id = decodeURIComponent(url.searchParams.get("id"));
           const resolved = await this.resolve(id, distRoot, {
@@ -2013,6 +2217,15 @@ var BrowserPlugin = (browserServer, base = "/") => {
         if (id.startsWith("/__vitest_browser__/") || id.startsWith("/__vitest__/")) {
           return resolve(distRoot, "client", id.slice(1));
         }
+      },
+      configResolved(config) {
+        loupePath = resolve(config.cacheDir, "deps/loupe.js");
+      },
+      transform(code, id) {
+        if (id.startsWith(loupePath)) {
+          const utilRequire = "nodeUtil = require_util();";
+          return code.replace(utilRequire, " ".repeat(utilRequire.length));
+        }
       }
     },
     BrowserContext(browserServer),
@@ -2022,10 +2235,8 @@ var BrowserPlugin = (browserServer, base = "/") => {
       enforce: "post",
       async config(viteConfig) {
         // Enables using ignore hint for coverage providers with @preserve keyword
-        if (viteConfig.esbuild !== false) {
-          viteConfig.esbuild ||= {};
-          viteConfig.esbuild.legalComments = "inline";
-        }
+        viteConfig.esbuild ||= {};
+        viteConfig.esbuild.legalComments = "inline";
         const server = resolveApiServerConfig(
           viteConfig.test?.browser || {},
           defaultBrowserPort
@@ -2055,18 +2266,31 @@ var BrowserPlugin = (browserServer, base = "/") => {
     },
     // TODO: remove this when @testing-library/vue supports ESM
     {
-      name: "vitest:browser:support-vue-testing-library",
+      name: "vitest:browser:support-testing-library",
       config() {
         return {
+          define: {
+            // testing-library/preact
+            "process.env.PTL_SKIP_AUTO_CLEANUP": !!process.env.PTL_SKIP_AUTO_CLEANUP,
+            // testing-library/react
+            "process.env.RTL_SKIP_AUTO_CLEANUP": !!process.env.RTL_SKIP_AUTO_CLEANUP,
+            "process.env?.RTL_SKIP_AUTO_CLEANUP": !!process.env.RTL_SKIP_AUTO_CLEANUP,
+            // testing-library/svelte, testing-library/solid
+            "process.env.STL_SKIP_AUTO_CLEANUP": !!process.env.STL_SKIP_AUTO_CLEANUP,
+            // testing-library/vue
+            "process.env.VTL_SKIP_AUTO_CLEANUP": !!process.env.VTL_SKIP_AUTO_CLEANUP,
+            // dom.debug()
+            "process.env.DEBUG_PRINT_LIMIT": process.env.DEBUG_PRINT_LIMIT || 7e3
+          },
           optimizeDeps: {
             esbuildOptions: {
               plugins: [
                 {
                   name: "test-utils-rewrite",
                   setup(build) {
-                    const _require = createRequire(import.meta.url);
                     build.onResolve({ filter: /@vue\/test-utils/ }, (args) => {
-                      const resolved = _require.resolve(args.path, {
+                      const _require2 = getRequire();
+                      const resolved = _require2.resolve(args.path, {
                         paths: [args.importer]
                       });
                       return { path: resolved };
@@ -2081,6 +2305,21 @@ var BrowserPlugin = (browserServer, base = "/") => {
     }
   ];
 };
+function tryResolve(path, paths) {
+  try {
+    const _require2 = getRequire();
+    return _require2.resolve(path, { paths });
+  } catch {
+    return void 0;
+  }
+}
+let _require;
+function getRequire() {
+  if (!_require) {
+    _require = createRequire(import.meta.url);
+  }
+  return _require;
+}
 function resolveCoverageFolder(project) {
   const options = project.ctx.config;
   const htmlReporter = options.coverage?.enabled ? toArray(options.coverage.reporter).find((reporter) => {
@@ -2106,11 +2345,11 @@ function resolveCoverageFolder(project) {
 const debug = createDebugger("vitest:browser:pool");
 function createBrowserPool(ctx) {
   const providers = /* @__PURE__ */ new Set();
-  const waitForTests = async (contextId, project, files) => {
-    const context = project.browser.state.createAsyncContext(contextId, files);
+  const waitForTests = async (method, contextId, project, files) => {
+    const context = project.browser.state.createAsyncContext(method, contextId, files);
     return await context;
   };
-  const runTests = async (project, files) => {
+  const executeTests = async (method, project, files) => {
     ctx.state.clearFiles(project, files);
     const browser = project.browser;
     const threadsCount = getThreadsCount(project);
@@ -2146,12 +2385,12 @@ function createBrowserPool(ctx) {
           contextId,
           [...files2.map((f) => relative(project.config.root, f))].join(", ")
         );
-        const promise = waitForTests(contextId, project, files2);
+        const promise = waitForTests(method, contextId, project, files2);
         promises.push(promise);
         orchestrator.createTesters(files2);
       } else {
         const contextId = crypto.randomUUID();
-        const waitPromise = waitForTests(contextId, project, files2);
+        const waitPromise = waitForTests(method, contextId, project, files2);
         debug?.(
           "Opening a new context %s for files: %s",
           contextId,
@@ -2165,15 +2404,22 @@ function createBrowserPool(ctx) {
     });
     await Promise.all(promises);
   };
-  const runWorkspaceTests = async (specs) => {
+  const runWorkspaceTests = async (method, specs) => {
     const groupedFiles = /* @__PURE__ */ new Map();
     for (const [project, file] of specs) {
       const files = groupedFiles.get(project) || [];
       files.push(file);
       groupedFiles.set(project, files);
     }
+    let isCancelled = false;
+    ctx.onCancel(() => {
+      isCancelled = true;
+    });
     for (const [project, files] of groupedFiles.entries()) {
-      await runTests(project, files);
+      if (isCancelled) {
+        break;
+      }
+      await executeTests(method, project, files);
     }
   };
   const numCpus = typeof nodeos.availableParallelism === "function" ? nodeos.availableParallelism() : nodeos.cpus().length;
@@ -2193,7 +2439,8 @@ function createBrowserPool(ctx) {
       await Promise.all([...providers].map((provider) => provider.close()));
       providers.clear();
     },
-    runTests: runWorkspaceTests
+    runTests: (files) => runWorkspaceTests("run", files),
+    collectTests: (files) => runWorkspaceTests("collect", files)
   };
 }
 
@@ -2206,14 +2453,13 @@ async function createBrowserServer(project, configFile, prePlugins = [], postPlu
     ...project.options,
     // spread project config inlined in root workspace config
     base: "/",
-    logLevel: "error",
+    logLevel: process.env.VITEST_BROWSER_DEBUG ?? "info",
     mode: project.config.mode,
     configFile: configPath,
     // watch is handled by Vitest
     server: {
       hmr: false,
-      watch: null,
-      preTransformRequests: false
+      watch: null
     },
     plugins: [
       ...prePlugins,