Skip to content

Commit

Permalink
feat: added checkForViolations & typings
Browse files Browse the repository at this point in the history
  • Loading branch information
benmonro committed Jun 12, 2020
1 parent 2f64185 commit c3b6600
Show file tree
Hide file tree
Showing 7 changed files with 127 additions and 28 deletions.
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
node_modules
.idea
*.lock
*.lockyarn.lock
16 changes: 11 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,24 @@
# axe-testcafe
# @testcafe-community/axe
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
yarn add -D axe-core @testcafe-community/axe
```

## How to use

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

Add the following clientScript in your testcafe config:

```js
"clientScripts":[{"module":"axe-core/axe.min.js"}]
```

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

fixture `TestCafe tests with Axe`
.page `http://example.com`;
Expand All @@ -25,11 +31,11 @@ test('Automated accessibility testing', async t => {

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)
![Accessibility errors](https://github.com/helen-dikareva/@testcafe-community/axe/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.
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 () => {
Expand Down
4 changes: 2 additions & 2 deletions index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ declare module 'axe-testcafe' {
import 'testcafe';

export function axeCheck(
t: TestController,
context?: ElementContext,
options?: {
runOnly?: RunOnly;
Expand All @@ -14,5 +13,6 @@ declare module 'axe-testcafe' {
}
): Promise<AxeResults>;


export function createReport(violations: Result[]): string;
}
}
22 changes: 9 additions & 13 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,7 @@ const fs = require('fs');
const path = require('path');
const { ClientFunction } = require('testcafe');
const { red, green, reset } = require('chalk');

const AXE_DIR_PATH = path.dirname(require.resolve('axe-core'));
const AXE_SCRIPT = fs.readFileSync(path.join(AXE_DIR_PATH, 'axe.min.js'), 'utf8');

const hasAxe = ClientFunction(() => !!(window.axe && window.axe.run));

const injectAxe = ClientFunction(() => eval(AXE_SCRIPT), { dependencies: { AXE_SCRIPT } });
const {t} = require('testcafe');

const runAxe = ClientFunction((context, options = {}) => {
return new Promise((resolve) => {
Expand Down Expand Up @@ -41,19 +35,21 @@ const createReport = violations => {

};

const axeCheck = async (t, context, options) => {
const hasScript = await hasAxe.with({ boundTestRun: t })();
if (!hasScript)
await injectAxe.with({ boundTestRun: t })();

const axeCheck = async (context, options) => {
try {
return await runAxe.with({ boundTestRun: t })(context, options);
} catch (e) {
return { error: e };
}
};

const checkForViolations = ({numAllowed=0,context,options}) => {
const {violations} = await axeCheck(context, options);

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

module.exports = {
axeCheck,
createReport
};
};
18 changes: 11 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
{
"name": "axe-testcafe",
"version": "3.0.0",
"name": "@testcafe-community/axe",
"version": "0.0.0",
"description": "The TestCafe module that allows you to use the aXe accessibility engine in TestCafe tests",
"main": "index.js",
"typings": "index.d.ts",
"repository": {
"type": "git",
"url": "https://github.com/helen-dikareva/axe-testcafe"
"url": "https://github.com/testcafe-community/axe"
},
"engines": {
"node": ">=8.9.0"
Expand All @@ -17,20 +17,24 @@
"test",
"accessibility"
],
"author": "Helen Dikareva ([email protected])",
"author": "Helen Dikareva ([email protected]), Ben Monro ([email protected])",
"license": "MIT",
"bugs": {
"url": "https://github.com/helen-dikareva/axe-testcafe/issues"
"url": "https://github.com/testcafe-community/axe/issues"
},
"homepage": "https://github.com/helen-dikareva/axe-testcafe",
"homepage": "https://github.com/testcafe-community/axe",
"files": [
"index.js"
"index.js",
"index.d.ts"
],
"peerDependencies": {
"axe-core": ">=2.2.3 <4",
"testcafe": "*"
},
"dependencies": {
"chalk": "^2.4.1"
},
"devDependencies": {
"axe-core": "^3.5.4"
}
}
40 changes: 40 additions & 0 deletions workflows/nodejs.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions

name: Node.js CI

on:
push:
branches: [ master ]
pull_request:
branches: [ master ]

jobs:
build:

runs-on: ubuntu-latest

strategy:
matrix:
node-version: [10.x, 12.x, 14.x]

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node-version }}
- run: yarn install --frozen-lockfile
release:
runs-on: ubuntu-latest
needs: build
steps:
- uses: actions/setup-node@v1
with:
node-version: 12
- uses: actions/checkout@v1
- run: yarn install --frozen-lockfile
- run: npx semantic-release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
53 changes: 53 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1


ansi-styles@^3.2.1:
version "3.2.1"
resolved "https://npme.walmart.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
integrity sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==
dependencies:
color-convert "^1.9.0"

axe-core@^3.5.4:
version "3.5.4"
resolved "https://npme.walmart.com/axe-core/-/axe-core-3.5.4.tgz#5a7b49ba8c989cd59cde219810ccfb0b7cf72e97"
integrity sha512-JRuxixN5bPHre+815qnyqBQzNpRTqGxLWflvjr4REpGZ5o0WXm+ik2IS4PZ01EnacWmVRB4jCPWFiYENMiiasA==

chalk@^2.4.1:
version "2.4.2"
resolved "https://npme.walmart.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
dependencies:
ansi-styles "^3.2.1"
escape-string-regexp "^1.0.5"
supports-color "^5.3.0"

color-convert@^1.9.0:
version "1.9.3"
resolved "https://npme.walmart.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
dependencies:
color-name "1.1.3"

[email protected]:
version "1.1.3"
resolved "https://npme.walmart.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=

escape-string-regexp@^1.0.5:
version "1.0.5"
resolved "https://npme.walmart.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=

has-flag@^3.0.0:
version "3.0.0"
resolved "https://npme.walmart.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0=

supports-color@^5.3.0:
version "5.5.0"
resolved "https://npme.walmart.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
dependencies:
has-flag "^3.0.0"

0 comments on commit c3b6600

Please sign in to comment.