Comment résoudre les problèmes

Watcher ne prend en charge que Chrome

Bien que le site Web axe Developer Hub prenne en charge plusieurs navigateurs, le package @axe-core/watcher ne prend en charge que Google Chrome. Si vous essayez d'utiliser le navigateur Electron de Cypress pour effectuer des tests, par exemple, vous recevrez une erreur. Consultez System Requirements pour plus d'informations sur les logiciels pris en charge avec axe Developer Hub et @axe-core/watcher.

Exécuteurs de tests parallèles

Si votre suite de tests utilise plusieurs exécuteurs de tests qui s'exécutent en parallèle, vous devez vous assurer que chaque exécuteur de tests utilise le même buildID non-nul. Dans le cas contraire, les résultats de chaque exécuteur de test écraseront les résultats des autres exécuteurs de test pour le même commit SHA.

Vous définissez généralement buildID dans l' AxeConfiguration de votre suite de tests. Pour plus d'informations sur l'utilisation d'exécuteurs de tests parallèles avec différentes plates-formes CI/CD, consultez buildID dans la Référence API.

Erreurs d'accessibilité en double ou nouveaux problèmes : le nombre est erroné

Si votre site Web utilise des identifiants dynamiques ou des noms de classe qui changent à chaque actualisation de la page, vous verrez probablement des erreurs d'accessibilité en double, en particulier des problèmes marqués comme nouveaux lorsque les tests précédents présentent le même problème sur le même élément. (Axe Developer Hub utilise des identifiants et des classes pour identifier le même élément entre les exécutions de test.) Pour résoudre ce problème, vous devez définir la propriété ancestry dans l'objet runOptions de votre configuration sur vrai. L'exemple ci-dessous montre comment définir l'option dans votre configuration :

axe: {
  runOptions: {
    ancestry: true
  }
}

Voir runOptions pour plus d'informations.

Ancienne version de @axe-core/watcher

Si vous utilisez la version 3.18.0 ou une version antérieure de @axe-core/watcher, vous recevrez ce message d'avertissement :

Axe Developer Hub adhère désormais aux paramètres définis dans axe Configuration, et les exécutions de tests créées par les versions de @axe-core/watcher version 3.18.0 ou antérieures génèrent des sessions qui n'étaient pas au courant des paramètres globaux dans axe Configuration. Vous devez mettre à jour votre package @axe-core/watcher et réexécuter vos tests pour créer des sessions qui suivent la configuration axe de votre entreprise. Voir Utilisation des configurations globales.

Délai d'expiration de la méthode du contrôleur

Vous recevrez un message similaire au suivant si les appels aux méthodes du contrôleur (définies dans la Controller classe de base abstraite comme analyze(), flush(), start() et stop()) ou aux commandes personnalisées Cypress expirent :

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/dh-troubleshooting for more troubleshooting.

La méthode spécifiée Controller (ici, la méthode flush ()) a nécessité plus de temps que le temps par défaut pour se terminer et a expiré. Vous pouvez modifier le temps par défaut en ajoutant un timeout objet à votre configuration :

axe: {
  timeout: {
    flush: 10000
  }
}

Voir Timeouts Interface et timeouts pour plus d'informations. Les valeurs de délai d'expiration par défaut sont affichées dans le tableau sous l'interface Timeouts(dh-api-reference#timeouts-interface).

Les résultats n'apparaissent pas

Si vous avez exécuté votre suite de tests et qu'aucun résultat n'apparaît dans axe Developer Hub pour un certain projet, la cause peut être trouvée parmi les raisons décrites dans les sections suivantes :

Ne pas configurer axe Watcher

Votre suite de tests modifiée doit appeler la fonction de configuration appropriée pour votre framework de test avant d'exécuter vos tests. Si vous ne configurez pas correctement @axe-core/watcher, il peut être difficile d'identifier ce problème. Par exemple, vous pourriez rencontrer un problème tel que l’un des suivants :

1. Votre suite de tests pourrait échouer avec une erreur de promesse non renvoyée.
2. Votre suite de tests pourrait échouer silencieusement.
3. Votre suite de tests pourrait expirer.

Consultez les [instructions] de configuration(dh-watcher-intro#instructions-for-modifying-your-test-suite) pour des exemples de configuration pour votre langage et votre framework de test de navigateur.

Résultats non transmis

Vous devez appeler la fonction flush() (ou la commande personnalisée axeWatcherFlush() dans Cypress) pour renvoyer les résultats collectés aux serveurs de Deque afin que les résultats puissent être présentés sur le site Web axe Developer Hub. Habituellement, vous appelez la fonction flush() dans le hook de nettoyage de votre plateforme d'automatisation.

Par exemple, dans le fichier support/e2e.js de Cypress, vous ajoutez l'appel à afterEach() :

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

Utilisation de l'option --incognito

Vous ne pouvez pas utiliser l'option de ligne de commande --incognito avec Chrome ; sinon, vos tests échoueront silencieusement. Si vous utilisez le mode navigation privée pour éviter d'écrire des fichiers mis en cache sur le disque (les fichiers mis en cache sont conservés en mémoire uniquement en mode navigation privée), utilisez plutôt les méthodes de mise en cache de votre suite de tests.

Non définition de la variable d'environnement requise

Les exemples dans l'axe Developer Hub référentiel d'exemples sur GitHub utilisent une variable d'environnement pour définir la clé API, API_KEY.

Vous pouvez définir la clé API dans l'environnement ou la spécifier sur la ligne de commande lors de l'exécution des tests.

Exécution trop rapide du test

Vos tests peuvent s'exécuter trop rapidement, déchargeant la page et libérant ses ressources avant que Watcher ne puisse l'analyser. Pour résoudre ce problème, vous pouvez ajouter un délai à la fin du test pour laisser le temps d'analyser la page.

Par exemple, dans Cypress, vous pouvez ajouter un délai de 10 secondes (10 000 millisecondes) avec la méthode cy.wait() :

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

Clé API manquante ou non valide

Une clé API non valide ou manquante apparaît comme un fichier de configuration non valide dans Cypress. La trace de la pile révélera si elle est invalide ou manquante. Une ** clé manquante entraîne les conséquences suivantes :**

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

(De nombreuses lignes de la trace de la pile ont été supprimées par souci de concision.)

Une ** clé non valide génère la trace de pile suivante (raccourcie) :**

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
...

Aide

Si vous ne parvenez pas à résoudre votre problème, veuillez nous envoyer un e-mail afin que nous puissions vous aider.