How to Troubleshoot Problems

Link to How to Troubleshoot Problems copied to clipboard

How to fix common problems that occur when using axe Developer Hub

Free Trial

Watcher Only Supports Chrome

Although the axe Developer Hub website supports several browsers, the @axe-core/watcher package only supports Google Chrome. If you try to use Cypress's Electron browser for testing, for instance, you will receive an error. See System Requirements for more information about supported software with axe Developer Hub and @axe-core/watcher.

Results Not Appearing

If you've run your test suite and no results are showing up in axe Developer Hub for a certain project, the cause could be found among the reasons in the following sections.

Failing to Flush Results

You need to call the flush() function (or the custom command axeWatcherFlush() in Cypress) to send the collected results back to Deque's servers so the results can be presented on the axe Developer Hub website. Usually, you call the flush() function in your automation platform's cleanup hook.

For example, in the support/e2e.js file in Cypress you add the call to afterEach():

// Flush axe-watcher results after each test.
afterEach(() => {
  cy.axeWatcherFlush()
})

Not Setting the Required Environment Variable

The samples in the axe Developer Hub sample repository on GitHub use an environment variable for setting the API key, API_KEY.

You can either set it in the environment or specify it on the command line when running tests.

Test Running Too Quickly

Your tests might run too quickly and unload the page and free up its resources before the page can be analyzed. To fix this problem, you can add a delay at the end of the test to allow time to analyze the page.

For example, in Cypress you can add a delay of 10 seconds (10,000 milliseconds) with the cy.wait() method:

describe('Visitor', () => {
  it('should visit example.com', () => {
    cy.visit('https://www.example.com')
    cy.wait(10000);  })
})

Missing or Invalid API Key

An invalid or missing API key appears as an invalid configuration file in Cypress. The stack trace will reveal whether it is invalid or missing. A missing key results in the following:

AssertionError [ERR_ASSERTION]: API key is required
    at validateApiKey ...

(Many lines of the stack trace were deleted for brevity.)

An invalid key results in the following stack trace (shorted):

Error: Server responded to https://axe.deque.com/api/api-keys/test/validate/axe-devtools-watcher with status code 404:
{"error":"Invalid API key"}
    at Response.getBody
...

Help

If you can't resolve your problem, please email us so we can help.