Escolhendo uma Integração Node.js

O Axe DevTools for Web oferece vários pacotes Node.js e JavaScript. Todos executam as mesmas regras de acessibilidade e produzem o mesmo tipo de resultados. O que os diferencia é o que uma varredura abrange, o que depende do tipo de teste que você está escrevendo:

• Você renderiza a marcação dentro do teste e deseja escaneá-la, como em um teste de componente ou unidade. Use @axe-devtools/browser.
• Seu teste dirige um navegador para uma página e você deseja escanear essa página, como em um teste de ponta a ponta. Use o pacote para a ferramenta que já dirige o seu navegador.

Se você já sabe qual pacote precisa, vá para Opções de Instalação.

Escaneando a marcação que seu teste renderiza

O pacote @axe-devtools/browser é uma biblioteca JavaScript carregada na página que seus testes exercem. Você o inicializa uma vez, e então passa AxeDevTools.run() um elemento DOM para escanear. Como ele aceita um elemento em vez de uma sessão de navegador, é adequado para test runners que renderizam sua própria marcação, como Jasmine, Karma ou uma biblioteca de testes rodando sob Jest.

Apesar do nome, @axe-devtools/browser não é uma ferramenta interativa ou extensão de navegador. Ele roda dentro de testes automatizados da mesma maneira que os outros pacotes.

Karma

Karma não é uma integração separada. Você escreve testes com @axe-devtools/browser e adiciona @axe-devtools/karma-json-reporter como um plugin do Karma. O relatório escreve um arquivo JSON para cada varredura que você registra, e @axe-devtools/cli converte esses arquivos em relatórios após a execução do teste.

Escaneando páginas que seu teste navega

Se seu conjunto de testes abre páginas em um navegador, escolha o pacote que corresponde à ferramenta que já está dirigindo esse navegador. Cada um adiciona a varredura de acessibilidade à sessão que seus testes já têm, então você não precisa mudar como seus testes iniciam o navegador ou alcançam a página.

Cypress é configurado de forma diferente dos outros. Em vez de criar um objeto Axe DevTools em torno de um driver, você registra um plugin em cypress.config.js e importa o pacote no seu arquivo de suporte, o que adiciona comandos do Axe DevTools a cy.

Cucumber

Cucumber também não é uma integração separada. Configure primeiro o WebDriverJS, WebdriverIO ou Puppeteer, e então defina etapas Gherkin reutilizáveis que o chamem.

Relatórios, registro e Axe Developer Hub

Esses pacotes funcionam junto com qualquer uma das integrações acima, em vez de substituir uma:

• Node Reporter (@axe-devtools/reporter) gera relatórios a partir dos seus resultados salvos.
• Node Logger (@axe-devtools/logger) registra os resultados de acessibilidade enquanto seus testes são executados.
• Fazendo upload dos seus resultados para o Axe Developer Hub explica como enviar resultados para o Axe Developer Hub.

Ainda não tem certeza

Se nenhum destes se adapta a como seus testes funcionam, entre em contato com seu representante Deque ou pergunte através do nosso suporte técnico.