@voidzero-dev/vite-plus-test 0.1.8 → 0.1.10

package/dist/@vitest/browser/locators.d.ts

@@ -1,4 +1,4 @@
-import { UserEventClickOptions, UserEventClearOptions, UserEventHoverOptions, UserEventFillOptions, UserEventUploadOptions, UserEventDragAndDropOptions, UserEventSelectOptions, LocatorScreenshotOptions, LocatorByRoleOptions, LocatorOptions } from './index.js';
+import { UserEventClickOptions, UserEventWheelOptions, UserEventClearOptions, UserEventHoverOptions, UserEventFillOptions, UserEventUploadOptions, UserEventDragAndDropOptions, UserEventSelectOptions, LocatorScreenshotOptions, MarkOptions, LocatorByRoleOptions, LocatorOptions, SelectorOptions } from './index.js';
 
 type ClauseCombinator = '' | '>' | '+' | '~' | '>=';
 type CSSFunctionArgument = CSSComplexSelector | number | string;
@@ -299,19 +299,23 @@ interface SelectorEngine {
 declare function convertElementToCssSelector(element: Element): string;
 declare function processTimeoutOptions<T extends {
 	timeout?: number;
-}>(options_?: T): T | undefined;
+}>(options_: T | undefined): T | undefined;
 declare function getIframeScale(): number;
 
+declare function ensureAwaited<T>(promise: (error?: Error) => Promise<T>): Promise<T>;
+
 declare const selectorEngine: Ivya;
 declare abstract class Locator {
 	abstract selector: string;
 	private _parsedSelector;
 	protected _container?: Element | undefined;
 	protected _pwSelector?: string | undefined;
+	protected _errorSource?: Error;
 	constructor();
 	click(options?: UserEventClickOptions): Promise<void>;
 	dblClick(options?: UserEventClickOptions): Promise<void>;
 	tripleClick(options?: UserEventClickOptions): Promise<void>;
+	wheel(options: UserEventWheelOptions): Promise<void>;
 	clear(options?: UserEventClearOptions): Promise<void>;
 	hover(options?: UserEventHoverOptions): Promise<void>;
 	unhover(options?: UserEventHoverOptions): Promise<void>;
@@ -326,6 +330,7 @@ declare abstract class Locator {
 		base64: string;
 	}>;
 	screenshot(options?: LocatorScreenshotOptions): Promise<string>;
+	mark(name: string, options?: MarkOptions): Promise<void>;
 	protected abstract locator(selector: string): Locator;
 	protected abstract elementLocator(element: Element): Locator;
 	getByRole(role: string, options?: LocatorByRoleOptions): Locator;
@@ -348,7 +353,13 @@ declare abstract class Locator {
 	last(): Locator;
 	toString(): string;
 	toJSON(): string;
+	findElement(options_?: SelectorOptions): Promise<HTMLElement | SVGElement>;
 	protected triggerCommand<T>(command: string, ...args: any[]): Promise<T>;
 }
+declare function triggerCommandWithTrace<T>(options: {
+	name: string;
+	arguments: unknown[];
+	errorSource?: Error | undefined;
+}): Promise<T>;
 
-export { Locator, convertElementToCssSelector, getByAltTextSelector, getByLabelSelector, getByPlaceholderSelector, getByRoleSelector, getByTestIdSelector, getByTextSelector, getByTitleSelector, getIframeScale, processTimeoutOptions, selectorEngine };
+export { Locator, convertElementToCssSelector, ensureAwaited, getByAltTextSelector, getByLabelSelector, getByPlaceholderSelector, getByRoleSelector, getByTestIdSelector, getByTextSelector, getByTitleSelector, getIframeScale, processTimeoutOptions, selectorEngine, triggerCommandWithTrace };

package/dist/@vitest/browser/locators.js

@@ -1 +1 @@
-export{L as Locator,n as convertElementToCssSelector,q as getByAltTextSelector,r as getByLabelSelector,t as getByPlaceholderSelector,u as getByRoleSelector,v as getByTestIdSelector,w as getByTextSelector,x as getByTitleSelector,o as getIframeScale,p as processTimeoutOptions,s as selectorEngine}from"./index-D6m36C6U.js";import'../../browser.js';
+export{L as Locator,o as convertElementToCssSelector,q as ensureAwaited,r as getByAltTextSelector,s as getByLabelSelector,t as getByPlaceholderSelector,u as getByRoleSelector,v as getByTestIdSelector,w as getByTextSelector,x as getByTitleSelector,y as getIframeScale,p as processTimeoutOptions,z as selectorEngine,A as triggerCommandWithTrace}from"./index-5Pe7X7sp.js";import'../../browser.js';

package/dist/@vitest/browser-playwright/index.d.ts

@@ -1,8 +1,8 @@
 import { CustomComparatorsRegistry } from '../browser/index.js';
 export { defineBrowserCommand } from '../browser/index.js';
-import { Page, Frame, FrameLocator, BrowserContext, CDPSession, LaunchOptions, ConnectOptions, BrowserContextOptions, Browser } from 'playwright';
+import { Page, Frame, FrameLocator, BrowserContext, CDPSession, Browser, LaunchOptions, ConnectOptions, BrowserContextOptions } from 'playwright';
 import { ScreenshotMatcherOptions, ScreenshotComparatorRegistry, Locator } from '../browser/index.js';
-import { BrowserProviderOption, BrowserProvider, BrowserModuleMocker, TestProject, CDPSession as CDPSession$1 } from '../../node.js';
+import { BrowserProvider, BrowserModuleMocker, TestProject, CDPSession as CDPSession$1, BrowserProviderOption } from '../../node.js';
 
 declare const playwrightBrowsers: readonly ["firefox", "webkit", "chromium"];
 type PlaywrightBrowser = (typeof playwrightBrowsers)[number];
@@ -31,6 +31,18 @@ interface PlaywrightProviderOptions {
 	* @default 0 (no timeout)
 	*/
 	actionTimeout?: number;
+	/**
+	* Use a persistent context instead of a regular browser context.
+	* This allows browser state (cookies, localStorage, DevTools settings, etc.) to persist between test runs.
+	* When set to `true`, the user data is stored in `./node_modules/.cache/vitest-playwright-user-data`.
+	* When set to a string, the value is used as the path to the user data directory.
+	*
+	* Note: This option is ignored when running tests in parallel (e.g. headless with fileParallelism enabled)
+	* because persistent context cannot be shared across parallel sessions.
+	* @default false
+	* @see {@link https://playwright.dev/docs/api/class-browsertype#browser-type-launch-persistent-context}
+	*/
+	persistentContext?: boolean | string;
 }
 declare function playwright(options?: PlaywrightProviderOptions): BrowserProviderOption<PlaywrightProviderOptions>;
 declare class PlaywrightBrowserProvider implements BrowserProvider {
@@ -39,6 +51,7 @@ declare class PlaywrightBrowserProvider implements BrowserProvider {
 	name: "playwright";
 	supportsParallelism: boolean;
 	browser: Browser | null;
+	persistentContext: BrowserContext | null;
 	contexts: Map<string, BrowserContext>;
 	pages: Map<string, Page>;
 	mocker: BrowserModuleMocker;
@@ -52,6 +65,7 @@ declare class PlaywrightBrowserProvider implements BrowserProvider {
 	private openBrowser;
 	private createMocker;
 	private createContext;
+	private getContextOptions;
 	getPage(sessionId: string): Page;
 	getCommandsContext(sessionId: string): {
 		page: Page;
@@ -60,7 +74,9 @@ declare class PlaywrightBrowserProvider implements BrowserProvider {
 		readonly iframe: FrameLocator;
 	};
 	private openBrowserPage;
-	openPage(sessionId: string, url: string): Promise<void>;
+	openPage(sessionId: string, url: string, options: {
+		parallel: boolean;
+	}): Promise<void>;
 	private _throwIfClosing;
 	getCDPSession(sessionid: string): Promise<CDPSession$1>;
 	close(): Promise<void>;
@@ -86,7 +102,8 @@ type PWScreenshotOptions = NonNullable<Parameters<Page["screenshot"]>[0]>;
 type PWSelectOptions = NonNullable<Parameters<Page["selectOption"]>[2]>;
 type PWDragAndDropOptions = NonNullable<Parameters<Page["dragAndDrop"]>[2]>;
 type PWSetInputFiles = NonNullable<Parameters<Page["setInputFiles"]>[2]>;
-type PWCDPSession = CDPSession;
+type PWCDPSession = Pick<CDPSession, "send" | "on" | "off" | "once">;
+
 declare module "vitest/browser" {
 	interface UserEventHoverOptions extends PWHoverOptions {}
 	interface UserEventClickOptions extends PWClickOptions {}
@@ -103,4 +120,4 @@ declare module "vitest/browser" {
 }
 
 export { PlaywrightBrowserProvider, playwright };
-export type { PlaywrightProviderOptions };
+export type { PWCDPSession as CDPSession, PlaywrightProviderOptions };

package/dist/@vitest/browser-playwright/index.js

@@ -1,4 +1,4 @@
-import { parseKeyDef, resolveScreenshotPath, defineBrowserProvider } from '../browser/index.js';
+import { asLocator, parseKeyDef, resolveScreenshotPath, defineBrowserProvider } from '../browser/index.js';
 export { defineBrowserCommand } from '../browser/index.js';
 import { createManualModuleSource } from '../mocker/node.js';
 import c from '../../vendor/tinyrainbow.mjs';
@@ -169,23 +169,28 @@ const basename = function(p, extension) {
   return extension && lastSegment.endsWith(extension) ? lastSegment.slice(0, -extension.length) : lastSegment;
 };
 
+// strip iframe locator part from the trace description e.g.
+// - locator('[data-vitest="true"]').contentFrame().getByRole('button')
+//     ⇓
+// - getByRole('button')
+function getDescribedLocator(context, selector) {
+  const locator = context.iframe.locator(selector);
+  return typeof locator.describe === "function" ? locator.describe(asLocator("javascript", selector)) : locator;
+}
+
 const clear = async (context, selector) => {
-  const { iframe } = context;
-  const element = iframe.locator(selector);
+  const element = getDescribedLocator(context, selector);
   await element.clear();
 };
 
 const click = async (context, selector, options = {}) => {
-  const tester = context.iframe;
-  await tester.locator(selector).click(options);
+  await getDescribedLocator(context, selector).click(options);
 };
 const dblClick = async (context, selector, options = {}) => {
-  const tester = context.iframe;
-  await tester.locator(selector).dblclick(options);
+  await getDescribedLocator(context, selector).dblclick(options);
 };
 const tripleClick = async (context, selector, options = {}) => {
-  const tester = context.iframe;
-  await tester.locator(selector).click({
+  await getDescribedLocator(context, selector).click({
     ...options,
     clickCount: 3
   });
@@ -197,13 +202,12 @@ const dragAndDrop = async (context, source, target, options_) => {
 };
 
 const fill = async (context, selector, text, options = {}) => {
-  const { iframe } = context;
-  const element = iframe.locator(selector);
+  const element = getDescribedLocator(context, selector);
   await element.fill(text, options);
 };
 
 const hover = async (context, selector, options = {}) => {
-  await context.iframe.locator(selector).hover(options);
+  await getDescribedLocator(context, selector).hover(options);
 };
 
 const keyboard = async (context, text, state) => {
@@ -512,10 +516,10 @@ async function takeScreenshot(context, name, options) {
     savePath = normalize(path);
     await mkdir(dirname(savePath), { recursive: true });
   }
-  const mask = options.mask?.map((selector) => context.iframe.locator(selector));
+  const mask = options.mask?.map((selector) => getDescribedLocator(context, selector));
   if (options.element) {
     const { element: selector, ...config } = options;
-    const element = context.iframe.locator(selector);
+    const element = getDescribedLocator(context, selector);
     const buffer = await element.screenshot({
       ...config,
       mask,
@@ -526,7 +530,7 @@ async function takeScreenshot(context, name, options) {
       path
     };
   }
-  const buffer = await context.iframe.locator("body").screenshot({
+  const buffer = await getDescribedLocator(context, "body").screenshot({
     ...options,
     mask,
     path: savePath
@@ -539,13 +543,12 @@ async function takeScreenshot(context, name, options) {
 
 const selectOptions = async (context, selector, userValues, options = {}) => {
   const value = userValues;
-  const { iframe } = context;
-  const selectElement = iframe.locator(selector);
+  const selectElement = getDescribedLocator(context, selector);
   const values = await Promise.all(value.map(async (v) => {
     if (typeof v === "string") {
       return v;
     }
-    const elementHandler = await iframe.locator(v.element).elementHandle();
+    const elementHandler = await getDescribedLocator(context, v.element).elementHandle();
     if (!elementHandler) {
       throw new Error(`Element not found: ${v.element}`);
     }
@@ -569,7 +572,7 @@ const startTracing = async ({ context, project, provider, sessionId }) => {
     await context.tracing.start({
       screenshots: options.screenshots ?? true,
       snapshots: options.snapshots ?? true,
-      sources: false
+      sources: options.sources ?? true
     }).catch(() => {
       provider.tracingContexts.delete(sessionId);
     });
@@ -605,6 +608,68 @@ const stopChunkTrace = async (context, { name }) => {
   }
   throw new TypeError(`The ${context.provider.name} provider does not support tracing.`);
 };
+const markTrace = async (context, payload) => {
+  if (isPlaywrightProvider(context.provider)) {
+    // skip if tracing is not active
+    // this is only safe guard and this isn't expected to happen since
+    // runner already checks if tracing is active before sending this command
+    if (!context.provider.tracingContexts.has(context.sessionId)) {
+      return;
+    }
+    const { name, selector, stack } = payload;
+    const location = parseLocation(context, stack);
+    // mark trace via group/groupEnd with dummy calls to force snapshot.
+    // https://github.com/microsoft/playwright/issues/39308
+    await context.context.tracing.group(name, { location });
+    try {
+      if (selector) {
+        const locator = getDescribedLocator(context, selector);
+        if (typeof locator._expect === "function") {
+          await locator._expect("to.be.attached", {
+            isNot: false,
+            timeout: 1
+          });
+        } else {
+          await context.page.evaluate(() => 0);
+        }
+      } else {
+        await context.page.evaluate(() => 0);
+      }
+    } catch {}
+    await context.context.tracing.groupEnd();
+    return;
+  }
+  throw new TypeError(`The ${context.provider.name} provider does not support tracing.`);
+};
+const groupTraceStart = async (context, payload) => {
+  if (isPlaywrightProvider(context.provider)) {
+    if (!context.provider.tracingContexts.has(context.sessionId)) {
+      return;
+    }
+    const { name, stack } = payload;
+    const location = parseLocation(context, stack);
+    await context.context.tracing.group(name, { location });
+    return;
+  }
+  throw new TypeError(`The ${context.provider.name} provider does not support tracing.`);
+};
+const groupTraceEnd = async (context) => {
+  if (isPlaywrightProvider(context.provider)) {
+    if (!context.provider.tracingContexts.has(context.sessionId)) {
+      return;
+    }
+    await context.context.tracing.groupEnd();
+    return;
+  }
+  throw new TypeError(`The ${context.provider.name} provider does not support tracing.`);
+};
+function parseLocation(context, stack) {
+  if (!stack) {
+    return;
+  }
+  const parsedStacks = context.project.browser.parseStacktrace(stack);
+  return parsedStacks[0];
+}
 function resolveTracesPath({ testPath, project }, name) {
   if (!testPath) {
     throw new Error(`This command can only be called inside a test file.`);
@@ -665,8 +730,7 @@ function isPlaywrightProvider(provider) {
 const type = async (context, selector, text, options = {}) => {
   const { skipClick = false, skipAutoClose = false } = options;
   const unreleased = new Set(Reflect.get(options, "unreleased") ?? []);
-  const { iframe } = context;
-  const element = iframe.locator(selector);
+  const element = getDescribedLocator(context, selector);
   if (!skipClick) {
     await element.focus();
   }
@@ -680,7 +744,6 @@ const upload = async (context, selector, files, options) => {
     throw new Error(`Cannot upload files outside of a test`);
   }
   const root = context.project.config.root;
-  const { iframe } = context;
   const playwrightFiles = files.map((file) => {
     if (typeof file === "string") {
       return resolve(root, file);
@@ -691,7 +754,17 @@ const upload = async (context, selector, files, options) => {
       buffer: Buffer.from(file.base64, "base64")
     };
   });
-  await iframe.locator(selector).setInputFiles(playwrightFiles, options);
+  await getDescribedLocator(context, selector).setInputFiles(playwrightFiles, options);
+};
+
+const wheel = async (context, selector, options) => {
+  await hover(context, selector);
+  const times = options.times ?? 1;
+  const deltaX = options.delta.x ?? 0;
+  const deltaY = options.delta.y ?? 0;
+  for (let count = 0; count < times; count += 1) {
+    await context.page.mouse.wheel(deltaX, deltaY);
+  }
 };
 
 var commands = {
@@ -699,6 +772,7 @@ var commands = {
   __vitest_click: click,
   __vitest_dblClick: dblClick,
   __vitest_tripleClick: tripleClick,
+  __vitest_wheel: wheel,
   __vitest_takeScreenshot: takeScreenshot,
   __vitest_type: type,
   __vitest_clear: clear,
@@ -713,7 +787,10 @@ var commands = {
   __vitest_startChunkTrace: startChunkTrace,
   __vitest_startTracing: startTracing,
   __vitest_stopChunkTrace: stopChunkTrace,
-  __vitest_annotateTraces: annotateTraces
+  __vitest_annotateTraces: annotateTraces,
+  __vitest_markTrace: markTrace,
+  __vitest_groupTraceStart: groupTraceStart,
+  __vitest_groupTraceEnd: groupTraceEnd
 };
 
 const distRoot = dirname(fileURLToPath(import.meta.url));
@@ -741,6 +818,7 @@ class PlaywrightBrowserProvider {
   name = "playwright";
   supportsParallelism = true;
   browser = null;
+  persistentContext = null;
   contexts = new Map();
   pages = new Map();
   mocker;
@@ -773,7 +851,7 @@ class PlaywrightBrowserProvider {
       return Promise.allSettled(promises);
     });
   }
-  async openBrowser() {
+  async openBrowser(openBrowserOptions) {
     await this._throwIfClosing();
     if (this.browserPromise) {
       debug?.("[%s] the browser is resolving, reusing the promise", this.browserName);
@@ -786,17 +864,6 @@ class PlaywrightBrowserProvider {
     this.browserPromise = (async () => {
       const options = this.project.config.browser;
       const playwright = await import('playwright');
-      if (this.options.connectOptions) {
-        if (this.options.launchOptions) {
-          this.project.vitest.logger.warn(c.yellow(`Found both ${c.bold(c.italic(c.yellow("connect")))} and ${c.bold(c.italic(c.yellow("launch")))} options in browser instance configuration.
-          Ignoring ${c.bold(c.italic(c.yellow("launch")))} options and using ${c.bold(c.italic(c.yellow("connect")))} mode.
-          You probably want to remove one of the two options and keep only the one you want to use.`));
-        }
-        const browser = await playwright[this.browserName].connect(this.options.connectOptions.wsEndpoint, this.options.connectOptions);
-        this.browser = browser;
-        this.browserPromise = null;
-        return this.browser;
-      }
       const launchOptions = {
         ...this.options.launchOptions,
         headless: options.headless
@@ -811,8 +878,10 @@ class PlaywrightBrowserProvider {
         const host = inspector.host || "127.0.0.1";
         launchOptions.args ||= [];
         launchOptions.args.push(`--remote-debugging-port=${port}`);
-        launchOptions.args.push(`--remote-debugging-address=${host}`);
-        this.project.vitest.logger.log(`Debugger listening on ws://${host}:${port}`);
+        if (host !== "localhost" && host !== "127.0.0.1" && host !== "::1") {
+          this.project.vitest.logger.warn(`Custom inspector host "${host}" will be ignored. Chromium only allows remote debugging on localhost.`);
+        }
+        this.project.vitest.logger.log(`Debugger listening on ws://127.0.0.1:${port}`);
       }
       // start Vitest UI maximized only on supported browsers
       if (this.project.config.browser.ui && this.browserName === "chromium") {
@@ -824,7 +893,39 @@ class PlaywrightBrowserProvider {
         }
       }
       debug?.("[%s] initializing the browser with launch options: %O", this.browserName, launchOptions);
-      this.browser = await playwright[this.browserName].launch(launchOptions);
+      if (this.options.connectOptions) {
+        let { wsEndpoint, headers = {}, ...connectOptions } = this.options.connectOptions;
+        if ("x-playwright-launch-options" in headers) {
+          this.project.vitest.logger.warn(c.yellow("Detected \"x-playwright-launch-options\" in connectOptions.headers. Provider config launchOptions is ignored."));
+        } else {
+          headers = {
+            ...headers,
+            "x-playwright-launch-options": JSON.stringify(launchOptions)
+          };
+        }
+        this.browser = await playwright[this.browserName].connect(wsEndpoint, {
+          ...connectOptions,
+          headers
+        });
+        this.browserPromise = null;
+        return this.browser;
+      }
+      let persistentContextOption = this.options.persistentContext;
+      if (persistentContextOption && openBrowserOptions.parallel) {
+        persistentContextOption = false;
+        this.project.vitest.logger.warn(c.yellow(`The persistentContext option is ignored because tests are running in parallel.`));
+      }
+      if (persistentContextOption) {
+        const userDataDir = typeof this.options.persistentContext === "string" ? this.options.persistentContext : "./node_modules/.cache/vitest-playwright-user-data";
+        // TODO: how to avoid default "about" page?
+        this.persistentContext = await playwright[this.browserName].launchPersistentContext(userDataDir, {
+          ...launchOptions,
+          ...this.getContextOptions()
+        });
+        this.browser = this.persistentContext.browser();
+      } else {
+        this.browser = await playwright[this.browserName].launch(launchOptions);
+      }
       this.browserPromise = null;
       return this.browser;
     })();
@@ -944,29 +1045,22 @@ class PlaywrightBrowserProvider {
       }
     };
   }
-  async createContext(sessionId) {
+  async createContext(sessionId, openBrowserOptions) {
     await this._throwIfClosing();
     if (this.contexts.has(sessionId)) {
       debug?.("[%s][%s] the context already exists, reusing it", sessionId, this.browserName);
       return this.contexts.get(sessionId);
     }
-    const browser = await this.openBrowser();
+    const browser = await this.openBrowser(openBrowserOptions);
     await this._throwIfClosing(browser);
     const actionTimeout = this.options.actionTimeout;
-    const contextOptions = this.options.contextOptions ?? {};
-    const options = {
-      ...contextOptions,
-      ignoreHTTPSErrors: true
-    };
-    if (this.project.config.browser.ui) {
-      options.viewport = null;
-    }
+    const options = this.getContextOptions();
     // TODO: investigate the consequences for Vitest 5
     // else {
     // if UI is disabled, keep the iframe scale to 1
     // options.viewport ??= this.project.config.browser.viewport
     // }
-    const context = await browser.newContext(options);
+    const context = this.persistentContext ?? await browser.newContext(options);
     await this._throwIfClosing(context);
     if (actionTimeout != null) {
       context.setDefaultTimeout(actionTimeout);
@@ -975,6 +1069,17 @@ class PlaywrightBrowserProvider {
     this.contexts.set(sessionId, context);
     return context;
   }
+  getContextOptions() {
+    const contextOptions = this.options.contextOptions ?? {};
+    const options = {
+      ...contextOptions,
+      ignoreHTTPSErrors: true
+    };
+    if (this.project.config.browser.ui) {
+      options.viewport = null;
+    }
+    return options;
+  }
   getPage(sessionId) {
     const page = this.pages.get(sessionId);
     if (!page) {
@@ -1008,7 +1113,7 @@ class PlaywrightBrowserProvider {
       }
     };
   }
-  async openBrowserPage(sessionId) {
+  async openBrowserPage(sessionId, options) {
     await this._throwIfClosing();
     if (this.pages.has(sessionId)) {
       debug?.("[%s][%s] the page already exists, closing the old one", sessionId, this.browserName);
@@ -1016,7 +1121,7 @@ class PlaywrightBrowserProvider {
       await page.close();
       this.pages.delete(sessionId);
     }
-    const context = await this.createContext(sessionId);
+    const context = await this.createContext(sessionId, options);
     const page = await context.newPage();
     debug?.("[%s][%s] the page is ready", sessionId, this.browserName);
     await this._throwIfClosing(page);
@@ -1028,9 +1133,9 @@ class PlaywrightBrowserProvider {
     }
     return page;
   }
-  async openPage(sessionId, url) {
+  async openPage(sessionId, url, options) {
     debug?.("[%s][%s] creating the browser page for %s", sessionId, this.browserName, url);
-    const browserPage = await this.openBrowserPage(sessionId);
+    const browserPage = await this.openBrowserPage(sessionId, options);
     debug?.("[%s][%s] browser page is created, opening %s", sessionId, this.browserName, url);
     await browserPage.goto(url, { timeout: 0 });
     await this._throwIfClosing(browserPage);
@@ -1050,18 +1155,17 @@ class PlaywrightBrowserProvider {
     const page = this.getPage(sessionid);
     const cdp = await page.context().newCDPSession(page);
     return {
-      async send(method, params) {
-        const result = await cdp.send(method, params);
-        return result;
+      send(method, params) {
+        return cdp.send(method, params);
       },
       on(event, listener) {
-        cdp.on(event, listener);
+        return cdp.on(event, listener);
       },
       off(event, listener) {
-        cdp.off(event, listener);
+        return cdp.off(event, listener);
       },
       once(event, listener) {
-        cdp.once(event, listener);
+        return cdp.once(event, listener);
       }
     };
   }
@@ -1076,7 +1180,11 @@ class PlaywrightBrowserProvider {
     this.browser = null;
     await Promise.all([...this.pages.values()].map((p) => p.close()));
     this.pages.clear();
-    await Promise.all([...this.contexts.values()].map((c) => c.close()));
+    if (this.persistentContext) {
+      await this.persistentContext.close();
+    } else {
+      await Promise.all([...this.contexts.values()].map((c) => c.close()));
+    }
     this.contexts.clear();
     await browser?.close();
     debug?.("[%s] provider is closed", this.browserName);

package/dist/@vitest/browser-preview/index.d.ts

@@ -1,4 +1,5 @@
-import { BrowserProviderOption, BrowserProvider, TestProject } from '../../node.js';
+import { SelectorOptions } from '../browser/index.js';
+import { BrowserProvider, TestProject, BrowserProviderOption } from '../../node.js';
 export { defineBrowserCommand } from '../browser/index.js';
 
 declare function preview(): BrowserProviderOption;
@@ -15,5 +16,17 @@ declare class PreviewBrowserProvider implements BrowserProvider {
 	openPage(_sessionId: string, url: string): Promise<void>;
 	close(): Promise<void>;
 }
+declare module "vitest/browser" {
+	interface UserEventClickOptions extends SelectorOptions {}
+	interface UserEventHoverOptions extends SelectorOptions {}
+	interface UserEventFillOptions extends SelectorOptions {}
+	interface UserEventSelectOptions extends SelectorOptions {}
+	interface UserEventClearOptions extends SelectorOptions {}
+	interface UserEventDoubleClickOptions extends SelectorOptions {}
+	interface UserEventTripleClickOptions extends SelectorOptions {}
+	interface UserEventUploadOptions extends SelectorOptions {}
+	interface UserEventWheelBaseOptions extends SelectorOptions {}
+	interface LocatorScreenshotOptions extends SelectorOptions {}
+}
 
 export { PreviewBrowserProvider, preview };

package/dist/@vitest/browser-preview/locators.js

@@ -16,32 +16,45 @@ class PreviewLocator extends Locator {
     }
     return selectors.join(", ");
   }
-  click() {
-    return userEvent.click(this.element());
+  async click(options) {
+    const element = await this.findElement(options);
+    return userEvent.click(element);
   }
-  dblClick() {
-    return userEvent.dblClick(this.element());
+  async dblClick(options) {
+    const element = await this.findElement(options);
+    return userEvent.dblClick(element);
   }
-  tripleClick() {
-    return userEvent.tripleClick(this.element());
+  async tripleClick(options) {
+    const element = await this.findElement(options);
+    return userEvent.tripleClick(element);
   }
-  hover() {
-    return userEvent.hover(this.element());
+  async hover(options) {
+    const element = await this.findElement(options);
+    return userEvent.hover(element);
   }
-  unhover() {
-    return userEvent.unhover(this.element());
+  async unhover(options) {
+    const element = await this.findElement(options);
+    return userEvent.unhover(element);
   }
-  async fill(text) {
-    return userEvent.fill(this.element(), text);
+  async fill(text, options) {
+    const element = await this.findElement(options);
+    return userEvent.fill(element, text);
   }
-  async upload(file) {
-    return userEvent.upload(this.element(), file);
+  async upload(file, options) {
+    const element = await this.findElement(options);
+    return userEvent.upload(element, file);
   }
-  selectOptions(options) {
-    return userEvent.selectOptions(this.element(), options);
+  async wheel(options) {
+    const element = await this.findElement(options);
+    return userEvent.wheel(element, options);
   }
-  clear() {
-    return userEvent.clear(this.element());
+  async selectOptions(options, settings) {
+    const element = await this.findElement(settings);
+    return userEvent.selectOptions(element, options);
+  }
+  async clear(options) {
+    const element = await this.findElement(options);
+    return userEvent.clear(element);
   }
   locator(selector) {
     return new PreviewLocator(`${this._pwSelector} >> ${selector}`, this._container);