No nível raiz da sua pasta de testes, instale o @axe-core/watcher pacote e todas as suas dependências usando npm ou o seu gerenciador de pacotes preferido (por exemplo, yarn ou pnpm).
npm install --save-dev @axe-core/watcherNos seus arquivos de teste, importe a wdioConfig() função, a wrapWdio() função, e a WdioController classe de @axe-core/watcher/wdio:
const {
wdioConfig,
wrapWdio,
WdioController
} = require('@axe-core/watcher/wdio')No código de configuração dos seus testes (tipicamente em um before ou beforeAll bloco), envolva qualquer código existente para criar uma browser instância com uma chamada para wdioConfig(), fornecendo sua chave de API:
const ACCESSIBILITY_API_KEY = process.env.ACCESSIBILITY_API_KEY
const PROJECT_ID = process.env.PROJECT_ID
const browser = await wdio.remote(
wdioConfig({
axe: {
apiKey: ACCESSIBILITY_API_KEY,
projectId: PROJECT_ID
}
})
)Certifique-se de definir ACCESSIBILITY_API_KEY e PROJECT_ID no seu ambiente como a sua chave de API pessoal (encontrada na sua conta do axe, na aba **API KEYS** ) e o seu ID de projeto (mostrado no topo destas instruções quando você criou seu projeto ou disponível na página de Projetos, escolhendo **Configurar projeto** em **Configurações**).
Uma vez que você tenha uma browser instância, crie uma instância da WdioController classe:
const controller = new WdioController(browser)Envolva sua browser instância com a wrapWdio() função, fornecendo a browser instância e a controller instância:
wrapWdio(browser, controller)Finalmente, certifique-se de que todos os resultados dos testes do axe Watcher sejam processados. Para fazer isso, adicione o seguinte bloco de código ao código de finalização dos seus testes (tipicamente em um bloco de afterEach bloco):
afterEach(async () => {
await controller.flush()
})