Escribiendo pruebas para Axe DevTools para Web con WebDriverJS

Escribiendo pruebas con Axe DevTools

Los fragmentos individuales en las secciones a continuación son JavaScript y se compilan sin cambios en TypeScript. La sección Archivo de muestra completo ofrece la prueba completa en ambos lenguajes.

Requisitos previos

Para examinar páginas con Axe DevTools, primero necesitas importarlo e iniciarlo en tu proyecto. Si aún no has realizado este paso, consulta esta guía sobre cómo hacerlo.

Obteniendo el contexto de escaneo

Antes de que puedas escanear una página por accesibilidad, debe ser accedida por el webdriver.

await driver.get('<URL>');

Una vez que el webdriver ha accedido a la página, puedes escanearla con Axe DevTools y guardar los resultados. La forma más sencilla de ver los resultados del escaneo es registrando el objeto de resultados en la consola.

const results = await new AxeDevToolsBuilder(driver).analyze();
console.log(results);

Archivo de muestra completo

La misma prueba se muestra a continuación en JavaScript y en TypeScript. La API de Axe DevTools es idéntica en ambos; la versión de TypeScript utiliza sintaxis import y anota el controlador y los resultados del escaneo.

JavaScript

const { AxeDevToolsBuilder } = require('@axe-devtools/webdriverjs');
const WebDriver = require('selenium-webdriver');

var driver = new WebDriver.Builder().forBrowser('chrome').build();

driver.get('https://google.com').then(function() {
  new AxeDevToolsBuilder(driver).analyze(function(err, results) {
    if (err) {
      // Handle error
    }
    console.log(results);
  });
});

TypeScript

import { AxeDevToolsBuilder } from '@axe-devtools/webdriverjs';
import { Builder } from 'selenium-webdriver';
import type { WebDriver } from 'selenium-webdriver';
import type { AxeResults } from 'axe-core';

(async () => {
  const driver: WebDriver = new Builder().forBrowser('chrome').build();

  try {
    await driver.get('https://google.com');
    const results: AxeResults = await new AxeDevToolsBuilder(driver).analyze();
    console.log(results);
  } finally {
    await driver.quit();
  }
})();

Próximos pasos

Ahora que has completado con éxito un escaneo de accesibilidad, estás listo para avanzar a temas de escaneo más avanzados como generar informes y usar el objeto de resultados.

Solución de problemas

Si tienes problemas para obtener resultados de escaneo, contacta directamente a tu representante de Deque, comunícate con nosotros a través de nuestra mesa de soporte, o envíanos un correo electrónico. Estaremos encantados de ayudarte.