Usage

Minimal E2E test (Mocha, JavaScript)

After running npm init wdio@latest ., the wizard generates a wdio.conf.js and a sample spec file. Below is a minimal spec that opens a page, asserts a title, and clicks a link.

test/specs/example.spec.js

describe('My first WebdriverIO test', () => {
    it('should navigate to the WebdriverIO homepage and verify the title', async () => {
        await browser.url('https://webdriver.io')

        const title = await browser.getTitle()
        expect(title).toContain('WebdriverIO')
    })

    it('should click the Get Started link', async () => {
        await browser.url('https://webdriver.io')

        const link = await $('=Get Started')
        await link.click()

        const url = await browser.getUrl()
        expect(url).toContain('/docs/gettingstarted')
    })
})

Key points:

• browser is a global object injected by the WebdriverIO test runner. No import needed in the default runner mode.
• $('=Get Started') uses the link-text selector strategy. Other selectors: CSS ($('.btn')), XPath ($('//button')), role ($('aria/Button')).
• All commands are async/await. WebdriverIO handles auto-waiting for elements to be present and interactable.

---

Standalone mode (script, no test runner)

Use this when you want to drive a browser from a plain Node.js script without a test runner.

script.js

import { remote } from 'webdriverio'

const browser = await remote({
    capabilities: {
        browserName: 'chrome'
    }
})

await browser.url('https://example.com')
const title = await browser.getTitle()
console.log('Page title:', title)

await browser.deleteSession()

Run with:

node --experimental-vm-modules script.js

---

Running tests

npx wdio run wdio.conf.js

Run a single spec file:

npx wdio run wdio.conf.js --spec test/specs/example.spec.js

---

Interactive REPL (debug mode)

Open a live browser session and run commands interactively:

npx wdio repl chrome

This drops you into a Node.js REPL where every WebdriverIO command is available. Useful for finding selectors and debugging flows before writing them into tests.

---

Component testing (Vite-based)

WebdriverIO supports component testing for React, Vue, Svelte, and other Vite-compatible frameworks. The wizard configures this automatically. A minimal React component test looks like:

import { render } from '@testing-library/react'
import MyComponent from '../../src/MyComponent.jsx'

describe('MyComponent', () => {
    it('renders without error', async () => {
        render(<MyComponent />)
        const el = await $('h1')
        await expect(el).toHaveText('Hello World')
    })
})