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 wdio.config.js
file, import the wdioTestRunner()
function, the wrapWdio()
function, and the WdioController
class from @axe-core/watcher
:
const {
wdioTestRunner,
wrapWdio,
WdioController
} = require('@axe-core/watcher')
Before exporting your WebdriverIO configuration, wrap it with a call to wdioTestRunner()
while providing your API key:
exports.config = {
// Your config options here...
}
// Becomes:
exports.config = wdioTestRunner({
axe: {
apiKey: process.env.API_KEY
}, {
// Your config options here...
}
})
In your test setup code (typically in a before
or beforeAll
block), create an instance of the WdioController
, and then wrap your browser
object:
const controller = new WdioController(browser)
wrapWdio(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 afterFetch
block):
afterEach(async () => {
await controller.flush()
})