Configuring WebdriverIO
Playwright vs WebdriverIO
If you do not already use WebdriverIO in your project, we recommend starting with Playwright as it is easier to configure and has more flexible API.
By default, TypeScript doesn't recognize providers options and extra expect
properties. Make sure to reference @vitest/browser/providers/webdriverio
so TypeScript can pick up definitions for custom options:
/// <reference types="@vitest/browser/providers/webdriverio" />
Alternatively, you can also add it to compilerOptions.types
field in your tsconfig.json
file. Note that specifying anything in this field will disable auto loading of @types/*
packages.
{
"compilerOptions": {
"types": ["@vitest/browser/providers/webdriverio"]
}
}
Vitest opens a single page to run all tests in the same file. You can configure any property specified in RemoteOptions
in instances
:
import { defineConfig } from 'vitest/config'
export default defineConfig({
test: {
browser: {
instances: [
{
browser: 'chrome',
capabilities: {
browserVersion: 86,
platformName: 'Windows 10',
},
},
],
},
},
})
WARNING
Before Vitest 3, these options were located on test.browser.providerOptions
property:
export default defineConfig({
test: {
browser: {
providerOptions: {
capabilities: {},
},
},
},
})
providerOptions
is deprecated in favour of instances
.
You can find most available options in the WebdriverIO documentation. Note that Vitest will ignore all test runner options because we only use webdriverio
's browser capabilities.
TIP
Most useful options are located on capabilities
object. WebdriverIO allows nested capabilities, but Vitest will ignore those options because we rely on a different mechanism to spawn several browsers.
Note that Vitest will ignore capabilities.browserName
. Use test.browser.instances.name
instead.