Accessibility testing is used to ensure an application is accessible to those with disabilities. There are various tools available to help identify accessibility issues in your application. This post will talk about the Accessibility Inspector, a new tool introduced in Pega 8.1, and will also cover some external tools that we have found to be particularly useful while testing for our own accessibility problems.

Accessibility Inspector:
The Accessibility Inspector was built to highlight some of the common accessibility problems that can occur when building a Pega based application. It highlights issues, and provides helper text on how to fix the issues, in your Pega application.

The tool can be launched from the runtime toolbar, in your end user portals, which is available to users with developer access.

This tool uses the same JavaScript APIs as Live UI so it works in a similar fashion. You can highlight and select issues that appear in the tree and it will show you where the issue appears on the screen. Just like Live UI, you can open the rule that has the issue by clicking on the ‘open rule’ icon. You can also hover inside of your screen and it will only highlight items that have issues.

Issues are divided into two main categories: errors and warnings. Errors must be fixed in order for your application to be accessible, warnings are recommended to fix.

A menu option is available in the top right corner of the inspector that gives you additional options such as the ability to show a highlight around all issues or limit what shows up in the inspector tree to only show errors.

A ‘Disability preview’ tool is also available in the tool which applies a color blindness mask to your screen. This preview makes it easier to find any color contrast issues on your screen. Currently this preview only works in Chrome and Firefox due to browser restrictions.

It is recommended that you run this tool against every page in your available portals to help improve the accessibility of your application.

Browser Extensions:
There are various browser extensions available for generic web accessibility testing against WCAG accessibility criteria. The aXe extension (currently available for both Chrome and Firefox) is one that we use extensively at Pega.

Screen Readers:
If your application is required to be accessible you should always test with a screen reader. A screen reader will read off the content of the screen. It is important to test with a screen reader so that you can determine if the information that is being read off makes sense to an end user.

JAWS is a screen reader we use internally at Pega for testing. There are also many other popular screen readers out on the market including Window-Eyes, Dolphin Supernova and ZoomText

Considerations for Mobile Testing:
For mobile specific testing we recommend using a browser extension on a desktop machine against your portal.

For iOS devices you can activate VoiceOver and swipe through each item. Make sure each label is being read back in a way that gives a full context of what is happening. You should be able to see and visit the various areas of your application using the VoiceOver rotor. For Android testing you can use the TalkBack feature built into the Android Operating system.