Instructions for WebDriverJS and TypeScript
Configuring your tests with WebDriverJS and TypeScript
-
In the root level of your testing folder, install the @axe-core/watcher package and all of its dependencies using npm or your preferred package manager (for example, Yarn or pnpm).
npm install --save-dev @axe-core/watcher
-
In your test file or files, import the webdriverConfig function, the wrapWebdriver function, and the WebdriverController class from @axe-core/watcher**:
import { webdriverConfig, wrapWebdriver, WebdriverController } from '@axe-core/watcher'
-
Update your test setup code (typically in a before or beforeAll block), specifying Chrome options when instantiating your browser instance, providing your API key:
// Original code: const browser = await new Builder() .forBrowser('chrome') .build() // Becomes: const API_KEY = process.env.API_KEY const browser = await new Builder() .forBrowser('chrome') .setChromeOptions( webdriverConfig({ axe: { apiKey: API_KEY } } ) .build()
-
Create an instance of the WebdriverController:
const controller = new WebdriverController(browser)
-
Write your browser instance with the wrapWebdriver() function:
browser = wrapWebdriver(browser, controller)
-
Finally, ensure all test results from axe Watcher are flushed out. To do this, add the following block of code to your test teardown code (typically in an afterEach block):
afterEach(async () => { await controller.flush() })