https://github.com/helen-dikareva/axe-testcafe

The helper for using Axe in TestCafe tests
https://github.com/helen-dikareva/axe-testcafe

accessibility axe e2e end-to-end-testing functional-testing test testcafe testing-tools web-accessibility

Last synced: 21 days ago
JSON representation

The helper for using Axe in TestCafe tests

• Host: GitHub
• URL: https://github.com/helen-dikareva/axe-testcafe
• Owner: helen-dikareva
• Created: 2017-06-06T14:36:14.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-06-11T23:55:47.000Z (over 4 years ago)
• Last Synced: 2024-10-01T18:10:10.716Z (4 months ago)
• Topics: accessibility, axe, e2e, end-to-end-testing, functional-testing, test, testcafe, testing-tools, web-accessibility
• Language: JavaScript
• Size: 64.5 KB
• Stars: 36
• Watchers: 8
• Forks: 13
• Open Issues: 6
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# axe-testcafe

The TestCafe module that allows you to use the [aXe](https://github.com/dequelabs/axe-core) accessibility engine in TestCafe tests.

## Installation

```bash

npm install axe-core axe-testcafe --save-dev

```

## How to use

You can write a TestCafe test with automated accessibility checks like this.

```js

import { axeCheck, createReport } from 'axe-testcafe';

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));

});

```

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

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

## aXe options

The `axe-testcafe` 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));

});