A11y test example for axe-puppeteer.

axe-report.js

const colors = require('colors');
const link = colors.underline.blue;
const error = colors.red.bold;

function selectorToString(selectors, separator) {
	separator = separator || ' '
	return selectors
		.reduce((prev, curr) => prev.concat(curr), [])
		.join(separator)
}

module.exports = function (results, verbose) {
  const cliReporter = function(...args) {
    console.log(...args)
  }

  const violations = results.violations
  if (violations.length === 0) {
    if (verbose) {
      cliReporter(colors.green('  0 violations found!'))
    }
    return
  }

  const issueCount = violations.reduce((count, violation) => {
    cliReporter(
      '\n' +
        '  Violation of %j with %d occurrences!\n' +
        '    %s. Correct invalid elements at:\n' +
        violation.nodes
          .map(node => '     - ' + selectorToString(node.target) + '\n')
          .join('') +
        '    For details, see: %s',
      violation.id,
      violation.nodes.length,
      violation.description,
      link(violation.helpUrl.split('?')[0])
    )
    return count + violation.nodes.length
  }, 0)

  cliReporter(error('\n%d Accessibility violations detected.'), issueCount)
}

test-a11y.js

const AxePuppeteer = require('axe-puppeteer').default
const puppeteer = require('puppeteer')
const reporter = require('./axe-report')

async function test() {
	const browser = await puppeteer.launch();
	const page = await browser.newPage();
	await page.setBypassCSP( true );

	await page.goto('https://dequeuniversity.com/demo/mars/');

	const results = await new AxePuppeteer(page).analyze();

	reporter(results)

	await browser.close();
}

test().catch(e => {console.log( e )});