Choosing a Node.js Integration

Axe DevTools for Web offers several Node.js and JavaScript packages. They all run the same accessibility rules and produce the same kind of results. What separates them is what a scan runs against, which follows from the kind of test you're writing:

• You render markup inside the test and want to scan it, as in a component or unit test. Use @axe-devtools/browser.
• Your test drives a browser to a page and you want to scan that page, as in an end-to-end test. Use the package for the tool that already drives your browser.

If you already know which package you need, go to Installation Options.

Scanning markup your test renders

The @axe-devtools/browser package is a JavaScript library loaded into the page your tests exercise. You initialize it once, then pass AxeDevTools.run() a DOM element to scan. Because it takes an element rather than a browser session, it suits test runners that render their own markup, such as Jasmine, Karma, or a testing library running under Jest.

Despite its name, @axe-devtools/browser is not an interactive tool or browser extension. It runs inside automated tests the same way the other packages do.

Karma

Karma isn't a separate integration. You write tests with @axe-devtools/browser, and add @axe-devtools/karma-json-reporter as a Karma plugin. The reporter writes a JSON file for each scan you log, and @axe-devtools/cli turns those files into reports after the test run.

Scanning pages your test navigates

If your test suite opens pages in a browser, choose the package that matches the tool already driving that browser. Each one adds accessibility scanning to the session your tests already have, so you don't need to change how your tests start the browser or reach the page.

Cypress is set up differently from the others. Instead of creating an Axe DevTools object around a driver, you register a plugin in cypress.config.js and import the package in your support file, which adds Axe DevTools commands to cy.

Cucumber

Cucumber isn't a separate integration either. Set up WebDriverJS, WebdriverIO, or Puppeteer first, then define reusable Gherkin steps that call it.

Reporting, logging, and Axe Developer Hub

These packages work alongside any of the integrations above, rather than replacing one:

• Node Reporter (@axe-devtools/reporter) generates reports from your saved results.
• Node Logger (@axe-devtools/logger) logs accessibility results as your tests run.
• Uploading Your Results to Axe Developer Hub explains how to send results to Axe Developer Hub.

Still not sure

If none of these matches how your tests work, contact your Deque representative, or ask through our support desk.