@wdio/browser-runner 8.3.10 → 8.4.0

package/README.md

@@ -1,9 +1,9 @@
 WebdriverIO Browser Runner
 ==========================
 
-> A WebdriverIO runner to run unit and component tests within the browser
+> A WebdriverIO runner to run unit and component tests within the browser.
 
-As opposed to the [Local Runner]((https://www.npmjs.com/package/@wdio/local-runner)) the [Browser Runner]((https://www.npmjs.com/package/@wdio/browser-runner)) initiates and executes the framework within the browser. This allows you to run unit tests or component tests in an actual browser rather than in a JSDOM like many other test frameworks.
+As opposed to the [Local Runner](https://www.npmjs.com/package/@wdio/local-runner) the [Browser Runner](https://www.npmjs.com/package/@wdio/browser-runner) initiates and executes the framework within the browser. This allows you to run unit tests or component tests in an actual browser rather than in a JSDOM like many other test frameworks.
 
 While [JSDOM](https://www.npmjs.com/package/jsdom) is widely used for testing purposes, it is in the end not an actual browser nor can you emulate mobile environments with it. With this runner WebdriverIO enables you to easily run your tests in the browser and use WebDriver commands to interact with elements rendered on the page.
 
@@ -14,8 +14,9 @@ Here is an overview of running tests within JSDOM vs. WebdriverIOs Browser Runne
 |1.| Runs your tests within Node.js using a re-implementation of web standards, notably the WHATWG DOM and HTML Standards | Executes your test in an actual browser and runs the code in an environment that your users use |
 |2.| Interactions with components can only be imitated via JavaScript | You can use the [WebdriverIO API](api) to interact with elements through the WebDriver protocol |
 |3.| Canvas support requires [additional dependencies](https://www.npmjs.com/package/canvas) and [has limitations](https://github.com/Automattic/node-canvas/issues) | You have access to the real [Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) |
-|4.| JSDOM has some [caveats](https://www.npmjs.com/package/jsdom#user-content-caveats) and unsupported Web APIs | All Web APIs are supported as test run in an actual browser |
+|4.| JSDOM has some [caveats](https://github.com/jsdom/jsdom#caveats) and unsupported Web APIs | All Web APIs are supported as test run in an actual browser |
 |5.| Impossible to detect errors cross browser | Support for all browsers including mobile browser |
+|6.| Can __not__ test for element pseudo states | Support for pseudo states such as `:hover` or `:active` |
 
 This runner uses [Vite](https://vitejs.dev/) to compile your test code and load it in the browser. It comes with presets for the following component frameworks:
 
@@ -23,6 +24,7 @@ This runner uses [Vite](https://vitejs.dev/) to compile your test code and load
 - Preact
 - Vue.js
 - Svelte
+- SolidJS
 
 Every test file / test file group runs within a single page which means that between each test the page is being reloaded to guarantee isolation between tests.
 
@@ -47,19 +49,172 @@ export const {
 }
 ```
 
-If you test components using one of the mentioned frameworks above, you can define a preset that ensures everything is configured out of the box, e.g. when you want to import and test Svelte components, define the Browser Runner as follows:
+### Runner Options
 
-```js
-// wdio.conf.js
+The Browser runner allows following configurations:
+
+#### `preset`
+
+If you test components using one of the mentioned frameworks above, you can define a preset that ensures everything is configured out of the box. This option can't be used together with `viteConfig`.
+
+__Type:__ `vue` | `svelte` | `solid` | `react` | `preact`<br />
+__Example:__
+
+```js title="wdio.conf.js"
 export const {
     // ...
     runner: ['browser', {
-        preset: 'Svelte'
+        preset: 'svelte'
     }],
     // ...
 }
 ```
 
+#### `viteConfig`
+
+Define your own [Vite configuration](https://vitejs.dev/config/). You can either pass in a custom object or import an existing `vite.conf.ts` file if you use Vite.js for development. Note that WebdriverIO merges custom configurations to set up framework and runner objects. This option can't be used together with `preset`.
+
+__Type:__ [`UserConfig`](https://github.com/vitejs/vite/blob/52e64eb43287d241f3fd547c332e16bd9e301e95/packages/vite/src/node/config.ts#L119-L272)<br />
+__Example:__
+
+```js title="wdio.conf.ts"
+import viteConfig from '../vite.config.ts'
+
+export const {
+    // ...
+    runner: ['browser', { viteConfig }],
+    // ...
+}
+```
+
+#### `headless`
+
+If set to `true` the runner will update capabilities to run tests headless. By default this is enabled within CI environments where a `CI` environment variable is set to `'1'` or `'true'`.
+
+__Type:__ `boolean`<br />
+__Default:__ `false`, set to `true` if `CI` environment variable is set
+
+#### `rootDir`
+
+Project root directory.
+
+__Type:__ `string`<br />
+__Default:__ `process.cwd()`
+
+#### `coverage`
+
+WebdriverIO supports test coverage reporting through [`istanbul`](https://istanbul.js.org/). See [Coverage Options](#coverage-options) for more details.
+
+__Type:__ `object`<br />
+__Default:__ `undefined`
+
+### Coverage Options
+
+The following options allow to configure coverage reporting.
+
+#### `enabled`
+
+Enables coverage collection.
+
+__Type:__ `boolean`<br />
+__Default:__ `false`
+
+#### `include`
+
+List of files included in coverage as glob patterns.
+
+__Type:__ `string[]`<br />
+__Default:__ `[**]`
+
+#### `exclude`
+
+List of files excluded in coverage as glob patterns.
+
+__Type:__ `string[]`<br />
+__Default:__
+
+```
+[
+  'coverage/**',
+  'dist/**',
+  'packages/*/test{,s}/**',
+  '**/*.d.ts',
+  'cypress/**',
+  'test{,s}/**',
+  'test{,-*}.{js,cjs,mjs,ts,tsx,jsx}',
+  '**/*{.,-}test.{js,cjs,mjs,ts,tsx,jsx}',
+  '**/*{.,-}spec.{js,cjs,mjs,ts,tsx,jsx}',
+  '**/__tests__/**',
+  '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*',
+  '**/.{eslint,mocha,prettier}rc.{js,cjs,yml}',
+]
+```
+
+#### `extension`
+
+List of file extensions the report should include.
+
+__Type:__ `string | string[]`<br />
+__Default:__ `['.js', '.cjs', '.mjs', '.ts', '.mts', '.cts', '.tsx', '.jsx', '.vue', '.svelte']`
+
+#### `reportsDirectory`
+
+Directory to write coverage report to.
+
+__Type:__ `string`<br />
+__Default:__ `./coverage`
+
+#### `reporter`
+
+Coverage reporters to use. See [istanbul documentation](https://istanbul.js.org/docs/advanced/alternative-reporters/) for detailed list of all reporters.
+
+__Type:__ `string[]`<br />
+__Default:__ `['text', 'html', 'clover', 'json-summary']`
+
+#### `perFile`
+
+Check thresholds per file. See `lines`, `functions`, `branches` and `statements` for the actual thresholds.
+
+__Type:__ `boolean`<br />
+__Default:__ `false`
+
+#### `clean`
+
+Clean coverage results before running tests.
+
+__Type:__ `boolean`<br />
+__Default:__ `true`
+
+#### `lines`
+
+Threshold for lines.
+
+__Type:__ `number`<br />
+__Default:__ `undefined`
+
+#### `functions`
+
+Threshold for functions.
+
+__Type:__ `number`<br />
+__Default:__ `undefined`
+
+#### `branches`
+
+Threshold for branches.
+
+__Type:__ `number`<br />
+__Default:__ `undefined`
+
+#### `statements`
+
+Threshold for statements.
+
+__Type:__ `number`<br />
+__Default:__ `undefined`
+
+### Examples
+
 Make sure to check out the docs around [component testing](https://webdriver.io/docs/component-testing) and have a look into the [example repository](https://github.com/webdriverio/component-testing-examples) for examples using these and various other frameworks.
 
 ---

package/build/browser/frameworks/mocha.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mocha.d.ts","sourceRoot":"","sources":["../../../src/browser/frameworks/mocha.ts"],"names":[],"mappings":"AAUA,qBAAa,cAAc;;gBAKV,MAAM,EAAE,SAAS;IA+B9B,GAAG;CA+DN"}
+{"version":3,"file":"mocha.d.ts","sourceRoot":"","sources":["../../../src/browser/frameworks/mocha.ts"],"names":[],"mappings":"AASA,qBAAa,cAAc;;gBAKV,MAAM,EAAE,SAAS;IA+B9B,GAAG;CA+DN"}

package/build/browser/frameworks/mocha.js

@@ -1,4 +1,3 @@
-import Mocha from 'mocha';
 import stringify from 'fast-safe-stringify';
 import { setupEnv, formatMessage } from '@wdio/mocha-framework/common';
 import { MESSAGE_TYPES, EVENTS } from '../../constants.js';
@@ -95,7 +94,7 @@ const BaseReporter = window.Mocha.reporters.html;
 class HTMLReporter extends BaseReporter {
     addCodeToggle() { }
 }
-Mocha.setup({
+mocha.setup({
     ...window.__wdioEnv__.args,
     reporter: HTMLReporter
 });

package/build/browser/setup.d.ts

@@ -7,6 +7,7 @@ declare global {
         __wdioEvents__: any[];
         __wdioSocket__: WebSocket;
         __wdioConnectPromise__: Promise<WebSocket>;
+        __wdioMockFactories__: Record<string, any>;
     }
 }
 export declare const socket: WebSocket;

package/build/browser/setup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/browser/setup.ts"],"names":[],"mappings":"AAQA,KAAK,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,SAAS,CAAC,CAAA;AAC9D,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,cAAc,EAAE,cAAc,EAAE,CAAA;QAChC,YAAY,EAAE,MAAM,CAAA;QACpB,gBAAgB,EAAE,MAAM,CAAA;QACxB,cAAc,EAAE,GAAG,EAAE,CAAA;QACrB,cAAc,EAAE,SAAS,CAAA;QACzB,sBAAsB,EAAE,OAAO,CAAC,SAAS,CAAC,CAAA;KAC7C;CACJ;AAOD,eAAO,MAAM,MAAM,WAA+C,CAAA;AAClE,eAAO,MAAM,cAAc,oBAGzB,CAAA"}
+{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/browser/setup.ts"],"names":[],"mappings":"AAQA,KAAK,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,SAAS,CAAC,CAAA;AAC9D,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,cAAc,EAAE,cAAc,EAAE,CAAA;QAChC,YAAY,EAAE,MAAM,CAAA;QACpB,gBAAgB,EAAE,MAAM,CAAA;QACxB,cAAc,EAAE,GAAG,EAAE,CAAA;QACrB,cAAc,EAAE,SAAS,CAAA;QACzB,sBAAsB,EAAE,OAAO,CAAC,SAAS,CAAC,CAAA;QAC1C,qBAAqB,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;KAC7C;CACJ;AAOD,eAAO,MAAM,MAAM,WAA+C,CAAA;AAClE,eAAO,MAAM,cAAc,oBAGzB,CAAA"}

package/build/browser/spy.d.ts

@@ -2,4 +2,7 @@
  * re-export mock module
  */
 export * from '@vitest/spy';
+type MockFactoryWithHelper = (importOriginal: <T = unknown>() => Promise<T>) => any;
+export declare function mock(path: string, factory?: MockFactoryWithHelper): Promise<unknown>;
+export declare function unmock(moduleName: string): void;
 //# sourceMappingURL=spy.d.ts.map

package/build/browser/spy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spy.d.ts","sourceRoot":"","sources":["../../src/browser/spy.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,aAAa,CAAA"}
+{"version":3,"file":"spy.d.ts","sourceRoot":"","sources":["../../src/browser/spy.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,cAAc,aAAa,CAAA;AAE3B,KAAK,qBAAqB,GAAG,CAAC,cAAc,EAAE,CAAC,CAAC,GAAG,OAAO,OAAO,OAAO,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC;AAapF,wBAAsB,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,qBAAqB,oBA4BxE;AAGD,wBAAgB,MAAM,CAAC,UAAU,EAAE,MAAM,QAExC"}

package/build/browser/spy.js

@@ -1,4 +1,57 @@
+import { MESSAGE_TYPES } from '../constants.js';
 /**
  * re-export mock module
  */
 export * from '@vitest/spy';
+const a = document.createElement('a');
+function resolveUrl(path) {
+    a.href = path;
+    return a.href;
+}
+const ERROR_MESSAGE = '[wdio] There was an error, when mocking a module. If you are using the "mock" factory, make sure there are no top level variables inside, since this call is hoisted to top of the file. Read more: https://webdriver.io/docs/component-testing/mocking';
+const socket = window.__wdioSocket__;
+const mockResolver = new Map();
+const origin = window.__wdioSpec__.split('/').slice(0, -1).join('/');
+window.__wdioMockFactories__ = [];
+export async function mock(path, factory) {
+    /**
+     * mock calls without factory parameter should get removed from the source code
+     * by the mock hoisting plugin
+     */
+    if (!factory) {
+        return;
+    }
+    const mockLocalFile = path.startsWith('/') || path.startsWith('./');
+    const mockPath = mockLocalFile
+        ? (new URL(resolveUrl(window.__wdioSpec__.split('/').slice(0, -1).join('/') + '/' + path))).pathname
+        : path;
+    try {
+        const resolvedMock = await factory(() => (import(mockLocalFile ? `/@mock${mockPath}` : `/node_modules/.vite/deps/${mockPath}.js`)));
+        socket.send(JSON.stringify({
+            type: MESSAGE_TYPES.mockRequest,
+            value: { path: mockPath, origin, namedExports: Object.keys(resolvedMock) }
+        }));
+        window.__wdioMockFactories__[mockPath] = resolvedMock;
+        return new Promise((resolve) => mockResolver.set(mockPath, resolve));
+    }
+    catch (err) {
+        throw new Error(ERROR_MESSAGE + '\n' + err.stack);
+    }
+}
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function unmock(moduleName) {
+    // NO-OP: call gets removed by recast
+}
+socket.addEventListener('message', (ev) => {
+    try {
+        const { type, value } = JSON.parse(ev.data);
+        const resolver = mockResolver.get(value.path);
+        if (type !== MESSAGE_TYPES.mockResponse || !resolver) {
+            return;
+        }
+        return resolver(null);
+    }
+    catch {
+        // ignore
+    }
+});

package/build/constants.d.ts

@@ -20,11 +20,15 @@ export declare enum MESSAGE_TYPES {
     commandRequestMessage = 1,
     commandResponseMessage = 2,
     hookTriggerMessage = 3,
-    hookResultMessage = 4
+    hookResultMessage = 4,
+    mockRequest = 5,
+    mockResponse = 6
 }
 export declare const DEFAULT_INCLUDE: string[];
 export declare const DEFAULT_FILE_EXTENSIONS: string[];
 export declare const DEFAULT_REPORTS_DIRECTORY = "coverage";
+export declare const DEFAULT_AUTOMOCK = true;
+export declare const DEFAULT_MOCK_DIRECTORY = "__mocks__";
 export declare const SUMMARY_REPORTER = "json-summary";
 export declare const COVERAGE_FACTORS: readonly ["lines", "functions", "branches", "statements"];
 export declare const DEFAULT_COVERAGE_REPORTS: (keyof ReportOptions)[];

package/build/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAC7C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAErD,eAAO,MAAM,QAAQ,0BAAiC,CAAA;AACtD,eAAO,MAAM,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,WAAW,CAAC,OAAO,CAAa,CAAA;AAEvE,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,eAAO,MAAM,uBAAuB,wFAAsF,CAAA;AAE1H,oBAAY,aAAa;IACrB,cAAc,IAAI;IAClB,qBAAqB,IAAA;IACrB,sBAAsB,IAAA;IACtB,kBAAkB,IAAA;IAClB,iBAAiB,IAAA;CACpB;AAED,eAAO,MAAM,eAAe,UAAS,CAAA;AACrC,eAAO,MAAM,uBAAuB,UAAoF,CAAA;AACxH,eAAO,MAAM,yBAAyB,aAAa,CAAA;AACnD,eAAO,MAAM,gBAAgB,iBAAiB,CAAA;AAC9C,eAAO,MAAM,gBAAgB,2DAA4D,CAAA;AACzF,eAAO,MAAM,wBAAwB,EAAE,CAAC,MAAM,aAAa,CAAC,EAAiD,CAAA;AAC7G,eAAO,MAAM,yBAAyB,sEAAsE,CAAA;AAC5G,eAAO,MAAM,uBAAuB,sEAAsE,CAAA"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAC7C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAErD,eAAO,MAAM,QAAQ,0BAAiC,CAAA;AACtD,eAAO,MAAM,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,WAAW,CAAC,OAAO,CAAa,CAAA;AAEvE,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,eAAO,MAAM,uBAAuB,wFAAsF,CAAA;AAE1H,oBAAY,aAAa;IACrB,cAAc,IAAI;IAClB,qBAAqB,IAAA;IACrB,sBAAsB,IAAA;IACtB,kBAAkB,IAAA;IAClB,iBAAiB,IAAA;IACjB,WAAW,IAAA;IACX,YAAY,IAAA;CACf;AAED,eAAO,MAAM,eAAe,UAAS,CAAA;AACrC,eAAO,MAAM,uBAAuB,UAAoF,CAAA;AACxH,eAAO,MAAM,yBAAyB,aAAa,CAAA;AACnD,eAAO,MAAM,gBAAgB,OAAO,CAAA;AACpC,eAAO,MAAM,sBAAsB,cAAc,CAAA;AACjD,eAAO,MAAM,gBAAgB,iBAAiB,CAAA;AAC9C,eAAO,MAAM,gBAAgB,2DAA4D,CAAA;AACzF,eAAO,MAAM,wBAAwB,EAAE,CAAC,MAAM,aAAa,CAAC,EAAiD,CAAA;AAC7G,eAAO,MAAM,yBAAyB,sEAAsE,CAAA;AAC5G,eAAO,MAAM,uBAAuB,sEAAsE,CAAA"}

package/build/constants.js

@@ -20,10 +20,14 @@ export var MESSAGE_TYPES;
     MESSAGE_TYPES[MESSAGE_TYPES["commandResponseMessage"] = 2] = "commandResponseMessage";
     MESSAGE_TYPES[MESSAGE_TYPES["hookTriggerMessage"] = 3] = "hookTriggerMessage";
     MESSAGE_TYPES[MESSAGE_TYPES["hookResultMessage"] = 4] = "hookResultMessage";
+    MESSAGE_TYPES[MESSAGE_TYPES["mockRequest"] = 5] = "mockRequest";
+    MESSAGE_TYPES[MESSAGE_TYPES["mockResponse"] = 6] = "mockResponse";
 })(MESSAGE_TYPES || (MESSAGE_TYPES = {}));
 export const DEFAULT_INCLUDE = ['**'];
 export const DEFAULT_FILE_EXTENSIONS = ['.js', '.cjs', '.mjs', '.ts', '.mts', '.cts', '.tsx', '.jsx', '.vue', '.svelte'];
 export const DEFAULT_REPORTS_DIRECTORY = 'coverage';
+export const DEFAULT_AUTOMOCK = true;
+export const DEFAULT_MOCK_DIRECTORY = '__mocks__';
 export const SUMMARY_REPORTER = 'json-summary';
 export const COVERAGE_FACTORS = ['lines', 'functions', 'branches', 'statements'];
 export const DEFAULT_COVERAGE_REPORTS = ['text', 'html', 'clover', SUMMARY_REPORTER];

package/build/types.d.ts

@@ -92,6 +92,16 @@ export interface BrowserRunnerOptions {
      * test coverage settings
      */
     coverage?: CoverageOptions;
+    /**
+     * If set to `true` WebdriverIO will automatically mock dependencies within the `automockDir` directory
+     * @default true
+     */
+    automock?: boolean;
+    /**
+     * Path of auto-mock directory. This tells WebdriverIO where to look for dependencies to mock out.
+     * @default ./__mocks__
+     */
+    automockDir?: string;
 }
 export interface RunArgs extends Workers.WorkerRunPayload {
     command: string;

package/build/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,MAAM,CAAA;AACxC,OAAO,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACtD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAA;AAEjE,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,WAAW,EAAE,WAAW,CAAA;QACxB,iBAAiB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;KAC9C;CACJ;AAED,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAA;AACrF,KAAK,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;AAChC,KAAK,gBAAgB,GAAG,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,WAAW,GAAG,cAAc,GAAG,MAAM,CAAA;AAClL,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,WAAW,GAAG,sBAAsB,CAAC;IAClH;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACtC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,oBAAoB;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAA;CAC7B;AAED,MAAM,WAAW,OAAQ,SAAQ,OAAO,CAAC,gBAAgB;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,GAAG,CAAA;IACT,GAAG,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,WAAW;IACxB,IAAI,EAAE,SAAS,CAAA;IACf,MAAM,EAAE,OAAO,CAAC,UAAU,CAAA;IAC1B,YAAY,EAAE,YAAY,CAAC,gBAAgB,CAAA;IAC3C,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,OAAO,CAAA;CACzB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,MAAM,CAAA;AACxC,OAAO,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACtD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAA;AAEjE,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,WAAW,EAAE,WAAW,CAAA;QACxB,iBAAiB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;KAC9C;CACJ;AAED,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAA;AACrF,KAAK,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;AAChC,KAAK,gBAAgB,GAAG,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,WAAW,GAAG,cAAc,GAAG,MAAM,CAAA;AAClL,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,WAAW,GAAG,sBAAsB,CAAC;IAClH;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACtC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,oBAAoB;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAA;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;CACvB;AAED,MAAM,WAAW,OAAQ,SAAQ,OAAO,CAAC,gBAAgB;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,GAAG,CAAA;IACT,GAAG,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,WAAW;IACxB,IAAI,EAAE,SAAS,CAAA;IACf,MAAM,EAAE,OAAO,CAAC,UAAU,CAAA;IAC1B,YAAY,EAAE,YAAY,CAAC,gBAAgB,CAAA;IAC3C,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,OAAO,CAAA;CACzB"}

package/build/vite/mock.d.ts

@@ -0,0 +1,16 @@
+import type { Options } from '@wdio/types';
+import type { MockRequestEvent } from './types';
+export declare class MockHandler {
+    #private;
+    manualMocks: string[];
+    constructor(options: WebdriverIO.BrowserRunnerOptions, config: Options.Testrunner);
+    get mocks(): Map<string, MockRequestEvent>;
+    addMock(mock: MockRequestEvent): void;
+    unmock(moduleName: string): void;
+    resolveId(id: string): Promise<string | undefined>;
+    /**
+     * reset manual mocks between tests
+     */
+    resetMocks(): void;
+}
+//# sourceMappingURL=mock.d.ts.map

package/build/vite/mock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mock.d.ts","sourceRoot":"","sources":["../../src/vite/mock.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAI1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI/C,qBAAa,WAAW;;IAOpB,WAAW,EAAE,MAAM,EAAE,CAAK;gBAEb,OAAO,EAAE,WAAW,CAAC,oBAAoB,EAAE,MAAM,EAAE,OAAO,CAAC,UAAU;IAMlF,IAAI,KAAK,kCAER;IAED,OAAO,CAAE,IAAI,EAAE,gBAAgB;IAI/B,MAAM,CAAE,UAAU,EAAE,MAAM;IAIpB,SAAS,CAAE,EAAE,EAAE,MAAM;IAwB3B;;OAEG;IACH,UAAU;CAIb"}

package/build/vite/mock.js

@@ -0,0 +1,53 @@
+import path from 'node:path';
+import { getManualMocks } from './utils.js';
+import { DEFAULT_MOCK_DIRECTORY, DEFAULT_AUTOMOCK } from '../constants.js';
+const FIXTURE_PREFIX = '/@fixture/';
+export class MockHandler {
+    #automock;
+    #automockDir;
+    #manualMocksList;
+    #mocks = new Map();
+    #unmocked = [];
+    manualMocks = [];
+    constructor(options, config) {
+        this.#automock = typeof options.automock === 'boolean' ? options.automock : DEFAULT_AUTOMOCK;
+        this.#automockDir = path.resolve(config.rootDir, options.automockDir || DEFAULT_MOCK_DIRECTORY);
+        this.#manualMocksList = getManualMocks(this.#automockDir);
+    }
+    get mocks() {
+        return this.#mocks;
+    }
+    addMock(mock) {
+        this.#mocks.set(mock.path, mock);
+    }
+    unmock(moduleName) {
+        this.#unmocked.push(moduleName);
+    }
+    async resolveId(id) {
+        const manualMocksList = await this.#manualMocksList;
+        const mockPath = manualMocksList.find((m) => (
+        // e.g. someModule
+        id === m[1].replace(path.sep, '/') ||
+            // e.g. @some/module
+            id.slice(1) === m[1].replace(path.sep, '/')));
+        /**
+         * return manual mock if `automock` is enabled or a manual mock was set via `mock('module')`
+         */
+        if ((this.manualMocks.includes(id) || this.#automock) && mockPath && !this.#unmocked.includes(id)) {
+            return mockPath[0];
+        }
+        /**
+         * return fixture
+         */
+        if (id.startsWith(FIXTURE_PREFIX)) {
+            return path.resolve(this.#automockDir, id.slice(FIXTURE_PREFIX.length));
+        }
+    }
+    /**
+     * reset manual mocks between tests
+     */
+    resetMocks() {
+        this.manualMocks = [];
+        this.#unmocked = [];
+    }
+}

package/build/vite/plugins/mockHoisting.d.ts

@@ -0,0 +1,4 @@
+import type { Plugin } from 'vite';
+import type { MockHandler } from '../mock.js';
+export declare function mockHoisting(mockHandler: MockHandler): Plugin[];
+//# sourceMappingURL=mockHoisting.d.ts.map

package/build/vite/plugins/mockHoisting.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mockHoisting.d.ts","sourceRoot":"","sources":["../../../src/vite/plugins/mockHoisting.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAElC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAM7C,wBAAgB,YAAY,CAAC,WAAW,EAAE,WAAW,GAAG,MAAM,EAAE,CAwM/D"}

package/build/vite/plugins/mockHoisting.js

@@ -0,0 +1,192 @@
+import os from 'node:os';
+import url from 'node:url';
+import path from 'node:path';
+import fs from 'node:fs/promises';
+import logger from '@wdio/logger';
+import { parse, print, visit, types } from 'recast';
+import typescriptParser from 'recast/parsers/typescript.js';
+const log = logger('@wdio/browser-runner:mockHoisting');
+const b = types.builders;
+const MOCK_PREFIX = '/@mock';
+export function mockHoisting(mockHandler) {
+    let spec = null;
+    return [{
+            name: 'wdio:mockHoisting:pre',
+            enforce: 'pre',
+            resolveId: mockHandler.resolveId.bind(mockHandler),
+            load: async function (id) {
+                if (id.startsWith(MOCK_PREFIX)) {
+                    try {
+                        const orig = await fs.readFile(id.slice(MOCK_PREFIX.length + (os.platform() === 'win32' ? 1 : 0)));
+                        return orig.toString();
+                    }
+                    catch (err) {
+                        log.error(`Failed to read file (${id}) for mocking: ${err.message}`);
+                        return '';
+                    }
+                }
+                const mockedMod = (
+                // mocked file
+                mockHandler.mocks.get(os.platform() === 'win32' ? `/${id}` : id) ||
+                    // mocked dependency
+                    mockHandler.mocks.get(path.basename(id, path.extname(id))));
+                if (mockedMod) {
+                    const newCode = mockedMod.namedExports.map((ne) => {
+                        if (ne === 'default') {
+                            return /*js*/ `export default window.__wdioMockFactories__['${mockedMod.path}'].default;`;
+                        }
+                        return /*js*/ `export const ${ne} = window.__wdioMockFactories__['${mockedMod.path}']['${ne}'];`;
+                    });
+                    if (!mockedMod.namedExports.includes('default')) {
+                        newCode.push(/*js*/ `export default window.__wdioMockFactories__['${mockedMod.path}'];`);
+                    }
+                    log.debug(`Resolve mock for module "${mockedMod.path}"`);
+                    return newCode.join('\n');
+                }
+            }
+        }, {
+            name: 'wdio:mockHoisting',
+            enforce: 'post',
+            transform(code, id) {
+                /**
+                 * only transform when spec file is transformed
+                 */
+                if (id !== spec) {
+                    return { code };
+                }
+                const ast = parse(code, {
+                    parser: typescriptParser,
+                    sourceFileName: id,
+                    sourceRoot: path.dirname(id)
+                });
+                let mockFunctionName;
+                let unmockFunctionName;
+                const mockCalls = [];
+                /**
+                 * rewrite import statements into variable declarations, e.g. from
+                 *
+                 *     import React, { RC } from 'react'
+                 *
+                 * to
+                 *
+                 *     var { default: React, RC: RC } = await import("react")
+                 *
+                 * so we can hoist the mock call
+                 */
+                visit(ast, {
+                    visitImportDeclaration: function (path) {
+                        const dec = path.value;
+                        const source = dec.source.value;
+                        /**
+                         * get name of mock function variable
+                         */
+                        if (source === '@wdio/browser-runner') {
+                            const mockSpecifier = dec.specifiers
+                                .filter((s) => s.type === types.namedTypes.ImportSpecifier.toString())
+                                .find((s) => s.imported.name === 'mock');
+                            if (mockSpecifier && mockSpecifier.local) {
+                                mockFunctionName = mockSpecifier.local.name;
+                            }
+                            const unmockSpecifier = dec.specifiers
+                                .filter((s) => s.type === types.namedTypes.ImportSpecifier.toString())
+                                .find((s) => s.imported.name === 'unmock');
+                            if (unmockSpecifier && unmockSpecifier.local) {
+                                unmockFunctionName = unmockSpecifier.local.name;
+                            }
+                            mockCalls.push(dec);
+                            path.prune();
+                            return this.traverse(path);
+                        }
+                        const newNode = b.variableDeclaration('const', [
+                            b.variableDeclarator((dec.specifiers?.length === 1 && dec.specifiers[0].type === types.namedTypes.ImportNamespaceSpecifier.toString())
+                                /**
+                                 * we deal with a ImportNamespaceSpecifier, e.g.:
+                                 * import * as foo from 'bar'
+                                 */
+                                ? dec.specifiers[0].local
+                                /**
+                                 * we deal with default or named import, e.g.
+                                 * import foo from 'bar'
+                                 * or
+                                 * import { foo } from 'bar'
+                                 */
+                                : b.objectPattern(dec.specifiers.map((s) => {
+                                    if (s.type === types.namedTypes.ImportDefaultSpecifier.toString()) {
+                                        return b.property('init', b.identifier('default'), b.identifier(s.local.name));
+                                    }
+                                    return b.property('init', b.identifier(s.imported.name), b.identifier(s.local.name));
+                                })), b.awaitExpression(b.importExpression(b.literal(source))))
+                        ]);
+                        path.replace(newNode);
+                        this.traverse(path);
+                    },
+                    visitExpressionStatement: function (path) {
+                        const exp = path.value;
+                        if (exp.expression.type !== types.namedTypes.CallExpression.toString()) {
+                            return this.traverse(path);
+                        }
+                        const callExp = exp.expression;
+                        const isUnmockCall = unmockFunctionName && callExp.callee.name === unmockFunctionName;
+                        const isMockCall = mockFunctionName && callExp.callee.name === mockFunctionName;
+                        if (!isMockCall && !isUnmockCall) {
+                            return this.traverse(path);
+                        }
+                        /**
+                         * hoist unmock calls
+                         */
+                        if (isUnmockCall && callExp.arguments[0] && typeof callExp.arguments[0].value === 'string') {
+                            mockHandler.unmock(callExp.arguments[0].value);
+                        }
+                        else if (isMockCall) {
+                            /**
+                             * if only one mock argument is set, we take the fixture from the automock directory
+                             */
+                            const mockCall = exp.expression;
+                            if (mockCall.arguments.length === 1) {
+                                /**
+                                 * enable manual mock
+                                 */
+                                mockHandler.manualMocks.push(mockCall.arguments[0].value);
+                            }
+                            else {
+                                /**
+                                 * hoist mock calls
+                                 */
+                                mockCalls.push(exp);
+                            }
+                        }
+                        path.prune();
+                        this.traverse(path);
+                    }
+                });
+                ast.program.body.unshift(...mockCalls.map((mc) => {
+                    const exp = mc;
+                    if (exp.expression && exp.expression.type === types.namedTypes.CallExpression.toString()) {
+                        return b.expressionStatement(b.awaitExpression(exp.expression));
+                    }
+                    return mc;
+                }));
+                const newCode = print(ast, {
+                    sourceMapName: id
+                });
+                return newCode;
+            },
+            configureServer(server) {
+                return () => {
+                    server.middlewares.use('/', async (req, res, next) => {
+                        if (!req.url) {
+                            return next();
+                        }
+                        const urlParsed = url.parse(req.url);
+                        const urlParamString = new URLSearchParams(urlParsed.query || '');
+                        const specParam = urlParamString.get('spec');
+                        if (specParam) {
+                            mockHandler.resetMocks();
+                            spec = os.platform() === 'win32' ? specParam.slice(1) : specParam;
+                        }
+                        return next();
+                    });
+                };
+            }
+        }];
+}

package/build/vite/plugins/testrunner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testrunner.d.ts","sourceRoot":"","sources":["../../../src/vite/plugins/testrunner.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AA2ClC,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,CAAC,oBAAoB,GAAG,MAAM,EAAE,CAgI9E"}
+{"version":3,"file":"testrunner.d.ts","sourceRoot":"","sources":["../../../src/vite/plugins/testrunner.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AA0ClC,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,CAAC,oBAAoB,GAAG,MAAM,EAAE,CAgI9E"}

package/build/vite/plugins/testrunner.js

@@ -25,8 +25,7 @@ const POLYFILLS = [
 const FETCH_FROM_ESM = [
     'serialize-error', 'minimatch', 'css-shorthand-properties', 'lodash.merge', 'lodash.zip',
     'lodash.clonedeep', 'lodash.pickby', 'lodash.flattendeep', 'aria-query', 'grapheme-splitter',
-    'css-value', 'rgb2hex', 'p-iteration', 'fast-safe-stringify', 'deepmerge-ts',
-    'mocha'
+    'css-value', 'rgb2hex', 'p-iteration', 'fast-safe-stringify', 'deepmerge-ts'
 ];
 export function testrunner(options) {
     const automationProtocolPath = `/@fs${url.pathToFileURL(path.resolve(__dirname, '..', '..', 'browser', 'driver.js')).pathname}`;

package/build/vite/server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/vite/server.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAM1C,OAAO,EAAE,eAAe,EAAE,MAAM,IAAI,CAAA;AAGpC,OAAO,KAAK,EAAiB,YAAY,EAAE,MAAM,MAAM,CAAA;AAGvD,OAAO,KAAK,EAAY,OAAO,EAAE,MAAM,aAAa,CAAA;AAMpD,OAAO,KAAK,EAAgB,gBAAgB,EAA6E,MAAM,YAAY,CAAA;AAY3I,qBAAa,UAAW,SAAQ,YAAY;;IAQxC,IAAI,YAAY,gCAEf;IAED,IAAI,MAAM,0BAET;gBAEY,OAAO,EAAE,WAAW,CAAC,oBAAoB,EAAE,MAAM,EAAE,OAAO,CAAC,UAAU;IA4B5E,KAAK;IAwCL,KAAK;IA2IX,OAAO,CAAC,cAAc;IAetB,WAAW,CAAE,MAAM,EAAE,gBAAgB;CAUxC"}
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/vite/server.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAM1C,OAAO,EAAE,eAAe,EAAE,MAAM,IAAI,CAAA;AAGpC,OAAO,KAAK,EAAiB,YAAY,EAAE,MAAM,MAAM,CAAA;AAGvD,OAAO,KAAK,EAAY,OAAO,EAAE,MAAM,aAAa,CAAA;AAQpD,OAAO,KAAK,EACM,gBAAgB,EAEjC,MAAM,YAAY,CAAA;AAYnB,qBAAa,UAAW,SAAQ,YAAY;;IASxC,IAAI,YAAY,gCAEf;IAED,IAAI,MAAM,0BAET;gBAEY,OAAO,EAAE,WAAW,CAAC,oBAAoB,EAAE,MAAM,EAAE,OAAO,CAAC,UAAU;IAiC5E,KAAK;IAwCL,KAAK;IAkJX,OAAO,CAAC,cAAc;IAetB,WAAW,CAAE,MAAM,EAAE,gBAAgB;CAUxC"}

package/build/vite/server.js

@@ -8,7 +8,9 @@ import { executeHooksWithArgs } from '@wdio/utils';
 import { createServer } from 'vite';
 import istanbulPlugin from 'vite-plugin-istanbul';
 import { testrunner } from './plugins/testrunner.js';
+import { mockHoisting } from './plugins/mockHoisting.js';
 import { userfriendlyImport } from './utils.js';
+import { MockHandler } from './mock.js';
 import { PRESET_DEPENDENCIES, DEFAULT_VITE_CONFIG } from './constants.js';
 import { MESSAGE_TYPES, DEFAULT_INCLUDE, DEFAULT_FILE_EXTENSIONS } from '../constants.js';
 import { BROWSER_POOL, SESSIONS } from '../constants.js';
@@ -21,6 +23,7 @@ export class ViteServer extends EventEmitter {
     #viteConfig;
     #wss;
     #server;
+    #mockHandler;
     get socketServer() {
         return this.#wss;
     }
@@ -30,12 +33,16 @@ export class ViteServer extends EventEmitter {
     constructor(options, config) {
         super();
         this.#options = options;
+        this.#mockHandler = new MockHandler(options, config);
         if (options.preset && options.viteConfig) {
             throw new Error('Invalid runner configuration: "preset" and "viteConfig" options are defined but only one of each can be used at the same time');
         }
         this.#viteConfig = deepmerge(DEFAULT_VITE_CONFIG, {
             root: options.rootDir || process.cwd(),
-            plugins: [testrunner(options)]
+            plugins: [
+                testrunner(options),
+                mockHoisting(this.#mockHandler)
+            ]
         });
         if (options.coverage && options.coverage.enabled) {
             log.info('Capturing test coverage enabled');
@@ -43,6 +50,7 @@ export class ViteServer extends EventEmitter {
                 cwd: config.rootDir,
                 include: DEFAULT_INCLUDE,
                 extension: DEFAULT_FILE_EXTENSIONS,
+                forceBuildInstrument: true,
                 ...options.coverage
             }));
         }
@@ -109,6 +117,13 @@ export class ViteServer extends EventEmitter {
                 if (payload.type === MESSAGE_TYPES.commandRequestMessage) {
                     return this.#handleCommand(ws, payload.value);
                 }
+                if (payload.type === MESSAGE_TYPES.mockRequest) {
+                    this.#mockHandler.addMock(payload.value);
+                    return ws.send(JSON.stringify({
+                        type: MESSAGE_TYPES.mockResponse,
+                        value: payload.value
+                    }));
+                }
                 throw new Error(`Unknown socket message ${JSON.stringify(payload)}`);
             }
             catch (err) {

package/build/vite/types.d.ts

@@ -10,6 +10,8 @@ export type SocketMessageValue = {
     [MESSAGE_TYPES.commandResponseMessage]: CommandResponseEvent;
     [MESSAGE_TYPES.hookTriggerMessage]: HookTriggerEvent;
     [MESSAGE_TYPES.hookResultMessage]: HookResultEvent;
+    [MESSAGE_TYPES.mockRequest]: MockRequestEvent;
+    [MESSAGE_TYPES.mockResponse]: MockResponseEvent;
 };
 export type SocketMessagePayload<T extends MESSAGE_TYPES> = T extends any ? SocketMessagePayloadType<T> : never;
 export type SocketMessage = SocketMessagePayload<MESSAGE_TYPES>;
@@ -40,5 +42,13 @@ export interface CommandResponseEvent {
     result?: unknown;
     error?: ErrorObject;
 }
+export interface MockRequestEvent {
+    path: string;
+    origin: string;
+    namedExports: string[];
+}
+export interface MockResponseEvent {
+    path: string;
+}
 export {};
 //# sourceMappingURL=types.d.ts.map

package/build/vite/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/vite/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAClD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEpD,UAAU,wBAAwB,CAAC,CAAC,SAAS,aAAa;IACtD,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAA;CAC/B;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC7B,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,YAAY,CAAA;IAC5C,CAAC,aAAa,CAAC,qBAAqB,CAAC,EAAE,mBAAmB,CAAA;IAC1D,CAAC,aAAa,CAAC,sBAAsB,CAAC,EAAE,oBAAoB,CAAA;IAC5D,CAAC,aAAa,CAAC,kBAAkB,CAAC,EAAE,gBAAgB,CAAA;IACpD,CAAC,aAAa,CAAC,iBAAiB,CAAC,EAAE,eAAe,CAAA;CACrD,CAAA;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,aAAa,IAAI,CAAC,SAAS,GAAG,GACnE,wBAAwB,CAAC,CAAC,CAAC,GAC3B,KAAK,CAAA;AAEX,MAAM,MAAM,aAAa,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAA;AAE/D,MAAM,WAAW,YAAY;IACzB,IAAI,EAAE,cAAc,CAAA;IACpB,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAA;IACjD,IAAI,EAAE,OAAO,EAAE,CAAA;IACf,GAAG,EAAE,MAAM,CAAA;CACd;AAED,UAAU,2BAA2B;IACjC,EAAE,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,gBAAiB,SAAQ,2BAA2B;IACjE,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,OAAO,EAAE,CAAA;CAClB;AAED,MAAM,WAAW,eAAgB,SAAQ,2BAA2B;IAChE,KAAK,CAAC,EAAE,WAAW,CAAA;CACtB;AAED,MAAM,WAAW,mBAAoB,SAAQ,2BAA2B;IACpE,GAAG,EAAE,MAAM,CAAA;IACX,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,OAAO,EAAE,CAAA;CAClB;AAED,MAAM,WAAW,oBAAoB;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,WAAW,CAAA;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/vite/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAClD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEpD,UAAU,wBAAwB,CAAC,CAAC,SAAS,aAAa;IACtD,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAA;CAC/B;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC7B,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,YAAY,CAAA;IAC5C,CAAC,aAAa,CAAC,qBAAqB,CAAC,EAAE,mBAAmB,CAAA;IAC1D,CAAC,aAAa,CAAC,sBAAsB,CAAC,EAAE,oBAAoB,CAAA;IAC5D,CAAC,aAAa,CAAC,kBAAkB,CAAC,EAAE,gBAAgB,CAAA;IACpD,CAAC,aAAa,CAAC,iBAAiB,CAAC,EAAE,eAAe,CAAA;IAClD,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE,gBAAgB,CAAA;IAC7C,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE,iBAAiB,CAAA;CAClD,CAAA;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,aAAa,IAAI,CAAC,SAAS,GAAG,GACnE,wBAAwB,CAAC,CAAC,CAAC,GAC3B,KAAK,CAAA;AAEX,MAAM,MAAM,aAAa,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAA;AAE/D,MAAM,WAAW,YAAY;IACzB,IAAI,EAAE,cAAc,CAAA;IACpB,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAA;IACjD,IAAI,EAAE,OAAO,EAAE,CAAA;IACf,GAAG,EAAE,MAAM,CAAA;CACd;AAED,UAAU,2BAA2B;IACjC,EAAE,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,gBAAiB,SAAQ,2BAA2B;IACjE,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,OAAO,EAAE,CAAA;CAClB;AAED,MAAM,WAAW,eAAgB,SAAQ,2BAA2B;IAChE,KAAK,CAAC,EAAE,WAAW,CAAA;CACtB;AAED,MAAM,WAAW,mBAAoB,SAAQ,2BAA2B;IACpE,GAAG,EAAE,MAAM,CAAA;IACX,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,OAAO,EAAE,CAAA;CAClB;AAED,MAAM,WAAW,oBAAoB;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,WAAW,CAAA;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC7B,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,MAAM,EAAE,CAAA;CACzB;AAED,MAAM,WAAW,iBAAiB;IAC9B,IAAI,EAAE,MAAM,CAAA;CACf"}

package/build/vite/utils.d.ts

@@ -1,6 +1,9 @@
+/// <reference types="node" />
 import type { Environment, FrameworkPreset } from '../types.js';
-export declare function getTemplate(options: WebdriverIO.BrowserRunnerOptions, env: Environment, spec: string): Promise<string>;
+export declare function getTemplate(options: WebdriverIO.BrowserRunnerOptions, env: Environment, spec: string, processEnv?: NodeJS.ProcessEnv): Promise<string>;
 export declare function userfriendlyImport(preset: FrameworkPreset, pkg?: string): Promise<any>;
 export declare function normalizeId(id: string, base?: string): string;
+export declare function getFilesFromDirectory(dir: string): Promise<string[]>;
+export declare function getManualMocks(automockDir: string): Promise<[string, string][]>;
 export declare function getErrorTemplate(filename: string, error: Error): string;
 //# sourceMappingURL=utils.d.ts.map

package/build/vite/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/vite/utils.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAE/D,wBAAsB,WAAW,CAAC,OAAO,EAAE,WAAW,CAAC,oBAAoB,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,mBAyE1G;AAED,wBAAsB,kBAAkB,CAAC,MAAM,EAAE,eAAe,EAAE,GAAG,CAAC,EAAE,MAAM,gBAa7E;AAED,wBAAgB,WAAW,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAY7D;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,UAU9D"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/vite/utils.ts"],"names":[],"mappings":";AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAE/D,wBAAsB,WAAW,CAAC,OAAO,EAAE,WAAW,CAAC,oBAAoB,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,oBAAc,mBAsFpI;AAED,wBAAsB,kBAAkB,CAAC,MAAM,EAAE,eAAe,EAAE,GAAG,CAAC,EAAE,MAAM,gBAa7E;AAED,wBAAgB,WAAW,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAY7D;AAED,wBAAsB,qBAAqB,CAAE,GAAG,EAAE,MAAM,qBAavD;AAGD,wBAAsB,cAAc,CAAC,WAAW,EAAE,MAAM,+BAgBvD;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,UAU9D"}

package/build/vite/utils.js

@@ -2,7 +2,7 @@ import fs from 'node:fs/promises';
 import url from 'node:url';
 import path from 'node:path';
 import { resolve } from 'import-meta-resolve';
-export async function getTemplate(options, env, spec) {
+export async function getTemplate(options, env, spec, processEnv = process.env) {
     const root = options.rootDir || process.cwd();
     const rootFileUrl = url.pathToFileURL(root).href;
     let vueDeps = '';
@@ -30,14 +30,19 @@ export async function getTemplate(options, env, spec) {
         }
     }
     const mochaCSSHref = await resolve('mocha', `${rootFileUrl}/node_modules`).then((p) => path.join(url.fileURLToPath(path.dirname(p)), 'mocha.css'), () => 'https://unpkg.com/mocha@10.0.0/mocha.css');
+    const mochaJSSrc = await resolve('mocha', `${rootFileUrl}/node_modules`).then((p) => path.join(url.fileURLToPath(path.dirname(p)), 'mocha.js'), () => 'https://unpkg.com/mocha@10.0.0/mocha.js');
+    const sourceMapSupportDir = path.dirname(url.fileURLToPath(await resolve('source-map-support', import.meta.url)));
     return /* html */ `
     <!doctype html>
     <html>
         <head>
             <title>WebdriverIO Browser Test</title>
             <link rel="icon" type="image/x-icon" href="https://webdriver.io/img/favicon.png">
-            <link rel="stylesheet" href="${mochaCSSHref}">
+            <link rel="stylesheet" href="${mochaCSSHref}"><script type="module" src="${mochaJSSrc}"></script>
+            <script src="/@fs/${sourceMapSupportDir}/browser-source-map-support.js"></script>
             <script type="module">
+                sourceMapSupport.install()
+
                 /**
                  * Inject environment variables
                  */
@@ -50,7 +55,8 @@ export async function getTemplate(options, env, spec) {
                 window.__wdioErrors__ = []
                 addEventListener('error', (ev) => window.__wdioErrors__.push({
                     filename: ev.filename,
-                    message: ev.message
+                    message: ev.message,
+                    error: ev.error.stack
                 }))
                 /**
                  * mock process
@@ -65,6 +71,9 @@ export async function getTemplate(options, env, spec) {
         <body>
             <div id="mocha"></div>
             <script async type="module" src="@wdio/browser-runner/setup"></script>
+            <script type="module">
+                window.process.env = ${JSON.stringify(processEnv)}
+            </script>
         </body>
     </html>`;
 }
@@ -92,6 +101,37 @@ export function normalizeId(id, base) {
         .replace(/[?&]v=\w+/, '?') // remove ?v= query
         .replace(/\?$/, ''); // remove end query mark
 }
+export async function getFilesFromDirectory(dir) {
+    let files = await fs.readdir(dir);
+    files = (await Promise.all(files.map(async (file) => {
+        const filePath = path.join(dir, file);
+        const stats = await fs.stat(filePath);
+        if (stats.isDirectory()) {
+            return getFilesFromDirectory(filePath);
+        }
+        else if (stats.isFile()) {
+            return filePath;
+        }
+    }))).filter(Boolean);
+    return files.reduce((all, folderContents) => all.concat(folderContents), []);
+}
+let mockedModulesList;
+export async function getManualMocks(automockDir) {
+    /**
+     * read available mocks only one time
+     */
+    if (!mockedModulesList) {
+        mockedModulesList = (await getFilesFromDirectory(automockDir))
+            /**
+             * seperate to module name and actual path
+             */
+            .map((filePath) => [
+            filePath,
+            filePath.slice(automockDir.length + 1).slice(0, -path.extname(filePath).length)
+        ]);
+    }
+    return mockedModulesList;
+}
 export function getErrorTemplate(filename, error) {
     return /*html*/ `
         <pre>${error.stack}</pre>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wdio/browser-runner",
-  "version": "8.3.10",
+  "version": "8.4.0",
   "description": "A WebdriverIO runner to run unit tests tests in the browser.",
   "author": "Christian Bromann <mail@bromann.dev>",
   "homepage": "https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-browser-runner",
@@ -30,17 +30,18 @@
     "@babel/plugin-proposal-class-properties": "^7.18.6",
     "@originjs/vite-plugin-commonjs": "^1.0.3",
     "@types/istanbul-lib-source-maps": "^4.0.1",
-    "@types/node": "^18.11.18",
-    "@vitest/spy": "^0.28.4",
-    "@wdio/globals": "8.3.10",
-    "@wdio/local-runner": "8.3.10",
+    "@types/node": "^18.14.0",
+    "@vitest/spy": "^0.29.1",
+    "@wdio/globals": "8.4.0",
+    "@wdio/local-runner": "8.4.0",
     "@wdio/logger": "8.1.0",
-    "@wdio/mocha-framework": "8.3.0",
-    "@wdio/protocols": "8.3.5",
-    "@wdio/types": "8.3.0",
-    "@wdio/utils": "8.3.0",
-    "deepmerge-ts": "^4.2.2",
-    "expect-webdriverio": "^4.1.0",
+    "@wdio/mocha-framework": "8.4.0",
+    "@wdio/protocols": "8.3.11",
+    "@wdio/types": "8.4.0",
+    "@wdio/utils": "8.4.0",
+    "ast-types": "^0.14.2",
+    "deepmerge-ts": "^4.3.0",
+    "expect-webdriverio": "^4.1.2",
     "fast-safe-stringify": "^2.1.1",
     "get-port": "^6.1.2",
     "import-meta-resolve": "^2.2.1",
@@ -48,14 +49,16 @@
     "istanbul-lib-report": "^3.0.0",
     "istanbul-lib-source-maps": "^4.0.1",
     "istanbul-reports": "^3.1.5",
-    "modern-node-polyfills": "^0.0.9",
+    "modern-node-polyfills": "^0.1.0",
+    "recast": "^0.22.0",
     "serialize-error": "^11.0.0",
-    "vite": "^4.0.4",
+    "source-map-support": "^0.5.21",
+    "vite": "^4.1.3",
     "vite-plugin-istanbul": "^4.0.0",
-    "vite-plugin-top-level-await": "^1.2.2",
-    "webdriver": "8.3.8",
-    "webdriverio": "8.3.10",
-    "ws": "^8.12.0"
+    "vite-plugin-top-level-await": "^1.2.4",
+    "webdriver": "8.4.0",
+    "webdriverio": "8.4.0",
+    "ws": "^8.12.1"
   },
   "scripts": {
     "prepare": "rimraf node_modules/@wdio/config node_modules/@wdio/repl node_modules/@wdio/utils"
@@ -65,7 +68,7 @@
   },
   "devDependencies": {
     "@types/ws": "^8.5.4",
-    "@wdio/runner": "8.3.10"
+    "@wdio/runner": "8.4.0"
   },
-  "gitHead": "5135fb86e53dcbfca0a5935eda4b44aa3ca46dc2"
+  "gitHead": "5d003ce35250c9d9dcecc9fd13a97257d6b349fe"
 }