diff --git a/README.md b/README.md index d04d295..7b42925 100644 --- a/README.md +++ b/README.md @@ -25,7 +25,7 @@ fixture `TestCafe tests with Axe` test('Automated accessibility testing', async t => { // do stuff on your page - await checkForViolations(); + await checkForViolations(t); }); ``` @@ -38,26 +38,11 @@ If any accessibility issues are found, you will see a detailed report in the err The `@testcafe-community/axe` module allows you to define the `context` and `options` [axe.run parameters](https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#api-name-axerun) in a TestCafe test. ```js -test('Automated accessibility testing', async () => { +test('Automated accessibility testing', async (t) => { const context = { exclude: [['select']] }; const options = { rules: { 'html-has-lang': { enabled: false } } }; - await checkForViolations({context, options}); -}); -``` - -## Additional features - -By default `checkForViolations` does not allow any violations, but if you want more fine grained control -there are a couple options. First, you can pass in `numAllowed` which will only fail the test if the -number of violations exceeds that number. Secondly, `checkViolations` returns the list of violations from -axe-core so you can inspect it if needed. - -```js -test('Automated accessibility testing', async () => { - const {violations} = await checkForViolations({numAllowed:2}); - - // do stuff with violations. + await checkForViolations(t, context, options); }); ``` diff --git a/index.d.ts b/index.d.ts index ef8f2a2..b4dc6d8 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,8 +1,8 @@ -declare module 'axe-testcafe' { +declare module '@testcafe-community/axe' { import { ElementContext, RunOnly, AxeResults, Result } from 'axe-core'; - import 'testcafe'; export function axeCheck( + t: TestController, context?: ElementContext, options?: { runOnly?: RunOnly; @@ -13,6 +13,17 @@ declare module 'axe-testcafe' { } ): Promise; - export function createReport(violations: Result[]): string; + + export function checkForViolations( + t: TestController, + context?: ElementContext, + options?: { + runOnly?: RunOnly; + rules?: Object; + iframes?: Boolean; + elementRef?: Boolean; + selectors?: Boolean; + } + ): never; } diff --git a/index.js b/index.js index e6dd4db..9c07aeb 100644 --- a/index.js +++ b/index.js @@ -1,8 +1,5 @@ -const fs = require('fs'); -const path = require('path'); const { ClientFunction } = require('testcafe'); const { red, green, reset } = require('chalk'); -const {t} = require('testcafe'); const runAxe = ClientFunction((context, options = {}) => { return new Promise((resolve) => { @@ -18,24 +15,23 @@ const createReport = violations => { } const report = violations.reduce((acc, { nodes, help }, i) => { + acc += red(`${i + 1}) ${help}\n`); - acc += red(`${i+1}) ${help}\n`); - acc += reset(nodes.reduce((e, { target }) => { const targetNodes = target.map((t) => `"${t}"`).join(', '); e += `\t${targetNodes}\n`; return e; - },'')); + }, '')); return acc; }, red(`${violations.length} violations found:\n`)); return reset(report); - + }; -const axeCheck = async (context, options) => { +const axeCheck = async (t, context, options) => { try { return await runAxe.with({ boundTestRun: t })(context, options); } catch (e) { @@ -43,15 +39,14 @@ const axeCheck = async (context, options) => { } }; -const checkForViolations = ({numAllowed=0,context,options}) => { - const {violations} = await axeCheck(context, options); - - await t.expect(violations.length <= numAllowed).ok(createReport(violations)); +const checkForViolations = async (t, context, options) => { + const { violations = [] } = await axeCheck(t, context, options); - return {violations}; + await t.expect(violations.length === 0).ok(createReport(violations)); } module.exports = { axeCheck, - createReport + createReport, + checkForViolations };