Referência da API WebDriverJS para Axe DevTools para Web

Construtor

Na configuração padrão, o único argumento necessário a ser passado para o construtor do Axe DevTools é a instância do WebDriverJS. Se você deseja usar uma versão diferente do axe-core que não a incluída originalmente ou um conjunto de regras personalizado, você pode passar essas opções para o construtor.

Construtor de Axe DevTools WebDriverJS:

AxeDevToolsBuilder(driver:WebDriver, String:ruleset|Object:axe (optional))

Você deve passar uma instância de um Selenium WebDriver como o primeiro argumento. O segundo argumento opcional pode ser ou um ID de conjunto de regras ou um objeto axe. Se você não fornecer um segundo argumento, deverá configurar o arquivo de configuração de regras personalizadas @axe-devtools/script-builder, ou o construtor lançará uma exceção.

Estes exemplos mostram como usar o construtor:

// instantiate with the Section 508 rule set
const builder = new AxeDevToolsBuilder(driver, '508');

// or with a specific axe instance
const axe = require('../axe-core-2.3.0');
const builder = new AxeDevToolsBuilder(driver, axe);

Regras Personalizadas

Para informações sobre como usar regras personalizadas com o Axe DevTools para Web, leia o guia sobre geração e integração de conjuntos de regras personalizadas no guia CLI.

analyze

O método analyze() executa a análise e retorna resultados de varredura de acessibilidade.

analyze(): Promise<axe.AxeResults>

Execute uma análise usando a configuração padrão no cliente fornecido. Um Promise é retornado, que resolve com o conjunto de resultados de acessibilidade retornado pelo axe-core.

analyzeUniversal

O método analyzeUniversal() executa a análise e retorna resultados no Formato Universal do Axe. O método analyze() existente permanece inalterado.

analyzeUniversal(): Promise<UniversalExport>

Opções de Cadeamento

Existem duas opções para delimitar suas varreduras do Axe DevTools. Você pode optar por incluir ou excluir escopos de CSS específicos. Os métodos de cadeia (abaixo) no construtor tornam isso possível.

include

new AxeDevToolsBuilder(driver).include('<CSS-Selector>');

Adiciona um seletor CSS à lista de elementos a serem incluídos na análise. Elementos fora do escopo passado para include() não serão escaneados.

exclude

new AxeDevToolsBuilder(driver).exclude('<CSS-Selector>');

Adiciona um seletor CSS à lista de elementos a serem excluídos da análise. Somente elementos fora do escopo passado para exclude() serão escaneados.

Esses métodos podem ser encadeados para refinar ainda mais o escopo da varredura, como mostrado abaixo:

new AxeDevToolsBuilder(driver).include('<CSS-Selector>').exclude('<Inner-CSS-Selector>');

Neste exemplo, todos os elementos dentro de <CSS-Selector> seriam escaneados, exceto os elementos dentro de <Inner-CSS-Selector>.

Configuração de Regras

Os métodos de configuração de regras substituem a configuração padrão de regras. Chamadas adicionais com esses métodos substituirão chamadas anteriores.

withRules

O método withRules() limita a análise apenas às regras com os IDs de regra especificados. Ele aceita uma string para um único ID de regra ou um array de múltiplos IDs de regra.

Estes exemplos mostram o uso de withRules com um único ID de regra e um array de IDs de regra:

//with a single rule ID
AxeDevToolsBuilder(driver).withRules('html-lang');

//with an array of rule IDs
AxeDevToolsBuilder(driver).withRules(['html-lang', 'image-alt']);

withTags

O método withTags() limita a análise apenas às regras associadas à tag fornecida. Aceita uma única tag ou um array de tags, conforme mostrado abaixo:

//with a single tag
AxeDevToolsBuilder(driver).withTags('wcag2a');

//with an array of tags
AxeDevToolsBuilder(driver).withTags(['wcag2a', 'wcag2aa']);

disableRules

AxeDevToolsBuilder.disableRules(rules: RuleID[]): AxeDevToolsBuilder

O método disableRules() faz com que o array de regras fornecido seja ignorado ao executar uma análise.

opções do axe-core

opções

.options(options: Axe.RunOptions)

O método options especifica opções a serem usadas pelo axe.run. Ele substituirá quaisquer outras opções configuradas, incluindo chamadas para withRules e withTags. Veja o documentação da API do axe-core para mais informações.

new AxeDevToolsBuilder(page).options({
  checks: { 'valid-lang': ['orcish'] }
});

configurar

.configure(config: Axe.Spec)

O método configure injeta um objeto de configuração do axe para modificar o conjunto de regras antes de uma análise. Chamadas subsequentes a este método invalidarão as anteriores ao chamar axe.configure() e substituir o objeto de configuração. Veja documentação da API do axe-core para a estrutura do objeto.

O exemplo a seguir cria uma nova configuração do axe-core e a passa para o Axe DevTools para ser usada na varredura:

const config = {
  checks: [Object],
  rules: [Object]
};
const results = await new AxeDevToolsBuilder(page).configure(config).analyze();

Serviço de Uso

Por padrão, o serviço de uso é desativado, e a URL padrão é https://usage.deque.com.

Variáveis de Ambiente

Essas variáveis de ambiente permitem que você configure o serviço de uso e altere as propriedades dos eventos relatados.

habilitarRastreamento

Este método permite que os usuários optem por enviar dados para o serviço de uso.

.enableTracking(state: boolean)

AxeDevToolsBuilder(driver).enableTracking(true)

definirUrlRastreamento

Este método permite que os usuários alterem para onde os dados das métricas de uso são enviados.

.setTrackingUrl(url: string)

AxeDevToolsBuilder(driver).setTrackingUrl('https://foobar.biz')

definirIdDistinto

Este método permite que os usuários alterem o ID distinto que está sendo armazenado ou usado.

.setDistinctId(distinctId: string)

AxeDevToolsBuilder(driver).setDistinctId('foobar')