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

package/dist/index.js

@@ -4,13 +4,13 @@ import c from 'tinyrainbow';
 import { isValidApiRequest, isFileServingAllowed, distDir, resolveApiServerConfig, resolveFsAllow, rolldownVersion, createDebugger, createViteLogger, createViteServer } from 'vitest/node';
 import fs, { readFileSync, lstatSync, createReadStream, promises, existsSync } from 'node:fs';
 import { createRequire } from 'node:module';
-import { slash as slash$1, toArray, deepMerge, createDefer } from '@vitest/utils/helpers';
+import { slash as slash$1, toArray, nanoid as nanoid$1, deepMerge, createDefer } from '@vitest/utils/helpers';
 import MagicString from 'magic-string';
 import sirv from 'sirv';
 import { coverageConfigDefaults } from 'vitest/config';
 import { fileURLToPath } from 'node:url';
 import crypto from 'node:crypto';
-import { mkdir, rm, readFile as readFile$1, writeFile as writeFile$1 } from 'node:fs/promises';
+import { mkdir, rm, readFile as readFile$1, writeFile as writeFile$1, unlink } from 'node:fs/promises';
 import { parseErrorStacktrace, parseStacktrace } from '@vitest/utils/source-map';
 import { PlaywrightBrowserProvider } from './providers/playwright.js';
 import { WebdriverBrowserProvider } from './providers/webdriverio.js';
@@ -22,7 +22,7 @@ import pm from 'pixelmatch';
 import { WebSocketServer } from 'ws';
 import { performance } from 'node:perf_hooks';
 
-var version = "4.0.0-beta.11";
+var version = "4.0.0-beta.13";
 
 const _DRIVE_LETTER_START_RE = /^[A-Za-z]:\//;
 function normalizeWindowsPath(input = "") {
@@ -339,7 +339,7 @@ async function getBrowserProvider(options, project) {
 		if (!(name in providers)) {
 			throw new Error(`Unknown browser provider "${name}". Available providers: ${Object.keys(providers).join(", ")}.`);
 		}
-		return providers[name]().factory(project);
+		return providers[name](options.provider?.options).factory(project);
 	}
 	const supportedBrowsers = options.provider.supportedBrowser || [];
 	if (supportedBrowsers.length && !supportedBrowsers.includes(browser)) {
@@ -773,8 +773,6 @@ var BrowserPlugin = (parentServer, base = "/") => {
 					"vitest > expect-type",
 					"vitest > @vitest/snapshot > magic-string",
 					"vitest > @vitest/expect > chai",
-					"vitest > @vitest/expect > chai > loupe",
-					"vitest > @vitest/utils > loupe",
 					"@vitest/browser > @testing-library/user-event",
 					"@vitest/browser > @testing-library/dom"
 				];
@@ -2396,8 +2394,12 @@ async function takeScreenshot(context, name, options) {
 		throw new Error(`Cannot take a screenshot without a test path`);
 	}
 	const path = resolveScreenshotPath(context.testPath, name, context.project.config, options.path);
-	const savePath = normalize$1(path);
-	await mkdir(dirname(path), { recursive: true });
+	// playwright does not need a screenshot path if we don't intend to save it
+	let savePath;
+	if (options.save) {
+		savePath = normalize(path);
+		await mkdir(dirname(savePath), { recursive: true });
+	}
 	if (context.provider instanceof PlaywrightBrowserProvider) {
 		const mask = options.mask?.map((selector) => context.iframe.locator(selector));
 		if (options.element) {
@@ -2406,7 +2408,7 @@ async function takeScreenshot(context, name, options) {
 			const buffer = await element.screenshot({
 				...config,
 				mask,
-				path: options.save ? savePath : undefined
+				path: savePath
 			});
 			return {
 				buffer,
@@ -2416,7 +2418,7 @@ async function takeScreenshot(context, name, options) {
 		const buffer = await context.iframe.locator("body").screenshot({
 			...options,
 			mask,
-			path: options.save ? savePath : undefined
+			path: savePath
 		});
 		return {
 			buffer,
@@ -2424,11 +2426,17 @@ async function takeScreenshot(context, name, options) {
 		};
 	}
 	if (context.provider instanceof WebdriverBrowserProvider) {
+		// webdriverio needs a path, so if one is not already set we create a temporary one
+		if (savePath === undefined) {
+			savePath = resolve(context.project.tmpDir, nanoid$1());
+			await mkdir(context.project.tmpDir, { recursive: true });
+		}
 		const page = context.provider.browser;
 		const element = !options.element ? await page.$("body") : await page.$(`${options.element}`);
 		// webdriverio expects the path to contain the extension and only works with PNG files
 		const savePathWithExtension = savePath.endsWith(".png") ? savePath : `${savePath}.png`;
-		const buffer = await element.saveScreenshot(savePathWithExtension);
+		// there seems to be a bug in webdriverio, `X:/` gets appended to cwd, so we convert to `X:\`
+		const buffer = await element.saveScreenshot(normalize$1(savePathWithExtension));
 		if (!options.save) {
 			await rm(savePathWithExtension, { force: true });
 		}
@@ -2907,6 +2915,101 @@ const tab = async (context, options = {}) => {
 	throw new Error(`Provider "${provider.name}" doesn't support tab command`);
 };
 
+const startTracing = async ({ context, project, provider, sessionId }) => {
+	if (provider instanceof PlaywrightBrowserProvider) {
+		if (provider.tracingContexts.has(sessionId)) {
+			return;
+		}
+		provider.tracingContexts.add(sessionId);
+		const options = project.config.browser.trace;
+		await context.tracing.start({
+			screenshots: options.screenshots ?? true,
+			snapshots: options.snapshots ?? true,
+			sources: false
+		}).catch(() => {
+			provider.tracingContexts.delete(sessionId);
+		});
+		return;
+	}
+	throw new TypeError(`The ${provider.name} provider does not support tracing.`);
+};
+const startChunkTrace = async (command, { name, title }) => {
+	const { provider, sessionId, testPath, context } = command;
+	if (!testPath) {
+		throw new Error(`stopChunkTrace cannot be called outside of the test file.`);
+	}
+	if (provider instanceof PlaywrightBrowserProvider) {
+		if (!provider.tracingContexts.has(sessionId)) {
+			await startTracing(command);
+		}
+		const path = resolveTracesPath(command, name);
+		provider.pendingTraces.set(path, sessionId);
+		await context.tracing.startChunk({
+			name,
+			title
+		});
+		return;
+	}
+	throw new TypeError(`The ${provider.name} provider does not support tracing.`);
+};
+const stopChunkTrace = async (context, { name }) => {
+	if (context.provider instanceof PlaywrightBrowserProvider) {
+		const path = resolveTracesPath(context, name);
+		context.provider.pendingTraces.delete(path);
+		await context.context.tracing.stopChunk({ path });
+		return { tracePath: path };
+	}
+	throw new TypeError(`The ${context.provider.name} provider does not support tracing.`);
+};
+function resolveTracesPath({ testPath, project }, name) {
+	if (!testPath) {
+		throw new Error(`This command can only be called inside a test file.`);
+	}
+	const options = project.config.browser.trace;
+	const sanitizedName = `${project.name.replace(/[^a-z0-9]/gi, "-")}-${name}.trace.zip`;
+	if (options.tracesDir) {
+		return resolve(options.tracesDir, sanitizedName);
+	}
+	const dir = dirname(testPath);
+	const base = basename(testPath);
+	return resolve(dir, "__traces__", base, `${project.name.replace(/[^a-z0-9]/gi, "-")}-${name}.trace.zip`);
+}
+const deleteTracing = async (context, { traces }) => {
+	if (!context.testPath) {
+		throw new Error(`stopChunkTrace cannot be called outside of the test file.`);
+	}
+	if (context.provider instanceof PlaywrightBrowserProvider) {
+		return Promise.all(traces.map((trace) => unlink(trace).catch((err) => {
+			if (err.code === "ENOENT") {
+				// Ignore the error if the file doesn't exist
+				return;
+			}
+			// Re-throw other errors
+			throw err;
+		})));
+	}
+	throw new Error(`provider ${context.provider.name} is not supported`);
+};
+const annotateTraces = async ({ project }, { testId, traces }) => {
+	const vitest = project.vitest;
+	await Promise.all(traces.map((trace) => {
+		const entity = vitest.state.getReportedEntityById(testId);
+		return vitest._testRun.annotate(testId, {
+			message: relative(project.config.root, trace),
+			type: "traces",
+			attachment: {
+				path: trace,
+				contentType: "application/octet-stream"
+			},
+			location: entity?.location ? {
+				file: entity.module.moduleId,
+				line: entity.location.line,
+				column: entity.location.column
+			} : undefined
+		});
+	}));
+};
+
 const type = async (context, selector, text, options = {}) => {
 	const { skipClick = false, skipAutoClose = false } = options;
 	const unreleased = new Set(Reflect.get(options, "unreleased") ?? []);
@@ -2999,7 +3102,12 @@ var builtinCommands = {
 	__vitest_hover: hover,
 	__vitest_cleanup: keyboardCleanup,
 	__vitest_viewport: viewport,
-	__vitest_screenshotMatcher: screenshotMatcher
+	__vitest_screenshotMatcher: screenshotMatcher,
+	__vitest_deleteTracing: deleteTracing,
+	__vitest_startChunkTrace: startChunkTrace,
+	__vitest_startTracing: startTracing,
+	__vitest_stopChunkTrace: stopChunkTrace,
+	__vitest_annotateTraces: annotateTraces
 };
 
 class BrowserServerState {
@@ -3984,6 +4092,11 @@ class BrowserPool {
 			return;
 		}
 		const provider = this.project.browser.provider;
+		const browser = this.project.config.browser.name;
+		if (shouldIgnoreDebugger(provider.name, browser)) {
+			debug?.("[$s] ignoring debugger in %s browser because it is not supported", sessionId, browser);
+			return;
+		}
 		if (!provider.getCDPSession) {
 			throw new Error("Unable to set breakpoint, CDP not supported");
 		}
@@ -3996,6 +4109,12 @@ class BrowserPool {
 		});
 	}
 }
+function shouldIgnoreDebugger(provider, browser) {
+	if (provider === "webdriverio") {
+		return browser !== "chrome" && browser !== "edge";
+	}
+	return browser !== "chromium";
+}
 
 async function createBrowserServer(project, configFile, prePlugins = [], postPlugins = []) {
 	if (project.vitest.version !== version) {

package/dist/locators/index.js

@@ -1 +1 @@
-import"@vitest/browser/context";import"../public-utils-Kx5DUGWa.js";export{L as Locator,s as selectorEngine}from"../index-DDlvjJVO.js";import"vitest/internal/browser";
+import"@vitest/browser/context";import"../public-utils-B6exS8fl.js";export{L as Locator,s as selectorEngine}from"../index-BPDFwkoW.js";import"vitest/internal/browser";

package/dist/locators/playwright.js

@@ -1 +1 @@
-import{page,server}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector}from"../public-utils-Kx5DUGWa.js";import{s as selectorEngine,L as Locator,p as processTimeoutOptions,g as getIframeScale}from"../index-DDlvjJVO.js";import"vitest/internal/browser";page.extend({getByLabelText(e,_){return new PlaywrightLocator(getByLabelSelector(e,_))},getByRole(e,_){return new PlaywrightLocator(getByRoleSelector(e,_))},getByTestId(e){return new PlaywrightLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,_){return new PlaywrightLocator(getByAltTextSelector(e,_))},getByPlaceholder(e,_){return new PlaywrightLocator(getByPlaceholderSelector(e,_))},getByText(e,_){return new PlaywrightLocator(getByTextSelector(e,_))},getByTitle(e,_){return new PlaywrightLocator(getByTitleSelector(e,_))},_createLocator(e){return new PlaywrightLocator(e)},elementLocator(e){return new PlaywrightLocator(selectorEngine.generateSelectorSimple(e),e)},frameLocator(e){return new PlaywrightLocator(`${e.selector} >> internal:control=enter-frame`)}});class PlaywrightLocator extends Locator{constructor(e,_){super(),this.selector=e,this._container=_}click(e){return super.click(processTimeoutOptions(processClickOptions(e)))}dblClick(e){return super.dblClick(processTimeoutOptions(processClickOptions(e)))}tripleClick(e){return super.tripleClick(processTimeoutOptions(processClickOptions(e)))}selectOptions(e,_){return super.selectOptions(e,processTimeoutOptions(_))}clear(e){return super.clear(processTimeoutOptions(e))}hover(e){return super.hover(processTimeoutOptions(processHoverOptions(e)))}upload(e,_){return super.upload(e,processTimeoutOptions(_))}fill(e,_){return super.fill(e,processTimeoutOptions(_))}dropTo(e,_){return super.dropTo(e,processTimeoutOptions(processDragAndDropOptions(_)))}locator(e){return new PlaywrightLocator(`${this.selector} >> ${e}`,this._container)}elementLocator(e){return new PlaywrightLocator(selectorEngine.generateSelectorSimple(e),e)}}function processDragAndDropOptions(e){if(!e)return e;let _=e;return _.sourcePosition&&=processPlaywrightPosition(_.sourcePosition),_.targetPosition&&=processPlaywrightPosition(_.targetPosition),e}function processHoverOptions(e){if(!e)return e;let _=e;return _.position&&=processPlaywrightPosition(_.position),e}function processClickOptions(e){if(!e)return e;let _=e;return _.position&&=processPlaywrightPosition(_.position),_}function processPlaywrightPosition(e){let _=getIframeScale();return e.x!=null&&(e.x*=_),e.y!=null&&(e.y*=_),e}
+import{page,server}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector}from"../public-utils-B6exS8fl.js";import{s as selectorEngine,L as Locator,p as processTimeoutOptions,g as getIframeScale}from"../index-BPDFwkoW.js";import"vitest/internal/browser";page.extend({getByLabelText(e,_){return new PlaywrightLocator(getByLabelSelector(e,_))},getByRole(e,_){return new PlaywrightLocator(getByRoleSelector(e,_))},getByTestId(e){return new PlaywrightLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,_){return new PlaywrightLocator(getByAltTextSelector(e,_))},getByPlaceholder(e,_){return new PlaywrightLocator(getByPlaceholderSelector(e,_))},getByText(e,_){return new PlaywrightLocator(getByTextSelector(e,_))},getByTitle(e,_){return new PlaywrightLocator(getByTitleSelector(e,_))},_createLocator(e){return new PlaywrightLocator(e)},elementLocator(e){return new PlaywrightLocator(selectorEngine.generateSelectorSimple(e),e)},frameLocator(e){return new PlaywrightLocator(`${e.selector} >> internal:control=enter-frame`)}});class PlaywrightLocator extends Locator{constructor(e,_){super(),this.selector=e,this._container=_}click(e){return super.click(processTimeoutOptions(processClickOptions(e)))}dblClick(e){return super.dblClick(processTimeoutOptions(processClickOptions(e)))}tripleClick(e){return super.tripleClick(processTimeoutOptions(processClickOptions(e)))}selectOptions(e,_){return super.selectOptions(e,processTimeoutOptions(_))}clear(e){return super.clear(processTimeoutOptions(e))}hover(e){return super.hover(processTimeoutOptions(processHoverOptions(e)))}upload(e,_){return super.upload(e,processTimeoutOptions(_))}fill(e,_){return super.fill(e,processTimeoutOptions(_))}dropTo(e,_){return super.dropTo(e,processTimeoutOptions(processDragAndDropOptions(_)))}locator(e){return new PlaywrightLocator(`${this.selector} >> ${e}`,this._container)}elementLocator(e){return new PlaywrightLocator(selectorEngine.generateSelectorSimple(e),e)}}function processDragAndDropOptions(e){if(!e)return e;let _=e;return _.sourcePosition&&=processPlaywrightPosition(_.sourcePosition),_.targetPosition&&=processPlaywrightPosition(_.targetPosition),e}function processHoverOptions(e){if(!e)return e;let _=e;return _.position&&=processPlaywrightPosition(_.position),e}function processClickOptions(e){if(!e)return e;let _=e;return _.position&&=processPlaywrightPosition(_.position),_}function processPlaywrightPosition(e){let _=getIframeScale();return e.x!=null&&(e.x*=_),e.y!=null&&(e.y*=_),e}

package/dist/locators/preview.js

@@ -1 +1 @@
-import{page,server,userEvent}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector,h as getElementError}from"../public-utils-Kx5DUGWa.js";import{s as selectorEngine,L as Locator,c as convertElementToCssSelector}from"../index-DDlvjJVO.js";import"vitest/internal/browser";page.extend({getByLabelText(e,m){return new PreviewLocator(getByLabelSelector(e,m))},getByRole(e,m){return new PreviewLocator(getByRoleSelector(e,m))},getByTestId(e){return new PreviewLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,m){return new PreviewLocator(getByAltTextSelector(e,m))},getByPlaceholder(e,m){return new PreviewLocator(getByPlaceholderSelector(e,m))},getByText(e,m){return new PreviewLocator(getByTextSelector(e,m))},getByTitle(e,m){return new PreviewLocator(getByTitleSelector(e,m))},_createLocator(e){return new PreviewLocator(e)},elementLocator(e){return new PreviewLocator(selectorEngine.generateSelectorSimple(e),e)}});class PreviewLocator extends Locator{constructor(e,m){super(),this._pwSelector=e,this._container=m}get selector(){let e=this.elements().map(e=>convertElementToCssSelector(e));if(!e.length)throw getElementError(this._pwSelector,this._container||document.body);return e.join(`, `)}click(){return userEvent.click(this.element())}dblClick(){return userEvent.dblClick(this.element())}tripleClick(){return userEvent.tripleClick(this.element())}hover(){return userEvent.hover(this.element())}unhover(){return userEvent.unhover(this.element())}async fill(e){return userEvent.fill(this.element(),e)}async upload(e){return userEvent.upload(this.element(),e)}selectOptions(e){return userEvent.selectOptions(this.element(),e)}clear(){return userEvent.clear(this.element())}locator(e){return new PreviewLocator(`${this._pwSelector} >> ${e}`,this._container)}elementLocator(e){return new PreviewLocator(selectorEngine.generateSelectorSimple(e),e)}}
+import{page,server,userEvent}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector,h as getElementError}from"../public-utils-B6exS8fl.js";import{s as selectorEngine,L as Locator,c as convertElementToCssSelector}from"../index-BPDFwkoW.js";import"vitest/internal/browser";page.extend({getByLabelText(e,m){return new PreviewLocator(getByLabelSelector(e,m))},getByRole(e,m){return new PreviewLocator(getByRoleSelector(e,m))},getByTestId(e){return new PreviewLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,m){return new PreviewLocator(getByAltTextSelector(e,m))},getByPlaceholder(e,m){return new PreviewLocator(getByPlaceholderSelector(e,m))},getByText(e,m){return new PreviewLocator(getByTextSelector(e,m))},getByTitle(e,m){return new PreviewLocator(getByTitleSelector(e,m))},_createLocator(e){return new PreviewLocator(e)},elementLocator(e){return new PreviewLocator(selectorEngine.generateSelectorSimple(e),e)}});class PreviewLocator extends Locator{constructor(e,m){super(),this._pwSelector=e,this._container=m}get selector(){let e=this.elements().map(e=>convertElementToCssSelector(e));if(!e.length)throw getElementError(this._pwSelector,this._container||document.body);return e.join(`, `)}click(){return userEvent.click(this.element())}dblClick(){return userEvent.dblClick(this.element())}tripleClick(){return userEvent.tripleClick(this.element())}hover(){return userEvent.hover(this.element())}unhover(){return userEvent.unhover(this.element())}async fill(e){return userEvent.fill(this.element(),e)}async upload(e){return userEvent.upload(this.element(),e)}selectOptions(e){return userEvent.selectOptions(this.element(),e)}clear(){return userEvent.clear(this.element())}locator(e){return new PreviewLocator(`${this._pwSelector} >> ${e}`,this._container)}elementLocator(e){return new PreviewLocator(selectorEngine.generateSelectorSimple(e),e)}}

package/dist/locators/webdriverio.js

@@ -1 +1 @@
-import{page,server}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector,h as getElementError}from"../public-utils-Kx5DUGWa.js";import{s as selectorEngine,L as Locator,c as convertElementToCssSelector,a as getBrowserState,g as getIframeScale}from"../index-DDlvjJVO.js";import"vitest/internal/browser";page.extend({getByLabelText(e,g){return new WebdriverIOLocator(getByLabelSelector(e,g))},getByRole(e,g){return new WebdriverIOLocator(getByRoleSelector(e,g))},getByTestId(e){return new WebdriverIOLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,g){return new WebdriverIOLocator(getByAltTextSelector(e,g))},getByPlaceholder(e,g){return new WebdriverIOLocator(getByPlaceholderSelector(e,g))},getByText(e,g){return new WebdriverIOLocator(getByTextSelector(e,g))},getByTitle(e,g){return new WebdriverIOLocator(getByTitleSelector(e,g))},_createLocator(e){return new WebdriverIOLocator(e)},elementLocator(e){return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(e))}});class WebdriverIOLocator extends Locator{constructor(e,g){super(),this._pwSelector=e,this._container=g}get selector(){let e=this.elements().map(e=>convertElementToCssSelector(e));if(!e.length)throw getElementError(this._pwSelector,this._container||document.body);let g=!1,_=e.map(e=>e.startsWith(`>>>`)?(g=!0,e.slice(3)):e);return(g?`>>>`:``)+_.join(`, `)}click(e){return super.click(processClickOptions(e))}dblClick(e){return super.dblClick(processClickOptions(e))}tripleClick(e){return super.tripleClick(processClickOptions(e))}selectOptions(e,g){let _=getWebdriverioSelectOptions(this.element(),e);return this.triggerCommand(`__vitest_selectOptions`,this.selector,_,g)}hover(e){return super.hover(processHoverOptions(e))}dropTo(e,g){return super.dropTo(e,processDragAndDropOptions(g))}locator(e){return new WebdriverIOLocator(`${this._pwSelector} >> ${e}`,this._container)}elementLocator(e){return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(e),e)}}function getWebdriverioSelectOptions(e,g){let _=[...e.querySelectorAll(`option`)],v=Array.isArray(g)?g:[g];if(!v.length)return[];if(v.length>1)throw Error(`Provider "webdriverio" doesn't support selecting multiple values at once`);let y=v[0];if(typeof y!=`string`){let e=`element`in y?y.element():y,g=_.indexOf(e);if(g===-1)throw Error(`The element ${selectorEngine.previewNode(e)} was not found in the "select" options.`);return[{index:g}]}let b=_.findIndex(e=>e.value===y);if(b!==-1)return[{index:b}];let x=_.findIndex(e=>e.textContent?.trim()===y||e.ariaLabel===y);if(x===-1)throw Error(`The option "${y}" was not found in the "select" options.`);return[{index:x}]}function processClickOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g=e;if(g.x!=null||g.y!=null){let e={};g.x!=null&&(g.x=scaleCoordinate(g.x,e)),g.y!=null&&(g.y=scaleCoordinate(g.y,e))}return e}function processHoverOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g=e,_={};return g.xOffset!=null&&(g.xOffset=scaleCoordinate(g.xOffset,_)),g.yOffset!=null&&(g.yOffset=scaleCoordinate(g.yOffset,_)),e}function processDragAndDropOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g={},_=e;return _.sourceX!=null&&(_.sourceX=scaleCoordinate(_.sourceX,g)),_.sourceY!=null&&(_.sourceY=scaleCoordinate(_.sourceY,g)),_.targetX!=null&&(_.targetX=scaleCoordinate(_.targetX,g)),_.targetY!=null&&(_.targetY=scaleCoordinate(_.targetY,g)),e}function scaleCoordinate(e,g){return Math.round(e*getCachedScale(g))}function getCachedScale(e){return e.scale??=getIframeScale()}
+import{page,server}from"@vitest/browser/context";import{g as getByTitleSelector,a as getByTextSelector,b as getByPlaceholderSelector,c as getByAltTextSelector,d as getByTestIdSelector,e as getByRoleSelector,f as getByLabelSelector,h as getElementError}from"../public-utils-B6exS8fl.js";import{s as selectorEngine,L as Locator,c as convertElementToCssSelector,a as getBrowserState,g as getIframeScale}from"../index-BPDFwkoW.js";import"vitest/internal/browser";page.extend({getByLabelText(e,g){return new WebdriverIOLocator(getByLabelSelector(e,g))},getByRole(e,g){return new WebdriverIOLocator(getByRoleSelector(e,g))},getByTestId(e){return new WebdriverIOLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute,e))},getByAltText(e,g){return new WebdriverIOLocator(getByAltTextSelector(e,g))},getByPlaceholder(e,g){return new WebdriverIOLocator(getByPlaceholderSelector(e,g))},getByText(e,g){return new WebdriverIOLocator(getByTextSelector(e,g))},getByTitle(e,g){return new WebdriverIOLocator(getByTitleSelector(e,g))},_createLocator(e){return new WebdriverIOLocator(e)},elementLocator(e){return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(e))}});class WebdriverIOLocator extends Locator{constructor(e,g){super(),this._pwSelector=e,this._container=g}get selector(){let e=this.elements().map(e=>convertElementToCssSelector(e));if(!e.length)throw getElementError(this._pwSelector,this._container||document.body);let g=!1,_=e.map(e=>e.startsWith(`>>>`)?(g=!0,e.slice(3)):e);return(g?`>>>`:``)+_.join(`, `)}click(e){return super.click(processClickOptions(e))}dblClick(e){return super.dblClick(processClickOptions(e))}tripleClick(e){return super.tripleClick(processClickOptions(e))}selectOptions(e,g){let _=getWebdriverioSelectOptions(this.element(),e);return this.triggerCommand(`__vitest_selectOptions`,this.selector,_,g)}hover(e){return super.hover(processHoverOptions(e))}dropTo(e,g){return super.dropTo(e,processDragAndDropOptions(g))}locator(e){return new WebdriverIOLocator(`${this._pwSelector} >> ${e}`,this._container)}elementLocator(e){return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(e),e)}}function getWebdriverioSelectOptions(e,g){let _=[...e.querySelectorAll(`option`)],v=Array.isArray(g)?g:[g];if(!v.length)return[];if(v.length>1)throw Error(`Provider "webdriverio" doesn't support selecting multiple values at once`);let y=v[0];if(typeof y!=`string`){let e=`element`in y?y.element():y,g=_.indexOf(e);if(g===-1)throw Error(`The element ${selectorEngine.previewNode(e)} was not found in the "select" options.`);return[{index:g}]}let b=_.findIndex(e=>e.value===y);if(b!==-1)return[{index:b}];let x=_.findIndex(e=>e.textContent?.trim()===y||e.ariaLabel===y);if(x===-1)throw Error(`The option "${y}" was not found in the "select" options.`);return[{index:x}]}function processClickOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g=e;if(g.x!=null||g.y!=null){let e={};g.x!=null&&(g.x=scaleCoordinate(g.x,e)),g.y!=null&&(g.y=scaleCoordinate(g.y,e))}return e}function processHoverOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g=e,_={};return g.xOffset!=null&&(g.xOffset=scaleCoordinate(g.xOffset,_)),g.yOffset!=null&&(g.yOffset=scaleCoordinate(g.yOffset,_)),e}function processDragAndDropOptions(e){if(!e||!getBrowserState().config.browser.ui)return e;let g={},_=e;return _.sourceX!=null&&(_.sourceX=scaleCoordinate(_.sourceX,g)),_.sourceY!=null&&(_.sourceY=scaleCoordinate(_.sourceY,g)),_.targetX!=null&&(_.targetX=scaleCoordinate(_.targetX,g)),_.targetY!=null&&(_.targetY=scaleCoordinate(_.targetY,g)),e}function scaleCoordinate(e,g){return Math.round(e*getCachedScale(g))}function getCachedScale(e){return e.scale??=getIframeScale()}

package/dist/providers/playwright.d.ts

@@ -10,7 +10,7 @@ interface PlaywrightProviderOptions {
 	* The options passed down to [`playwright.connect`](https://playwright.dev/docs/api/class-browsertype#browser-type-launch) method.
 	* @see {@link https://playwright.dev/docs/api/class-browsertype#browser-type-launch}
 	*/
-	launchOptions?: LaunchOptions;
+	launchOptions?: Omit<LaunchOptions, "tracesDir">;
 	/**
 	* The options passed down to [`playwright.connect`](https://playwright.dev/docs/api/class-browsertype#browser-type-connect) method.
 	*
@@ -31,7 +31,7 @@ interface PlaywrightProviderOptions {
 	*/
 	actionTimeout?: number;
 }
-declare function playwright(options?: PlaywrightProviderOptions): BrowserProviderOption;
+declare function playwright(options?: PlaywrightProviderOptions): BrowserProviderOption<PlaywrightProviderOptions>;
 declare class PlaywrightBrowserProvider implements BrowserProvider {
 	private project;
 	private options;
@@ -44,6 +44,8 @@ declare class PlaywrightBrowserProvider implements BrowserProvider {
 	browserName: PlaywrightBrowser;
 	private browserPromise;
 	private closing;
+	tracingContexts: Set<string>;
+	pendingTraces: Map<string, string>;
 	constructor(project: TestProject, options: PlaywrightProviderOptions);
 	private openBrowser;
 	private createMocker;

package/dist/providers/playwright.js

@@ -12,6 +12,7 @@ function playwright(options = {}) {
 	return {
 		name: "playwright",
 		supportedBrowser: playwrightBrowsers,
+		options,
 		factory(project) {
 			return new PlaywrightBrowserProvider(project, options);
 		},
@@ -28,11 +29,27 @@ class PlaywrightBrowserProvider {
 	browserName;
 	browserPromise = null;
 	closing = false;
+	tracingContexts = new Set();
+	pendingTraces = new Map();
 	constructor(project, options) {
 		this.project = project;
 		this.options = options;
 		this.browserName = project.config.browser.name;
 		this.mocker = this.createMocker();
+		// make sure the traces are finished if the test hangs
+		process.on("SIGTERM", () => {
+			if (!this.browser) {
+				return;
+			}
+			const promises = [];
+			for (const [trace, contextId] of this.pendingTraces.entries()) {
+				promises.push((() => {
+					const context = this.contexts.get(contextId);
+					return context?.tracing.stopChunk({ path: trace });
+				})());
+			}
+			return Promise.allSettled(promises);
+		});
 	}
 	async openBrowser() {
 		await this._throwIfClosing();
@@ -62,10 +79,14 @@ class PlaywrightBrowserProvider {
 				...this.options.launchOptions,
 				headless: options.headless
 			};
-			if (this.project.config.inspector.enabled) {
+			if (typeof options.trace === "object" && options.trace.tracesDir) {
+				launchOptions.tracesDir = options.trace?.tracesDir;
+			}
+			const inspector = this.project.vitest.config.inspector;
+			if (inspector.enabled) {
 				// NodeJS equivalent defaults: https://nodejs.org/en/learn/getting-started/debugging#enable-inspector
-				const port = this.project.config.inspector.port || 9229;
-				const host = this.project.config.inspector.host || "127.0.0.1";
+				const port = inspector.port || 9229;
+				const host = inspector.host || "127.0.0.1";
 				launchOptions.args ||= [];
 				launchOptions.args.push(`--remote-debugging-port=${port}`);
 				launchOptions.args.push(`--remote-debugging-address=${host}`);

package/dist/providers/preview.js

@@ -1,6 +1,7 @@
 function preview() {
 	return {
 		name: "preview",
+		options: {},
 		factory(project) {
 			return new PreviewBrowserProvider(project);
 		},

package/dist/providers/webdriverio.d.ts

@@ -1,9 +1,9 @@
 import { ScreenshotMatcherOptions, ScreenshotComparatorRegistry } from '@vitest/browser/context';
-import { BrowserProviderOption, BrowserProvider, TestProject } from 'vitest/node';
+import { BrowserProviderOption, BrowserProvider, TestProject, CDPSession } from 'vitest/node';
 import { ClickOptions, DragAndDropOptions, remote } from 'webdriverio';
 
 interface WebdriverProviderOptions extends Partial<Parameters<typeof remote>[0]> {}
-declare function webdriverio(options?: WebdriverProviderOptions): BrowserProviderOption;
+declare function webdriverio(options?: WebdriverProviderOptions): BrowserProviderOption<WebdriverProviderOptions>;
 declare class WebdriverBrowserProvider implements BrowserProvider {
 	name: "webdriverio";
 	supportsParallelism: boolean;
@@ -31,6 +31,7 @@ declare class WebdriverBrowserProvider implements BrowserProvider {
 	openPage(sessionId: string, url: string): Promise<void>;
 	private _throwIfClosing;
 	close(): Promise<void>;
+	getCDPSession(_sessionId: string): Promise<CDPSession>;
 }
 declare module "vitest/node" {
 	interface UserEventClickOptions extends ClickOptions {}

package/dist/providers/webdriverio.js

@@ -11,6 +11,7 @@ function webdriverio(options = {}) {
 	return {
 		name: "webdriverio",
 		supportedBrowser: webdriverBrowsers,
+		options,
 		factory(project) {
 			return new WebdriverBrowserProvider(project, options);
 		},
@@ -135,6 +136,19 @@ class WebdriverBrowserProvider {
 			capabilities[key] ??= {};
 			capabilities[key].args = args;
 		}
+		const inspector = this.project.vitest.config.inspector;
+		if (inspector.enabled && (browser === "chrome" || browser === "edge")) {
+			const key = browser === "chrome" ? "goog:chromeOptions" : "ms:edgeOptions";
+			const args = capabilities[key]?.args || [];
+			// NodeJS equivalent defaults: https://nodejs.org/en/learn/getting-started/debugging#enable-inspector
+			const port = inspector.port || 9229;
+			const host = inspector.host || "127.0.0.1";
+			args.push(`--remote-debugging-port=${port}`);
+			args.push(`--remote-debugging-address=${host}`);
+			this.project.vitest.logger.log(`Debugger listening on ws://${host}:${port}`);
+			capabilities[key] ??= {};
+			capabilities[key].args = args;
+		}
 		return capabilities;
 	}
 	async openPage(sessionId, url) {
@@ -166,6 +180,27 @@ class WebdriverBrowserProvider {
 		browser.sessionId = undefined;
 		this.browser = null;
 	}
+	async getCDPSession(_sessionId) {
+		return {
+			send: (method, params) => {
+				if (!this.browser) {
+					throw new Error(`The environment was torn down.`);
+				}
+				return this.browser.sendCommandAndGetResult(method, params ?? {}).catch((error) => {
+					return Promise.reject(new Error(`Failed to execute "${method}" command.`, { cause: error }));
+				});
+			},
+			on: () => {
+				throw new Error(`webdriverio provider doesn't support cdp.on()`);
+			},
+			once: () => {
+				throw new Error(`webdriverio provider doesn't support cdp.once()`);
+			},
+			off: () => {
+				throw new Error(`webdriverio provider doesn't support cdp.off()`);
+			}
+		};
+	}
 }
 
 export { WebdriverBrowserProvider, webdriverio };