Skip to main content

Axe Tools

Axe Tools is a free Chrome / Firebox / Edge extension for testing Accessibility. It also has a paid "pro" option. Axe is often used to test accessibility for Ionic applications whether they are targeted for Native or Web.

A Visual Studio Code Extension is also available which will highlight issues as you are editing.

Installing

You can Install the extension in Google Chrome or Microsoft Edge.

Usage

The Axe DevTools can be accessed by:

  • Pressing F12 in the browser (or pressing command + option + i) to open Dev Tools
  • Click the Axe DevTools tab

When viewing your Ionic application in the browser it will report any accessibility issues as shown below.

Axe screenshot

This guide contains examples of many fixes for common accessibility issues that are also found with Axe.

Keep in mind that not all issues reported by Axe need to be fixed and you should use tools such as VoiceOver and TalkBack to test accessibility to ensure that the issue you are attempting to fix is a real issue.

Axe was also found to identify 57% of accessibility issues so it is not an all encompassing solution to accessibility.