Axe est un moteur de test d'accessibilité pour les sites Web et autres interfaces utilisateur HTML. Il est rapide, sécurisé, léger et a été conçu pour s'intégrer de manière transparente à tout environnement de test existant afin que vous puissiez automatiser les tests d'accessibilité parallèlement à vos tests fonctionnels réguliers.
Inscrivez-vous aux actualités d'Axe pour obtenir les dernières nouvelles sur les fonctionnalités d'Axe, les futures versions et les événements.
Axe-core propose différents types de règles, pour les WCAG 2.0, 2.1, 2.2 aux niveaux A, AA et AAA, ainsi qu'un certain nombre de bonnes pratiques qui vous aident à identifier les pratiques d'accessibilité courantes, comme garantir que chaque page a un en-tête h1
, et pour vous aider. vous évitez les « pièges » dans ARIA, comme lorsqu'un attribut ARIA que vous avez utilisé sera ignoré. La liste complète des règles, regroupées par niveau WCAG et meilleures pratiques, se trouve dans doc/rule-descriptions.md.
Avec axe-core, vous pouvez trouver automatiquement en moyenne 57 % des problèmes WCAG . De plus, axe-core renverra les éléments comme « incomplets » alors qu'axe-core ne peut pas en être certain et qu'un examen manuel est nécessaire.
Pour détecter les bogues plus tôt dans le cycle de développement, nous vous recommandons d'utiliser l'extension axe-linter vscode. Pour améliorer encore davantage la couverture des tests, nous recommandons les tests guidés intelligents dans l'extension ax.
Téléchargez d'abord le package :
npm install axe-core --save-dev
Incluez maintenant le fichier javascript dans chacune de vos iframes dans vos appareils ou systèmes de test :
< script src =" node_modules/axe-core/axe.min.js " > script >
Insérez maintenant des appels à chaque point de vos tests où un nouvel élément d'interface utilisateur devient visible ou exposé :
axe
. run ( )
. then ( results => {
if ( results . violations . length ) {
throw new Error ( 'Accessibility issues found' ) ;
}
} )
. catch ( err => {
console . error ( 'Something bad happened:' , err . message ) ;
} ) ;
Le Web ne peut devenir un espace accessible et inclusif que si les développeurs sont habilités à assumer la responsabilité des tests d'accessibilité et des pratiques de codage accessibles.
Les tests d'accessibilité automatisés permettent un gain de temps considérable, ne nécessitent pas d'expertise particulière et permettent aux équipes de concentrer les ressources expertes sur les problèmes d'accessibilité qui en ont réellement besoin. Malheureusement, la plupart des outils d'accessibilité sont destinés à être exécutés sur des sites et des applications qui ont atteint la fin du processus de développement et ne donnent souvent pas de résultats clairs ou cohérents, provoquant frustration et retards au moment même où vous pensiez que votre produit était prêt à être expédié.
Axe a été conçu pour refléter le fonctionnement réel du développement Web. Il fonctionne avec tous les navigateurs, outils et environnements de test modernes qu'une équipe de développement peut utiliser. Avec axe, les tests d'accessibilité peuvent être effectués dans le cadre de vos tests unitaires, de vos tests d'intégration, de vos tests de navigateur et de tout autre test fonctionnel que votre équipe effectue déjà quotidiennement. L'intégration des tests d'accessibilité dès les premiers stades du processus de développement permet d'économiser du temps, des ressources et toutes sortes de frustrations.
L'API axe-core prend entièrement en charge les navigateurs suivants :
Le support signifie que nous corrigerons les bugs et tenterons de tester chaque navigateur régulièrement. Seuls Chrome et Firefox sont actuellement testés sur chaque pull request.
La prise en charge de JSDOM est limitée. Nous tenterons de rendre toutes les règles compatibles avec JSDOM, mais lorsque cela n'est pas possible, nous vous recommandons de désactiver ces règles. Actuellement, on sait que la règle color-contrast
ne fonctionne pas avec JSDOM.
Nous ne pouvons prendre en charge que les environnements dans lesquels les fonctionnalités sont soit prises en charge nativement, soit correctement remplies. Nous ne prenons pas en charge l’implémentation obsolète du Shadow DOM v0.
Le package API axe-core comprend :
axe.js
- le fichier JavaScript qui doit être inclus dans votre site Web en cours de test (API)axe.min.js
- une version minifiée du fichier ci-dessus Axe peut être construit en utilisant votre langue locale. Pour ce faire, un fichier de localisation doit être ajouté au répertoire ./locales
. Ce fichier doit être nommé de la manière suivante :
. Pour construire ax en utilisant ces paramètres régionaux, au lieu de ceux par défaut, exécutez ax avec l'indicateur --lang
, comme ceci :
grunt build --lang=nl
ou de manière équivalente :
npm run build -- --lang=nl
Cela créera une nouvelle version pour axe, appelée axe.
et axe.
. Si vous souhaitez créer toutes les versions localisées, transmettez simplement --all-lang
à la place. Si vous souhaitez créer plusieurs versions localisées (mais pas toutes), vous pouvez transmettre une liste de langues séparées par des virgules à l'indicateur --lang
, comme --lang=nl,ja
.
Pour créer une nouvelle traduction pour axe, commencez par exécuter grunt translate --lang=
. Cela créera un fichier json dans le répertoire ./locales
, contenant le texte anglais par défaut que vous pourrez traduire. Alternativement, vous pouvez copier ./locales/_template.json
. Nous acceptons toute localisation pour axe-core. Pour plus de détails sur la façon de contribuer, consultez la section Contribuer ci-dessous. Pour plus de détails sur la syntaxe du message, consultez Vérifier le modèle de message.
Pour mettre à jour un fichier de traduction existant, réexécutez grunt translate --lang=
. Cela ajoutera de nouveaux messages utilisés en anglais et supprimera les messages qui n'ont pas été utilisés en anglais.
De plus, les paramètres régionaux peuvent être appliqués au moment de l'exécution en passant un objet locale
à axe.configure()
. L'objet locale doit avoir la même forme que les locales existantes dans le répertoire ./locales
. Par exemple:
axe . configure ( {
locale : {
lang : 'de' ,
rules : {
accesskeys : {
help : 'Der Wert des accesskey-Attributes muss einzigartig sein.'
}
// ...
} ,
checks : {
abstractrole : {
fail : 'Abstrakte ARIA-Rollen dürfen nicht direkt verwendet werden.'
} ,
'aria-errormessage' : {
// Note: doT (https://github.com/olado/dot) templates are supported here.
fail : 'Der Wert der aria-errormessage ${data.values}` muss eine Technik verwenden, um die Message anzukündigen (z. B., aria-live, aria-describedby, role=alert, etc.).'
}
// ...
}
}
} ) ;
Axe-core prend en charge les paramètres régionaux suivants. Notez que puisque les locales sont fournies par notre communauté, il n'est pas garanti qu'elles incluent toutes les traductions nécessaires dans une version.
Axe-core propose une nouvelle version mineure tous les 3 à 5 mois, qui introduit généralement de nouvelles règles et fonctionnalités. Nous vous recommandons de prévoir du temps pour mettre à niveau vers ces versions. Des mises à jour de sécurité seront disponibles pour les lignes de versions mineures datant de 18 mois maximum .
DEQUE, DEQUELABS, AXE® et AXE-CORE® sont des marques commerciales de Deque Systems, Inc. L'utilisation des marques Deque doit être conforme à la politique des marques de Deque.
Reportez-vous à la prise en charge d'ARIA axe-core pour une liste complète des rôles et attributs pris en charge par ARIA par axe.
Lire le guide Proposer des règles Axe-core
Lire la documentation sur l'architecture
Lire la documentation sur la contribution
Liste des projets utilisant axe-core
Merci à Marat Dulin pour son implémentation de css-selector-parser qui est incluse pour la prise en charge du shadow DOM. Un autre merci aux implémenteurs de Slick Parser pour leur contribution, nous avons utilisé certains de leurs algorithmes dans notre code de support shadow DOM. Merci à Lea Verou et Chris Lilley pour leur bibliothèque colorjs.io que nous avons utilisée pour la conversion entre formats de couleurs.
Axe-core est distribué sous la licence publique Mozilla, version 2.0. Il est livré avec plusieurs dépendances distribuées selon leurs propres conditions. (Voir LICENSE-3RD-PARTY.txt)