Automating accessibility: Running axe-core with webdriverIO

Introduction:

Axe is an accessibility testing engine for websites and other HTML-based user interfaces. It’s fast, secure, lightweight, and was built to seamlessly integrate with any existing test environment so you can automate accessibility testing alongside your regular functional testing.

Axe-core requires injection below script tag to all frames for evaluating content inside that frame

<script src=”node_modules/axe-core/axe.min.js”></script>

But luckily , the accessibility vendor Deque Systems supports and provides axe-core for all modern automation tools and frameworks that injects the script tag automatically and allow running accessibility testing as part of your automation scripts.

https://github.com/dequelabs/axe-core/blob/33b2bf4d4a1aa4bded13deac72f80a39d195bde5/doc/projects.md

Getting started:

1. Install @axe-core/webdriverio

Install https://www.npmjs.com/package/@axe-core/webdriverio

npm install @axe-core/webdriverio

2. Run your tests

WebdriverIO comes in two flavours, one is webdriverIO runner which is a framework that contains all integrations like service setup, reporting etc…