1. Installieren Sie auf der Stammebene Ihres Testordners das Paket @axe-core/watcher und alle seine Abhängigkeiten mit npm oder Ihrem bevorzugten Paketmanager (z. B. Yarn oder pnpm).

    npm install --save-dev @axe-core/watcher
  2. Importieren Sie in Ihre Testdatei(en) die Funktion webdriverConfig(), die Funktion wrapWebdriver() und die Klasse WebdriverController aus @axe-core/watcher:

    const {
      webdriverConfig,
      wrapWebdriver,
      WebdriverController
    } = require('@axe-core/watcher')
  3. Aktualisieren Sie Ihren Test-Setup-Code (normalerweise in einem before - oder beforeAll -Block), indem Sie beim Instanziieren Ihrer Browserinstanz Chrome-Optionen angeben und Ihren API-Schlüssel bereitstellen:

    // Original code:
    let browser = await new Builder()
      .forBrowser('chrome')
      .build()
    
    // Becomes:
    const API_KEY = process.env.API_KEY
    
    let browser = await new Builder()
      .forBrowser('chrome')
      .setChromeOptions(
        webdriverConfig({
          axe: {
            apiKey: API_KEY
          }
        }
      )
      .build()
  4. Erstellen Sie eine Instanz des WebdriverController:

    const controller = new WebdriverController(browser)
  5. Erstellen Sie Ihre Browserinstanz mit der Funktion wrapWebdriver():

    browser = wrapWebdriver(browser, controller)
  6. Stellen Sie abschließend sicher, dass alle Testergebnisse aus Axe Watcher vollständig verarbeitet sind. Fügen Sie dazu den folgenden Codeblock zu Ihrem Test-Teardown-Code hinzu (normalerweise in einem afterEach -Block):

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