@vitest/browser 2.0.5 → 2.1.0-beta.2

package/dist/index.d.ts

@@ -105,7 +105,8 @@ declare class BrowserServer implements BrowserServer$1 {
     testerHtml: Promise<string> | string;
     orchestratorHtml: Promise<string> | string;
     injectorJs: Promise<string> | string;
-    errorCatcherPath: Promise<string> | string;
+    errorCatcherUrl: string;
+    locatorsUrl: string | undefined;
     stateJs: Promise<string> | string;
     state: BrowserServerState;
     provider: BrowserProvider;

package/dist/index.js

@@ -566,6 +566,10 @@ function setupBrowserRpc(server) {
     const rpc = createBirpc(
       {
         async onUnhandledError(error, type) {
+          if (error && typeof error === "object") {
+            const _error = error;
+            _error.stacks = server.parseErrorStacktrace(_error);
+          }
           ctx.state.catchError(error, type);
         },
         async onCollected(files) {
@@ -894,7 +898,12 @@ class BrowserServer {
       resolve(distRoot, "client/esm-client-injector.js"),
       "utf8"
     ).then((js) => this.injectorJs = js);
-    this.errorCatcherPath = resolve(distRoot, "client/error-catcher.js");
+    this.errorCatcherUrl = join("/@fs/", resolve(distRoot, "client/error-catcher.js"));
+    const builtinProviders = ["playwright", "webdriverio", "preview"];
+    const providerName = project.config.browser.provider || "preview";
+    if (builtinProviders.includes(providerName)) {
+      this.locatorsUrl = join("/@fs/", distRoot, "locators", `${providerName}.js`);
+    }
     this.stateJs = readFile$1(
       resolve(distRoot, "state.js"),
       "utf-8"
@@ -908,7 +917,8 @@ class BrowserServer {
   testerHtml;
   orchestratorHtml;
   injectorJs;
-  errorCatcherPath;
+  errorCatcherUrl;
+  locatorsUrl;
   stateJs;
   state;
   provider;
@@ -1025,7 +1035,7 @@ const click = async (context, selector, options = {}) => {
   const provider = context.provider;
   if (provider instanceof PlaywrightBrowserProvider) {
     const tester = context.iframe;
-    await tester.locator(`css=${selector}`).click({
+    await tester.locator(selector).click({
       timeout: 1e3,
       ...options
     });
@@ -1040,7 +1050,7 @@ const dblClick = async (context, selector, options = {}) => {
   const provider = context.provider;
   if (provider instanceof PlaywrightBrowserProvider) {
     const tester = context.iframe;
-    await tester.locator(`css=${selector}`).dblclick(options);
+    await tester.locator(selector).dblclick(options);
   } else if (provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
     await browser.$(selector).doubleClick();
@@ -1052,7 +1062,7 @@ const tripleClick = async (context, selector, options = {}) => {
   const provider = context.provider;
   if (provider instanceof PlaywrightBrowserProvider) {
     const tester = context.iframe;
-    await tester.locator(`css=${selector}`).click({
+    await tester.locator(selector).click({
       timeout: 1e3,
       ...options,
       clickCount: 3
@@ -1523,7 +1533,7 @@ const type = async (context, selector, text, options = {}) => {
   const unreleased = new Set(Reflect.get(options, "unreleased") ?? []);
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const { iframe } = context;
-    const element = iframe.locator(`css=${selector}`);
+    const element = iframe.locator(selector);
     if (!skipClick) {
       await element.focus();
     }
@@ -1565,7 +1575,7 @@ const type = async (context, selector, text, options = {}) => {
 const clear = async (context, selector) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const { iframe } = context;
-    const element = iframe.locator(`css=${selector}`);
+    const element = iframe.locator(selector);
     await element.clear({
       timeout: 1e3
     });
@@ -1581,7 +1591,7 @@ const clear = async (context, selector) => {
 const fill = async (context, selector, text, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const { iframe } = context;
-    const element = iframe.locator(`css=${selector}`);
+    const element = iframe.locator(selector);
     await element.fill(text, { timeout: 1e3, ...options });
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     const browser = context.browser;
@@ -1595,12 +1605,12 @@ const selectOptions = async (context, selector, userValues, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const value = userValues;
     const { iframe } = context;
-    const selectElement = iframe.locator(`css=${selector}`);
+    const selectElement = iframe.locator(selector);
     const values = await Promise.all(value.map(async (v) => {
       if (typeof v === "string") {
         return v;
       }
-      const elementHandler = await iframe.locator(`css=${v.element}`).elementHandle();
+      const elementHandler = await iframe.locator(v.element).elementHandle();
       if (!elementHandler) {
         throw new Error(`Element not found: ${v.element}`);
       }
@@ -1643,22 +1653,23 @@ const tab = async (context, options = {}) => {
   throw new Error(`Provider "${provider.name}" doesn't support tab command`);
 };
 
-const dragAndDrop = async (context, source, target, options) => {
+const dragAndDrop = async (context, source, target, options_) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
     const frame = await context.frame();
     await frame.dragAndDrop(
-      `css=${source}`,
-      `css=${target}`,
+      source,
+      target,
       {
         timeout: 1e3,
-        ...options
+        ...options_
       }
     );
   } else if (context.provider instanceof WebdriverBrowserProvider) {
     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();
+    const options = options_ || {};
+    const duration = options.duration ?? 10;
+    await context.browser.action("pointer").move({ duration: 0, origin: $source, x: options.sourceX ?? 0, y: options.sourceY ?? 0 }).down({ button: 0 }).move({ duration: 0, origin: "pointer", x: 0, y: 0 }).pause(duration).move({ duration: 0, origin: $target, x: options.targetX ?? 0, y: options.targetY ?? 0 }).move({ duration: 0, origin: "pointer", x: 1, y: 0 }).move({ duration: 0, origin: "pointer", x: -1, y: 0 }).up({ button: 0 }).perform();
   } else {
     throw new TypeError(`Provider "${context.provider.name}" does not support dragging elements`);
   }
@@ -1666,7 +1677,7 @@ const dragAndDrop = async (context, source, target, options) => {
 
 const hover = async (context, selector, options = {}) => {
   if (context.provider instanceof PlaywrightBrowserProvider) {
-    await context.iframe.locator(`css=${selector}`).hover({
+    await context.iframe.locator(selector).hover({
       timeout: 1e3,
       ...options
     });
@@ -1712,7 +1723,7 @@ const screenshot = async (context, name, options = {}) => {
   if (!context.testPath) {
     throw new Error(`Cannot take a screenshot without a test path`);
   }
-  const path = resolveScreenshotPath(
+  const path = options.path ? resolve(context.testPath, options.path) : resolveScreenshotPath(
     context.testPath,
     name,
     context.project.config
@@ -1721,8 +1732,8 @@ const screenshot = async (context, name, options = {}) => {
   await mkdir(dirname(path), { recursive: true });
   if (context.provider instanceof PlaywrightBrowserProvider) {
     if (options.element) {
-      const { element: css, ...config } = options;
-      const element = context.iframe.locator(`css=${css}`);
+      const { element: selector, ...config } = options;
+      const element = context.iframe.locator(`${selector}`);
       const buffer2 = await element.screenshot({
         timeout: 1e3,
         ...config,
@@ -1846,7 +1857,8 @@ export const server = {
   browser: ${JSON.stringify(server.project.config.browser.name)},
   commands: {
     ${commandsCode}
-  }
+  },
+  config: __vitest_browser_runner__.config,
 }
 export const commands = server.commands
 export const userEvent = ${getUserEvent(provider)}
@@ -1984,7 +1996,7 @@ async function resolveOrchestrator(server, url, res) {
     __VITEST_TITLE__: "Vitest Browser Runner",
     __VITEST_SCRIPTS__: server.orchestratorScripts,
     __VITEST_INJECTOR__: `<script type="module">${injector}<\/script>`,
-    __VITEST_ERROR_CATCHER__: `<script type="module" src="${server.errorCatcherPath}"><\/script>`,
+    __VITEST_ERROR_CATCHER__: `<script type="module" src="${server.errorCatcherUrl}"><\/script>`,
     __VITEST_CONTEXT_ID__: JSON.stringify(contextId)
   });
 }
@@ -2034,7 +2046,10 @@ async function resolveTester(server, url, res) {
     __VITEST_TITLE__: "Vitest Browser Tester",
     __VITEST_SCRIPTS__: server.testerScripts,
     __VITEST_INJECTOR__: `<script type="module">${injector}<\/script>`,
-    __VITEST_ERROR_CATCHER__: `<script type="module" src="${server.errorCatcherPath}"><\/script>`,
+    __VITEST_INTERNAL_SCRIPTS__: [
+      `<script type="module" src="${server.errorCatcherUrl}"><\/script>`,
+      server.locatorsUrl ? `<script type="module" src="${server.locatorsUrl}"><\/script>` : ""
+    ].join("\n"),
     __VITEST_APPEND__: `<script type="module">
 __vitest_browser_runner__.runningFiles = ${tests}
 __vitest_browser_runner__.iframeId = ${iframeId}

package/dist/locators/index.d.ts

@@ -0,0 +1,261 @@
+import { UserEventClickOptions, UserEventHoverOptions, UserEventFillOptions, UserEventDragAndDropOptions, LocatorScreenshotOptions, LocatorByRoleOptions, LocatorOptions } from '@vitest/browser/context';
+
+type ClauseCombinator = '' | '>' | '+' | '~' | '>=';
+type CSSFunctionArgument = CSSComplexSelector | number | string;
+interface CSSFunction {
+    name: string;
+    args: CSSFunctionArgument[];
+}
+interface CSSSimpleSelector {
+    css?: string;
+    functions: CSSFunction[];
+}
+interface CSSComplexSelector {
+    simples: {
+        selector: CSSSimpleSelector;
+        combinator: ClauseCombinator;
+    }[];
+}
+type CSSComplexSelectorList = CSSComplexSelector[];
+
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface NestedSelectorBody {
+    parsed: ParsedSelector;
+    distance?: number;
+}
+interface ParsedSelectorPart {
+    name: string;
+    body: string | CSSComplexSelectorList | NestedSelectorBody;
+    source: string;
+}
+interface ParsedSelector {
+    parts: ParsedSelectorPart[];
+    capture?: number;
+}
+
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface GenerateSelectorOptions {
+    testIdAttributeName: string;
+}
+
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface ElementText {
+    full: string;
+    normalized: string;
+    immediate: string[];
+}
+
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface QueryContext {
+    scope: Element | Document;
+    pierceShadow: boolean;
+    originalScope?: Element | Document;
+}
+type Selector = any;
+interface SelectorEvaluator {
+    query: (context: QueryContext, selector: Selector) => Element[];
+    matches: (element: Element, selector: Selector, context: QueryContext) => boolean;
+}
+interface SelectorEngine$1 {
+    matches?: (element: Element, args: (string | number | Selector)[], context: QueryContext, evaluator: SelectorEvaluator) => boolean;
+    query?: (context: QueryContext, args: (string | number | Selector)[], evaluator: SelectorEvaluator) => Element[];
+}
+declare class SelectorEvaluatorImpl implements SelectorEvaluator {
+    private _engines;
+    private _cacheQueryCSS;
+    private _cacheMatches;
+    private _cacheQuery;
+    private _cacheMatchesSimple;
+    private _cacheMatchesParents;
+    private _cacheCallMatches;
+    private _cacheCallQuery;
+    private _cacheQuerySimple;
+    _cacheText: Map<Element | ShadowRoot, ElementText>;
+    private _scoreMap;
+    private _retainCacheCounter;
+    constructor(extraEngines: Map<string, SelectorEngine$1>);
+    begin(): void;
+    end(): void;
+    private _cached;
+    private _checkSelector;
+    matches(element: Element, s: Selector, context: QueryContext): boolean;
+    query(context: QueryContext, s: any): Element[];
+    _markScore(element: Element, score: number): void;
+    private _hasScopeClause;
+    private _expandContextForScopeMatching;
+    private _matchesSimple;
+    private _querySimple;
+    private _matchesParents;
+    private _matchesEngine;
+    private _queryEngine;
+    private _callMatches;
+    private _callQuery;
+    private _matchesCSS;
+    _queryCSS(context: QueryContext, css: string): Element[];
+    private _getEngine;
+}
+
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface IvyaOptions {
+    testIdAttribute: string;
+    browser: 'webkit' | 'chromium' | 'firefox';
+}
+interface IvyaConfiguration {
+    testIdAttribute?: string;
+    browser: 'webkit' | 'chromium' | 'firefox';
+}
+declare class Ivya {
+    /** @internal */
+    _engines: Map<string, SelectorEngine>;
+    /** @internal */
+    _evaluator: SelectorEvaluatorImpl;
+    static options: IvyaOptions;
+    private static singleton;
+    static create(options: IvyaConfiguration): Ivya;
+    private constructor();
+    queryLocatorSelector(locator: string, root?: Node, strict?: boolean): Element | null;
+    queryLocatorSelectorAll(locator: string, root?: Node): Element[];
+    querySelector(selector: ParsedSelector, root: Node, strict?: boolean): Element | null;
+    private strictModeViolationError;
+    generateSelectorSimple(targetElement: Element, options?: GenerateSelectorOptions): string;
+    parseSelector(selector: string): ParsedSelector;
+    previewNode(node: Node): string;
+    querySelectorAll(selector: ParsedSelector, root: Node): Element[];
+    private _queryEngineAll;
+    private _queryNth;
+    private _queryLayoutSelector;
+    private createStacklessError;
+    private _createTextEngine;
+    private _createAttributeEngine;
+    private _createCSSEngine;
+    private _createNamedAttributeEngine;
+    private _createVisibleEngine;
+    private _createHasEngine;
+    private _createHasNotEngine;
+    private _createInternalChainEngine;
+    private _createInternalLabelEngine;
+    private _createInternalHasTextEngine;
+    private _createInternalHasNotTextEngine;
+}
+type SelectorRoot = Element | ShadowRoot | Document;
+interface SelectorEngine {
+    queryAll: (root: SelectorRoot, selector: string | any) => Element[];
+}
+
+declare const selectorEngine: Ivya;
+declare abstract class Locator {
+    abstract selector: string;
+    private _parsedSelector;
+    protected _pwSelector?: string | undefined;
+    protected _forceElement?: Element | undefined;
+    click(options?: UserEventClickOptions): Promise<void>;
+    dblClick(options?: UserEventClickOptions): Promise<void>;
+    tripleClick(options?: UserEventClickOptions): Promise<void>;
+    clear(): Promise<void>;
+    hover(options: UserEventHoverOptions): Promise<void>;
+    unhover(options: UserEventHoverOptions): Promise<void>;
+    fill(text: string, options?: UserEventFillOptions): Promise<void>;
+    dropTo(target: Locator, options?: UserEventDragAndDropOptions): Promise<void>;
+    selectOptions(value: HTMLElement | HTMLElement[] | Locator | Locator[] | string | string[]): Promise<void>;
+    screenshot(options: Omit<LocatorScreenshotOptions, 'base64'> & {
+        base64: true;
+    }): Promise<{
+        path: string;
+        base64: string;
+    }>;
+    screenshot(options?: LocatorScreenshotOptions): Promise<string>;
+    protected abstract locator(selector: string): Locator;
+    protected abstract elementLocator(element: Element): Locator;
+    getByRole(role: string, options?: LocatorByRoleOptions): Locator;
+    getByAltText(text: string | RegExp, options?: LocatorOptions): Locator;
+    getByLabelText(text: string | RegExp, options?: LocatorOptions): Locator;
+    getByPlaceholder(text: string | RegExp, options?: LocatorOptions): Locator;
+    getByTestId(testId: string | RegExp): Locator;
+    getByText(text: string | RegExp, options?: LocatorOptions): Locator;
+    getByTitle(title: string | RegExp, options?: LocatorOptions): Locator;
+    query(): Element | null;
+    element(): Element;
+    elements(): Element[];
+    all(): Locator[];
+    private get state();
+    private get worker();
+    private get rpc();
+    protected triggerCommand<T>(command: string, ...args: any[]): Promise<T>;
+}
+
+export { Locator, selectorEngine };

package/dist/locators/index.js

@@ -0,0 +1,2 @@
+import '@vitest/browser/context';
+export { L as Locator, s as selectorEngine } from '../index-DX16doXA.js';

package/dist/locators/playwright.js

@@ -0,0 +1,42 @@
+import { page, server } from '@vitest/browser/context';
+import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator } from '../index-DX16doXA.js';
+
+page.extend({
+  getByLabelText(text, options) {
+    return new PlaywrightLocator(getByLabelSelector(text, options));
+  },
+  getByRole(role, options) {
+    return new PlaywrightLocator(getByRoleSelector(role, options));
+  },
+  getByTestId(testId) {
+    return new PlaywrightLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute, testId));
+  },
+  getByAltText(text, options) {
+    return new PlaywrightLocator(getByAltTextSelector(text, options));
+  },
+  getByPlaceholder(text, options) {
+    return new PlaywrightLocator(getByPlaceholderSelector(text, options));
+  },
+  getByText(text, options) {
+    return new PlaywrightLocator(getByTextSelector(text, options));
+  },
+  getByTitle(title, options) {
+    return new PlaywrightLocator(getByTitleSelector(title, options));
+  },
+  elementLocator(element) {
+    return new PlaywrightLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+});
+class PlaywrightLocator extends Locator {
+  constructor(selector, _forceElement) {
+    super();
+    this.selector = selector;
+    this._forceElement = _forceElement;
+  }
+  locator(selector) {
+    return new PlaywrightLocator(`${this.selector} >> ${selector}`);
+  }
+  elementLocator(element) {
+    return new PlaywrightLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+}

package/dist/locators/preview.js

@@ -0,0 +1,86 @@
+import { page, server } from '@vitest/browser/context';
+import { userEvent } from '@testing-library/user-event';
+import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator, h as convertElementToCssSelector } from '../index-DX16doXA.js';
+
+page.extend({
+  getByLabelText(text, options) {
+    return new PreviewLocator(getByLabelSelector(text, options));
+  },
+  getByRole(role, options) {
+    return new PreviewLocator(getByRoleSelector(role, options));
+  },
+  getByTestId(testId) {
+    return new PreviewLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute, testId));
+  },
+  getByAltText(text, options) {
+    return new PreviewLocator(getByAltTextSelector(text, options));
+  },
+  getByPlaceholder(text, options) {
+    return new PreviewLocator(getByPlaceholderSelector(text, options));
+  },
+  getByText(text, options) {
+    return new PreviewLocator(getByTextSelector(text, options));
+  },
+  getByTitle(title, options) {
+    return new PreviewLocator(getByTitleSelector(title, options));
+  },
+  elementLocator(element) {
+    return new PreviewLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+});
+class PreviewLocator extends Locator {
+  constructor(_pwSelector, _forceElement) {
+    super();
+    this._pwSelector = _pwSelector;
+    this._forceElement = _forceElement;
+  }
+  get selector() {
+    const selectors = this.elements().map((element) => convertElementToCssSelector(element));
+    if (!selectors.length) {
+      throw new Error(`element not found: ${this._pwSelector}`);
+    }
+    return selectors.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());
+  }
+  fill(text) {
+    return userEvent.type(this.element(), text);
+  }
+  selectOptions(options_) {
+    const options = (Array.isArray(options_) ? options_ : [options_]).map((option) => {
+      if (typeof option !== "string" && "element" in option) {
+        return option.element();
+      }
+      return option;
+    });
+    return userEvent.selectOptions(this.element(), options);
+  }
+  async dropTo() {
+    throw new Error('The "preview" provider doesn\'t support `dropTo` method.');
+  }
+  clear() {
+    return userEvent.clear(this.element());
+  }
+  async screenshot() {
+    throw new Error('The "preview" provider doesn\'t support `screenshot` method.');
+  }
+  locator(selector) {
+    return new PreviewLocator(`${this._pwSelector} >> ${selector}`);
+  }
+  elementLocator(element) {
+    return new PreviewLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+}

package/dist/locators/webdriverio.js

@@ -0,0 +1,83 @@
+import { page, server } from '@vitest/browser/context';
+import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator, h as convertElementToCssSelector } from '../index-DX16doXA.js';
+
+page.extend({
+  getByLabelText(text, options) {
+    return new WebdriverIOLocator(getByLabelSelector(text, options));
+  },
+  getByRole(role, options) {
+    return new WebdriverIOLocator(getByRoleSelector(role, options));
+  },
+  getByTestId(testId) {
+    return new WebdriverIOLocator(getByTestIdSelector(server.config.browser.locators.testIdAttribute, testId));
+  },
+  getByAltText(text, options) {
+    return new WebdriverIOLocator(getByAltTextSelector(text, options));
+  },
+  getByPlaceholder(text, options) {
+    return new WebdriverIOLocator(getByPlaceholderSelector(text, options));
+  },
+  getByText(text, options) {
+    return new WebdriverIOLocator(getByTextSelector(text, options));
+  },
+  getByTitle(title, options) {
+    return new WebdriverIOLocator(getByTitleSelector(title, options));
+  },
+  elementLocator(element) {
+    return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+});
+class WebdriverIOLocator extends Locator {
+  constructor(_pwSelector, _forceElement) {
+    super();
+    this._pwSelector = _pwSelector;
+    this._forceElement = _forceElement;
+  }
+  get selector() {
+    const selectors = this.elements().map((element) => convertElementToCssSelector(element));
+    if (!selectors.length) {
+      throw new Error(`element not found: ${this._pwSelector}`);
+    }
+    return selectors.join(", ");
+  }
+  selectOptions(value) {
+    const values = getWebdriverioSelectOptions(this.element(), value);
+    return this.triggerCommand("__vitest_selectOptions", this.selector, values);
+  }
+  locator(selector) {
+    return new WebdriverIOLocator(`${this._pwSelector} >> ${selector}`);
+  }
+  elementLocator(element) {
+    return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(element), element);
+  }
+}
+function getWebdriverioSelectOptions(element, value) {
+  const options = [...element.querySelectorAll("option")];
+  const arrayValues = Array.isArray(value) ? value : [value];
+  if (!arrayValues.length) {
+    return [];
+  }
+  if (arrayValues.length > 1) {
+    throw new Error(`Provider "webdriverio" doesn't support selecting multiple values at once`);
+  }
+  const optionValue = arrayValues[0];
+  if (typeof optionValue !== "string") {
+    const element2 = "element" in optionValue ? optionValue.element() : optionValue;
+    const index = options.indexOf(element2);
+    if (index === -1) {
+      throw new Error(`The element ${selectorEngine.previewNode(element2)} was not found in the "select" options.`);
+    }
+    return [{ index }];
+  }
+  const valueIndex = options.findIndex((option) => option.value === optionValue);
+  if (valueIndex !== -1) {
+    return [{ index: valueIndex }];
+  }
+  const labelIndex = options.findIndex(
+    (option) => option.textContent?.trim() === optionValue || option.ariaLabel === optionValue
+  );
+  if (labelIndex === -1) {
+    throw new Error(`The option "${optionValue}" was not found in the "select" options.`);
+  }
+  return [{ index: labelIndex }];
+}