Skip to content

Commit

Permalink
fix: return violations
Browse files Browse the repository at this point in the history
  • Loading branch information
benmonro committed Jun 12, 2020
1 parent 89dc5bf commit 511d073
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 9 deletions.
34 changes: 25 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,29 +18,45 @@ Add the following clientScript in your testcafe config:
```

```js
import { axeCheck, createReport } from '@testcafe-community/axe';
import { checkForViolations } from '@testcafe-community/axe';

fixture `TestCafe tests with Axe`
.page `http://example.com`;

test('Automated accessibility testing', async t => {
const { error, violations } = await axeCheck(t);
await t.expect(violations.length === 0).ok(createReport(violations));
// do stuff on your page
await checkForViolations();
});
```

If any accessibility issues are found, you will see a detailed report generated by the `createReport` function.
If any accessibility issues are found, you will see a detailed report in the error log.

![Accessibility errors](https://github.com/helen-dikareva/@testcafe-community/axe/blob/master/errors.png)
![Accessibility errors](https://github.com/testcafe-community/axe/blob/master/errors.png)

## aXe options

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 () => {
const axeContext = { exclude: [['select']] };
const axeOptions = { rules: { 'html-has-lang': { enabled: false } } };
const { error, violations } = await axeCheck(t, axeContext, axeOptions);
await t.expect(violations.length === 0).ok(createReport(violations));
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.
});
```
2 changes: 2 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,8 @@ const checkForViolations = ({numAllowed=0,context,options}) => {
const {violations} = await axeCheck(context, options);

await t.expect(violations.length <= numAllowed).ok(createReport(violations));

return {violations};
}

module.exports = {
Expand Down

0 comments on commit 511d073

Please sign in to comment.