Istruzioni per Puppeteer e JavaScript

Nella radice della cartella di test, installa il pacchetto @axe-core/watcher e tutte le sue dipendenze utilizzando npm o il tuo gestore di pacchetti preferito (ad esempio, Yarn o pnpm).

npm install --save-dev @axe-core/watcher

Nel file o nei file di test, importa la funzione puppeteerConfig(), la funzione wrapPuppeteer() e la classe PuppeteerController da @axe-core/watcher:

const {
  puppeteerConfig,
  wrapPuppeteerPage,
  PuppeteerController
} = require('@axe-core/watcher')

Aggiorna il codice di configurazione del test (in genere in un blocco before o beforeAll ), inserisci qualsiasi codice esistente per creare un'istanza browser con una chiamata a puppeteerConfig(), fornendo al contempo la tua chiave API:

const browser = await puppeteer.launch({
  // Your existing launch options...
})

// Becomes:

const browser = await puppeteer.launch(
  puppeteerConfig({
    axe: {
      apiKey: process.env.API_KEY
    },
    // Your existing launch options...
  })
)

Crea un'istanza di PuppeteerController e incapsula il tuo Puppeteer browserContext:

// Create a page instance, using your browser instance.
let page = await browser.newPage()

// Initialize the PuppeteerController by passing in the Puppeteer page.
const controller = new PuppeteerController(page)

// Use the new wrapped Puppeteer page instance.
page = wrapPuppeteerPage(page, controller)

Infine, assicurarsi che tutti i risultati dei test di axe Watcher siano stati completamente elaborati. Per fare ciò, aggiungi il seguente blocco di codice al tuo codice di smantellamento del test (in genere in un blocco afterEach ):

afterEach(async () => {
  await controller.flush()
})