Screenshot of new and enhanced Intelligent Guided Testing UI showing multiple runs completed for the Keyboard IGT in the axe DevTools extension.

Axe DevTools Extension Updates: Test Your Whole Page With Multi-Run Intelligent Guided Testing

The new axe DevTools browser extension release enables users to more easily test a whole page by running the same Intelligent Guided Test (IGT) multiple times. Today, nearly every page on every website has at least some interactive elements, dynamic content, and usually more than one form or modal dialog. Testing all of these elements and saving the results used to require standing up entirely separate tests for each.

Now, users can test all of their page’s content within a single test run, saving tremendous time and effort and providing a single “window” view of all tests for complex pages! In addition, this release contains several UI enhancements that include relocating some controls.

What’s new

Enhanced results user interface (UI)

We made significant changes to the scan results screen. Watch this short demo video to check out what’s new in the extension.

  • New tabs for “Overview” and “Guided Tests”.

Screenshot of the new tabs for “Overview” and “Guided Tests” in the axe DevTools extension.

  • A “Toggle Collapse” button to expand/collapse the test summary section.

Screenshot of the new “Toggle Collapse” button in the axe DevTools extension that expands/collapses the test summary section.

  • The “highlight” toggle has been moved into the issue category accordion.
    • Before:

Screenshot of where the "highlight" feature was located prior to the latest release of the axe DevTools extension.

    • After:

Screenshot of where the "highlight" feature is now located after the latest release of the axe DevTools extension.

  • Issue categories have been moved into an accordion that expands to show all the issue details including the controls to “inspect”, view “more info”, and “share an issue”.
    • Before:

Screenshot of where "inspect", "more info" and "share issue" features were located prior to the latest release of the axe DevTools extension.

    • After:

Screenshot of where "inspect", "more info" and "share issue" features are now located with the latest release of the axe DevTools extension.

Testing multiple components or states

Before this release, users could only run a given IGT once per test. For example, if you wanted to test 2 modals, you would have to clear the results of the first modal to test the second or start a whole new test. This slowed down the testing process, making it harder for users to fully test pages and/or page states within a saved test. It also made it difficult to aggregate all the results for the page because they were in different saved tests.

Now, users can run the same IGT multiple times and keep the results of every run! This can be especially useful to break up testing into logical chunks (e.g. all the interactive elements in the navigation vs all the interactive elements in the main content) while also being able to track and/or export all the issues.

Screenshot of the Modal Dialog Intelligent Guided Test with 1 run in progress and 1 completed in the axe DevTools extension.

How to run an IGT multiple times:

  1. Navigate to an existing saved test or start a new scan and click “SAVE TEST”
  2. Click on the “Guided Tests” tab
  3. Find the desired IGT and click the start button (e.g. “Start Modal Dialog Run” for the Modal Dialog IGT)Screenshot of the Guided Test tab with "Stat Modal Dialog Run" highlighted in the axe DevTools extension.
  4. Start the IGT and either complete it or click “Save and quit” at any point in the IGT run
  5. The start button will stay active in that IGT so users can create a new run without having to clear out the existing one

Conclusion

Breaking up the testing of a complex page and testing multiple instances of components like dialogs and forms is now really easy, making your testing and the management of the results easier and more efficient!

To see a live demonstration of recent axe DevTools browser extension updates, join this webinar on September 22nd.

We’d love to hear your feedback on these new features. Please email HelpDesk@deque.com to share your thoughts.

If you’re not currently using axe DevTools Pro, sign up for your free trial today (no commitment required).

photo of Harris Schneiderman

About Harris Schneiderman

Harris Schneiderman is a web developer with a strong passion for digital equality. He works at Deque Systems as the Senior Product Manager of axe DevTools building awesome web applications. He wrote Cauldron (Deque's pattern library), Dragon Drop, and is the lead developer on axe DevTools Pro. When he is not at work, he still finds time to contribute to numerous open source projects.