Fehlerbehebung

Watcher unterstützt nur Chrome für Tests oder Chromium

Obwohl die Webseite des axe Developer Hub mehrere Browser unterstützt, unterstützt das Watcher-Paket nur Google Chrome für Tests oder Chromium. Probleme, auf die Sie stoßen könnten:

• Wenn Sie Chrome Version 139 oder höher verwenden, erhalten Sie einen Fehler von Watcher. Verwenden Sie stattdessen Chrome für Tests oder Chromium.
• Wenn Sie den Electron-Browser von Cypress verwenden, erhalten Sie einen Fehler. Geben Sie als Browser Chrome für Tests oder Chromium an, wenn Sie Cypress aufrufen; andernfalls wird standardmäßig der Electron-Browser verwendet. Siehe Browser starten in der Cypress-Dokumentation für weitere Informationen.

Wenn Sie WebdriverIO, WebDriverJS oder Java Selenium verwenden, müssen Sie Ihre Testumgebung explizit so konfigurieren, dass Chrome für Tests verwendet wird. Siehe Chrome für Tests verwenden für Installationsschritte und plattformspezifische Konfigurationsbeispiele.

Siehe Automatisierte Testplattformen für weitere Informationen über unterstützte Software mit Watcher.

Unvollständige Ergebnisse

Wenn Ihre Testumgebung mehrere Testrunner verwendet, die parallel laufen und dieselbe nicht-leere Build-ID verwenden, überschreiben die Ergebnisse jedes Testrunners die der anderen Testrunner für den gleichen Git-Commit-SHA, was zu unvollständigen Ergebnissen führt. Sie müssen sicherstellen, dass jeder Testrunner dieselbe nicht-leere Build-ID verwendet.

Normalerweise setzen Sie die Build-ID in Ihrem AxeConfiguration.

Für weitere Informationen über die Verwendung paralleler Testrunner mit verschiedenen CI/CD-Plattformen siehe Tests parallel ausführen.

Doppelte Barrierefreiheitsfehler oder falsche Anzahl neuer Probleme

Wenn Ihre Website dynamische IDs oder Klassennamen verwendet, die sich ändern, wann immer die Seite neu geladen wird, werden Sie wahrscheinlich doppelte Barrierefreiheitsfehler sehen, insbesondere Probleme, die als neu gekennzeichnet sind, wenn vorherige Testruns dasselbe Problem an demselben Element aufweisen. (Der Axe Developer Hub verwendet IDs und Klassen, um dasselbe Element zwischen Testruns zu identifizieren.) Um dieses Problem zu lösen, müssen Sie die ancestry Eigenschaft im runOptions Objekt in Ihrer Konfiguration auf true. Das folgende Beispiel zeigt, wie Sie die Option in Ihrer Konfiguration einstellen:

axe: {
  runOptions: {
    ancestry: true
  }
}

Siehe Verwendung dynamischer Selektoren für weitere Anleitungen zur Verwendung dynamischer Selektoren.

Siehe (JavaScript/TypeScript) runOptions oder (Java) AxeWatcherOptions.setRunOptions() für weitere Informationen.

Alte Version von @axe-core/watcher

Wenn Sie Version 3.18.0 oder älter von @axe-core/watcher verwenden, erhalten Sie diese Warnmeldung:

Axe Developer Hub hält sich nun an die in der axe-Konfigurationdefinierten Einstellungen, und Testläufe, die mit Versionen von @axe-core/watcher Version 3.18.0 oder älter erstellt wurden, erzeugen Sitzungen, die sich der globalen Einstellungen in der axe-Konfiguration nicht bewusst sind. Sie sollten Ihr @axe-core/watcher-Paket aktualisieren und Ihre Tests erneut ausführen, um Sitzungen zu erstellen, die der axe-Konfiguration Ihres Unternehmens folgen. Siehe Verwendung globaler Konfigurationen.

Controller-Methode läuft ab

(Nur JavaScript oder TypeScript) Sie erhalten eine Nachricht, die der folgenden ähnelt, wenn Aufrufe der Controller-Methoden (definiert in der Controller abstrakten Basisklasse als analyze(), flush(), start(), und stop()) oder benutzerdefinierten Cypress-Befehlen ablaufen:

Error: Watcher could not send results to the server. To resolve this problem, adjust your `timeout.flush` property within your configuration or see https://docs.deque.com/developer-hub/wa-troubleshooting for more troubleshooting.

Die angegebene Controller Methode (hier die flush() Methode) benötigte mehr als die Standardzeit, um abgeschlossen zu werden, und lief ab. Sie können die Standardzeit ändern, indem Sie ein timeout Objekt zu Ihrer Konfiguration hinzufügen:

axe: {
  timeout: {
    flush: 10000
  }
}

Siehe Timeouts festlegen für Informationen zur Verwendung von Timeouts.

Siehe Timeouts Schnittstelle und timeouts für weitere Informationen. Die Standard-Timeout-Werte sind in der Tabelle unter der Timeouts Schnittstelleaufgeführt.

Ergebnisse erscheinen nicht

Wenn Sie Ihre Testsuite ausgeführt haben und in axe Developer Hub keine Ergebnisse für ein bestimmtes Projekt angezeigt werden, könnte die Ursache unter den folgenden Abschnitten zu finden sein:

axe Watcher nicht konfiguriert

Ihre modifizierte Testsuite muss die entsprechende Konfigurationsfunktion für Ihr Testframework aufrufen, bevor Sie Ihre Tests durchführen. Wenn Sie axe Watcher nicht richtig konfigurieren, erhalten Sie eine Nachricht, dass Sie axe Watcher konfigurieren müssen. Zum Beispiel, wenn Sie vergessen, axe Watcher mit Cypress zu konfigurieren, werden Sie diese Nachricht sehen, wenn Sie Ihre Testsuite ausführen:

Cypress is not configured for axe Watcher. Please ensure that axe Watcher's cypressConfig() is invoked within Cypress's defineConfig() in your cypress.config.js. All tests will fail with this error.

Konsultieren Sie die Konfigurations- Anweisungen für Beispielkonfigurationen für Ihre Sprache und Ihr Browser-Testframework.

Ergebnisse nicht freigeben

Sie müssen die flush() Funktion (oder den benutzerdefinierten Befehl axeWatcherFlush() in Cypress) aufrufen, um die gesammelten Ergebnisse zurück an die Server von Deque zu senden, damit die Ergebnisse auf der axe Developer Hub-Website präsentiert werden können. Normalerweise rufen Sie die flush() Funktion im Bereinigungshook Ihrer Automatisierungsplattform auf.

Zum Beispiel, im support/e2e.js-Datei in Cypress fügen Sie den Aufruf zu afterEach():

// Flush axe-watcher results after each test.
afterEach(() => {
  cy.axeWatcherFlush()
})

Verwendung der Option --incognito

Sie können die --incognito -Kommandozeilenoption nicht mit Chrome verwenden; andernfalls schlagen Ihre Tests unbemerkt fehl. Wenn Sie den Inkognito-Modus verwenden, um zu vermeiden, dass zwischengespeicherte Dateien auf die Festplatte geschrieben werden (zwischengespeicherte Dateien werden im Inkognito-Modus nur im Speicher gehalten), verwenden Sie stattdessen die Caching-Methoden Ihrer Test-Suite.

Die erforderlichen Umgebungsvariablen nicht setzen

Wenn Sie mit den Beispielen im watcher-examples-Repo auf GitHubexperimentieren, beachten Sie, dass die Beispiele Umgebungsvariablen zum Setzen des API-Schlüssels und der Projekt-ID verwenden, API_KEY und PROJECT_ID.

Test läuft zu schnell

Ihre Tests könnten zu schnell laufen, wodurch die Seite entladen und ihre Ressourcen freigegeben werden, bevor Watcher sie analysieren kann. Um dieses Problem zu beheben, können Sie am Ende des Tests eine Verzögerung einfügen, damit genügend Zeit zur Analyse der Seite bleibt.

Zum Beispiel können Sie in Cypress eine Verzögerung von 10 Sekunden (10.000 Millisekunden) mit der cy.wait() -Methode hinzufügen:

describe('Visitor', () => {
  it('should visit example.com', () => {
    cy.visit('https://www.example.com')
    cy.wait(10000);  })
})

Fehlender oder ungültiger API-Schlüssel

Ein ungültiger oder fehlender API-Schlüssel erscheint als ungültige Konfigurationsdatei in Cypress. Der Stack-Trace zeigt, ob er ungültig oder fehlend ist. Ein fehlender Schlüssel führt zu Folgendem:

AssertionError [ERR_ASSERTION]: API key is required
    at validateApiKey ...

(Viele Zeilen des Stack-Traces wurden der Kürze halber gelöscht.)

Ein ungültiger Schlüssel führt zu folgendem Stack-Trace (gekürzt):

Error: Server responded to https://axe.deque.com/api/api-keys/test/validate/axe-devtools-watcher with status code 404:
{"error":"Invalid API key"}
    at Response.getBody
...

Hilfe

Wenn Sie Ihr Problem nicht lösen können, mailen Sie uns , damit wir Ihnen helfen können.