Écrire des tests Selenium
Utiliser axe DevTools Java Selenium
Cette configuration d'axe DevTools n'est intrinsèquement liée à aucune bibliothèque d'assertions. Cela permet des tests d'accessibilité simples ainsi qu'une personnalisation complète des tests et une utilisation avec des assertions personnalisées.
Prérequis
Afin d'utiliser axe DevTools Java Selenium et de produire des résultats avec celui-ci, vous devez avoir déjà créé un fichier de test avec axe DevTools et avoir votre choix de Selenium WebDriver importé et initialisé. Si vous n'avez pas terminé cette étape, lisez d'abord ce guide pour savoir comment procéder.
Exécuter une analyse
Avec cette configuration, l’exécution d’une analyse d’accessibilité de base ne nécessite que trois lignes de code. Dans votre fichier de test, remplacez <URL> Avec l'adresse web de la page que vous souhaitez tester. Les résultats de l'analyse sont enregistrés dans la variable results
webdriver.get("<URL>");
Results results = axeSelenium.run(axedriver);
webdriver.quit();
Utilisation des résultats de l'analyse
Une fois l'analyse exécutée, vous voudrez peut-être faire quelque chose avec les résultats. L'option la plus simple est d'imprimer les résultats sur la console.
System.out.print(results);
Vous pouvez également utiliser les résultats pour vérifier les violations d’accessibilité. La façon la plus simple de procéder est d'utiliser une déclaration comme celle-ci :
if (!results.violationFree()) {
//do something, like throw an exception
}
Pour plus d'informations sur la façon d'utiliser l'objet de résultats pour écrire des tests personnalisés, consultez la page sur l'utilisation des résultats.
Exemple de fichier de test
Ce fichier de test fonctionne avec les mêmes blocs de construction abordés dans importer et initialiser ainsi que le guide de rédaction des tests sur cette page.
import com.deque.html.axedevtools.selenium.*;
import com.deque.html.axedevtools.selenium.results.*;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
public class Example {
public static void main(final String[] args) {
AxeSelenium axeselenium = new AxeSelenium();
WebDriver webdriver = new ChromeDriver();
AxeDriver axedriver = new AxeDriver(wd);
webdriver.get("<URL>");
Results results = axeselenium.run(axedriver);
webdriver.quit();
if (!results.violationFree()) {
int violationCount = results.getViolations().size();
System.out.printf("Found %d violations!\n", violationCount);
System.exit(1);
}
System.out.println("No violations found!");
}
}
Dans cet exemple, Chrome et ChromeDriver sont utilisés. Cela peut être remplacé par n'importe quel autre driver de navigateur et navigateur Selenium. Si ce fichier de test détecte des problèmes d'accessibilité, il imprime le nombre de violations détectées et quitte avec le code d'état 1 (erreur). Pour utiliser ce fichier de test dans votre propre environnement, vous devrez ajouter une URL à la ligne
webdriver.get("<URL>");
Références supplémentaires
En plus de l'utilisation de base décrite ci-dessus, axe DevTools Java Selenium fournit plusieurs méthodes de chaînage pour modifier la manière dont l'analyse est exécutée. Ces méthodes peuvent modifier la portée et les règles de l'analyse selon n'importe quelle configuration souhaitée. Par défaut, la page entière est analysée et vérifiée pour détecter les violations d'accessibilité conformément aux directives WCAG 2.0 niveau AA. Il est important de noter que les appels ultérieurs à la méthode run écraseront toutes les préférences des méthodes de chaîne ci-dessous. Les modifications apportées à la portée ou aux règles ne persistent pas lors des balayages multiples utilisant ces méthodes appropriées.
Portée
Par défaut, la page entière est balayée. Cependant, axe DevTools prend en charge la possibilité d'analyser des parties spécifiques d'une page avec ses méthodes de délimitation de portée. Ces méthodes de délimitation modifient efficacement la « surface » de la page à balayer vers les zones cibles souhaitées. De plus, une méthode pour ignorer les violations est disponible. « Cibler » la page avec cette méthode ne réduit pas la zone d'analyse, mais ignorera les violations d'un type spécifié dans la zone spécifiée et analysera toujours la zone à la recherche d'autres violations potentielles. Toutes ces méthodes fonctionnent sur la base de zones de sélection CSS. La zone de chaque sélecteur CSS sur une page donnée peut être déterminée en utilisant le widget « inspecter l'élément » des outils de développement de votre navigateur.
Méthodes de portée
Comme expliqué ci-dessus, ces méthodes modifient efficacement la surface de la page à balayer. Il existe deux méthodes dans cette catégorie, une méthode « inclusive » et une méthode « exclusive ». Ils peuvent être mutuellement enchaînés les uns aux autres pour créer plusieurs enclaves et exclaves de surface de numérisation.
Portée - Y compris
La méthode de chaîne de portée incluse modifie le balayage pour qu'il s'exécute uniquement dans la zone de page spécifiée par les sélecteurs CSS qui lui sont transmis. Il existe plusieurs façons d'utiliser la méthode 'including' : scope unique, scope multiple, scope composé et scope IFrame.
Cette méthode peut être utilisée avec un seul selector comme suit :
axeselenium.including("#selector1").run(axedriver);
Cette analyse ne s'exécutera que dans le scope du selector 1
Vous pouvez configurer une analyse avec plusieurs scopes :
axeselenium.including("#selector1").including("#selector2").run(axedriver);
Cet appel analysera dans le scope du selector 1 et du selector 2. Ils peuvent être séparés par des virgules ou déclarés dans une clause 'including' distincte.
La portée composée peut être réalisée avec la syntaxe suivante :
axeselenium.including("#selector1 .selector2").run(axedriver);
Cette portée composée a pour résultat que seuls les éléments avec le sélecteur 2 dans le sélecteur 1 sont balayés. Ceci est configuré en ne séparant pas les sélecteurs par des virgules.
Afin de définir une portée dans un IFrame, un List<String>
élément peut être passé. La portée à analyser dans l'IFrame est transmise en tant que paramètre supplémentaire.
axeselenium.including(Arrays.asList(new String[] {"#frame1", "#selector1"})).run(axedriver);
Cette analyse s'exécute sur les éléments du sélecteur 1, qui se trouve à l'intérieur de l'IFrame 1.
Le ciblage dans plusieurs IFrames fonctionne de la même manière que la sélection multiple standard. Il vous suffit d'appeler à nouveau. including
axeselenium.including(Arrays.asList(new String[] {"#frame1", "#selector1"}))
.including(Arrays.asList(new String[] {"#frame2", "#selector2"})).run(axedriver);
Cette analyse s'exécute uniquement à l'intérieur du sélecteur 1 dans le cadre 1 et du sélecteur 2 dans le cadre 2.
Il est également possible de définir une portée au sein d'IFrames imbriquées :
axeselenium.including(Arrays.asList(new String[] {"#frame1", "#frame2", "#selector1"})).run(axedriver);
Cette analyse s'exécute dans le cadre du sélecteur 1 à l'intérieur du cadre 2, qui est lui-même à l'intérieur du cadre 1
Portée - Exclusion
En plus de la méthode de chaîne incluant, cette API dispose d'une méthode d'exclusion. Cette méthode modifie l'analyse de sorte que seuls les éléments en dehors de la portée spécifiée soient analysés. Sa configuration et son utilisation sont identiques à la méthode incluant, reportez-vous donc à la section ci-dessus pour plus de détails et d'exemples sur la façon dont elle peut être utilisée. Un détail important à retenir est que la méthode incluant et la méthode excluant peuvent être chaînées les unes avec les autres pour créer des portées complexes beaucoup plus simplement qu'en utilisant uniquement include ou exclude.
Cet exemple montre une telle manière d’associer les méthodes within et la méthode excluant :
axeselenium.including("#selector1").excluding("#selector2").run(axedriver);
Cette analyse s'exécute uniquement sur la partie de la page qui se trouve dans le sélecteur 1 et qui n'est pas aussi dans le sélecteur 2.
Portée - Ignorer les violations
La dernière méthode de chaîne liée à la portée est la méthode d'ignorance des résultats. Cette méthode ne modifie pas la portée globale de l’analyse, mais ignorera les violations d’un type spécifié dans une portée spécifiée. Cela fonctionne en passant les sélecteurs des éléments que vous souhaitez ignorer sous forme de tableau, couplés à la règle qu'ils violent.
axeselenium.ignoring("[\".sidebar\", \"#branded-content\"]", "color-contrast").run(axedriver);
Cette analyse ignorera les violations de contraste de couleur dans la section de la barre latérale et la section de contenu de marque.
Règles
Il existe trois façons de modifier la configuration de vos règles pour chaque analyse. Ces différentes méthodes permettent une granularité différente lors de la sélection d'une règle à tester. La méthode de ruleset la moins granulaire sélectionne un ruleset ou un groupe de règles plus large en fonction des normes d'accessibilité courantes. La méthode des ruleset standards légèrement plus granulaires, également connue sous le nom de tags, sélectionne les règles en fonction des domaines d'une norme d'accessibilité plus large dans lesquels elles se situent. Enfin, il existe trois options de configuration avec une règle à la fois. Ensemble, ces méthodes en chaîne vous permettent d’ajuster votre analyse pour exécuter précisément les règles souhaitées.
Pour plus d'informations sur les règles d'axe-core, visitez la page de présentation des règles.
Sélection de l'ensemble de règles
Cette méthode sélectionne les règles par leur association la plus agrégée : un ensemble de règles. Un jeu de règles est une collection de toutes les règles qui s'appliquent à une norme d'accessibilité à l'échelle d'un secteur. Jeux de règles pour WCAG 2.0, 2.1 et 2.2 ; section 508 de l'ADA ; trusted Tester v5 ; et EN 301 549. De plus, les règles de bonnes pratiques peuvent être activées avec un indicateur booléen.
Les jeux de règles sont souvent composés de plusieurs balises, qui sont des règles regroupées par des distinctions plus spécifiques. Par exemple, le wcag2
jeu de règles contient toutes les règles marquées wcag2a
WCAG 2.0 de niveau A, wcag2aa
WCAG 2.0 de niveau AA et wcag2aaa
WCAG 2.0 de niveau AAA.
Utilisez cette option lorsque vous souhaitez sélectionner un ensemble de règles non modifié.
axeselenium.forRuleset("wcag2.1").run(axedriver);
Cette analyse sera exécutée uniquement avec les règles WCAG 2.1.
Pour activer les règles de bonnes pratiques, utilisez la deuxième option de forRuleset
.
axeselenium.forRuleset("wcag2.1", true).run(axedriver);
Sélection standard
La méthode de chaînage de balises ou de normes d'accessibilité permet une granularité légèrement plus grande dans les ensembles de règles d'axe-core. Pour les règles basées sur WCAG, cette méthode vous permet de sélectionner uniquement les règles étiquetées simple-A ou double-A. Cette liste répertorie les noms de balises disponibles et leurs normes correspondantes.
Cette option est particulièrement utile lorsque vous testez uniquement une partie spécifique d'un ensemble de règles, par exemple, uniquement les règles de niveau A sous WCAG 2.0.
Nom de la balise | Norme d'accessibilité |
---|---|
wcag2a | WCAG 2.0 Niveau A |
wcag2aa | WCAG 2.0 Niveau AA |
wcag2aaa | WCAG 2.0 Niveau AAA |
wcag21a | WCAG 2.1 Niveau A |
wcag21aa | WCAG 2.1 Niveau AA |
wcag21aaa | WCAG 2.0 Niveau AAA |
wcag22a | WCAG 2.2 Niveau A |
wcag22aa | WCAG 2.2 Niveau AA |
wcag22aaa | WCAG 2.2 Niveau AAA |
section508 | Section 508 |
EN-301-549 | EN 301 549 |
TTv5 | Trusted Tester v5 |
best-practice | Bonnes pratiques endossées par Deque |
Bien qu'elles ne soient pas définies explicitement dans le cadre d'une quelconque norme d'accessibilité, nous proposons un certain nombre de règles que nous appelons « meilleures pratiques ». Bien que cela ne soit pas strictement nécessaire, tester avec ces règles aidera votre site Web à être aussi équitable que possible.
Une seule norme peut être sélectionnée comme suit :
axeselenium.accordingTo("wcag2a").run(axedriver);
Cette analyse s'exécutera uniquement avec les règles étiquetées sous WCAG 2.0 niveau A
De plus, plusieurs étiquettes peuvent être spécifiées pour sélectionner plusieurs normes d’accessibilité :
axeselenium.accordingTo("wcag2a", "section508").run(axedriver);
Ces analyses exécuteront à la fois les règles étiquetées sous WCAG 2.0 niveau A et ADA Section 508.
Sélection des règles
Enfin, vous pouvez modifier votre ensemble de règles en ajoutant ou en supprimant une seule règle. Pour plus d'informations sur les noms de toutes les règles d'axe-core et sur ce que chaque règle teste, consultez la documentation des descriptions des règles d'axe-core.
Ces méthodes fonctionnent bien lorsque votre groupe final de règles souhaité ne diffère d'un ensemble de règles ou d'une norme/balise existante que par quelques règles individuelles. Pour créer un ensemble de règles entièrement personnalisé, consultez nos options de règles personnalisées.
Vérification des règles supplémentaires
La méthode de chaîne de vérification vous permet d'ajouter des règles supplémentaires à tester en plus de votre ensemble de règles standard.
Cette méthode peut être utilisée pour vérifier une seule règle supplémentaire :
axeselenium.checking("label").run(axedriver);
où l'analyse est exécutée avec l'ensemble de règles par défaut en plus de la règle « étiquette ».
Il peut également être utilisé pour vérifier plusieurs règles supplémentaires de deux manières différentes :
axeselenium.checking("label", "tabindex").run(axedriver);
axeselenium.checking("label").checking("tabindex").run(axedriver);
où l'analyse est exécutée avec l'ensemble de règles par défaut en plus des règles « label » et « tabindex ».
Il peut également être utilisé pour ajouter une ou plusieurs règles à une balise spécifiée :
axeselenium.accordingTo("wcag2a").checking("tabindex").run(axedriver);
L'analyse est effectuée là où les règles WCAG 2.0 de niveau A sont testées, avec l'ajout de la règle « tabindex ».
Passer les règles
Similaire à la méthode de vérification, la méthode de saut change les règles par défaut qui doivent être utilisées par les règles spécifiées. Cependant, au lieu de l'ajouter à l'ensemble de règles, la méthode de saut supprime les règles spécifiées de celles utilisées pour tester la page. Sa configuration et son utilisation sont identiques à la méthode de vérification, reportez-vous donc à la section ci-dessus pour plus de détails et d'exemples sur la façon de l'utiliser. Un détail important à retenir est que les méthodes de vérification et de saut d'instruction peuvent être enchaînées les unes aux autres pour créer des ensembles de règles personnalisés beaucoup plus simplement qu'en utilisant uniquement les méthodes d'ignorance d'instruction ou de vérification.
axeselenium.accordingTo("wcag2a").checking("tabindex").skipping("label").run(axedriver);
Cet exemple montre un test d'analyse par rapport aux règles WCAG 2.0 de niveau A, avec l'ajout de la règle « tabindex » et la suppression de la règle « label ».
Vérification uniquement
La méthode de vérification uniquement vérifie uniquement les règles spécifiées. Toute règle non explicitement spécifiée ne sera pas incluse dans l'analyse.
Cette méthode de chaîne peut être utilisée pour spécifier une seule règle :
axeselenium.checkingOnly("tabindex").run(axedriver);
où l'analyse est exécutée avec uniquement la règle « tabindex ».
Il peut également être utilisé pour spécifier plusieurs règles de ces deux manières :
axeselenium.checkingOnly("label", "tabindex").run(axedriver);
axeselenium.checkingOnly("label").checkingOnly("tabindex").run(axedriver);
où l'analyse est exécutée avec uniquement les règles « label » et « tabindex ».
Désactivation des tests iframe
Sur les pages volatiles, les iframes peuvent causer des problèmes. Axe doit être injecté dans chaque cadre
Configuré de la même manière dans chaque iframe. Si des iframes sont ajoutés ou supprimés pendant que AxeSelenium::run
est
En testant votre page, il est possible que des exceptions soient levées ou qu'un comportement inattendu se produise. En tant que
Système de sécurité, AxeSelenium
expose une méthode pour désactiver toutes les interactions iframe AxeSelenium::disableIframeTesting
.
Lorsqu'il est activé, axe-core ne sera pas injecté dans les iframes de la page, ni exécuté dans lesdites iframes. Seule la page de niveau supérieur sera vérifiée.
Il peut être utilisé comme ceci :
axeselenium.disableIframeTesting().run(axedriver);
L'utilisation de cette méthode n'est pas recommandée. Il est toujours préférable d'attendre que votre page soit stable avant de la transmettre AxeSelenium::run
.
Service d'utilisation
Approfondissez votre compréhension des tendances d'utilisation d'axe DevTools au sein de votre organisation
Le service d'utilisation peut être configuré via des variables d'environnement ou des méthodes lors de l'exécution. Lorsque les deux sont utilisés, les valeurs des méthodes sont utilisées. Remarque : tous les champs de données de service d'utilisation ne peuvent pas être définis via des méthodes.
Par défaut, le service d'utilisation est désactivé et les résultats d'URL par défaut sont envoyés à https://usage.deque.com
.
Variables d'environnement
Cette méthode permet aux utilisateurs de modifier des valeurs spécifiques du service d'utilisation via des variables d'environnement
Variable d'environnement | Type | Description |
---|---|---|
AXE_IS_LOGGED_IN | Booléen | Si l'utilisateur est connecté à l'application testée |
AXE_KEYCLOAK_ID | Chaîne | L'identifiant keycloak de l'utilisateur connecté |
AXE_USER_ID | Chaîne | Le nom de l'utilisateur qui exécute le test |
AXE_SESSION_ID | Chaîne | Description de la séance de test |
AXE_STATUT_UTILISATEUR | Chaîne | Le statut de l'utilisateur |
AXE_RÔLE_TRAVAIL_UTILISATEUR | Chaîne | Le titre/rôle de la personne effectuant le test |
AXE_DISTINCT_ID | Chaîne | L'identifiant distinct d'un utilisateur individuel |
AXE_EST_INSTANCE_DEV | Booléen | Si l'application testée est dans une instance de développement |
AXE_ORGANISATION | Chaîne | L'organisation de l'utilisateur - organisant des données à l'échelle de l'entreprise |
AXE_APPLICATION | Chaîne | Le nom de l'application testée |
AXE_METRICS_URL | Chaîne | L'URL vers laquelle les données d'utilisation sont envoyées |
AXE_TRACK_USAGE | Booléen | Si les données d'utilisation sont capturées ou non |
Activer le suivi
Cette méthode permet aux utilisateurs d'accepter ou de refuser l'envoi de données au service d'utilisation
.enableTracking(boolean state)
Définir l'URL de suivi
Cette méthode permet aux utilisateurs de modifier l’endroit où les données des mesures d’utilisation sont envoyées. Par défaut à https://usage.deque.com
.setTrackingUrl(String url)
Définir un identifiant distinct
Cette méthode permet aux utilisateurs de modifier l'identifiant distinct stocké/utilisé
.setDistinctId(String distinctId)
Prochaines étapes
Une fois que vous écrivez des tests avec axe DevTools, lisez-en plus sur l'utilisation des résultats pour écrire des tests personnalisés plus détaillés, ou lisez sur l'utilisation du rapporteur pour générer des rapports sur les analyses d'accessibilité.
Dépannage
Si vous rencontrez des problèmes lors de la configuration de vos tests d'accessibilité, contactez directement votre représentant Deque, contactez-nous via notre service d'assistance ou envoyez-nous un e-mail. Nous sommes heureux de vous aider à démarrer vos efforts de tests d'accessibilité.