From c3b6600c76193605525e5790d0a2297ae7c94172 Mon Sep 17 00:00:00 2001 From: Ben Monro Date: Thu, 11 Jun 2020 22:24:25 -0700 Subject: [PATCH] feat: added checkForViolations & typings --- .gitignore | 2 +- README.md | 16 ++++++++----- index.d.ts | 4 ++-- index.js | 22 ++++++++---------- package.json | 18 +++++++++------ workflows/nodejs.yml | 40 +++++++++++++++++++++++++++++++++ yarn.lock | 53 ++++++++++++++++++++++++++++++++++++++++++++ 7 files changed, 127 insertions(+), 28 deletions(-) create mode 100644 workflows/nodejs.yml create mode 100644 yarn.lock diff --git a/.gitignore b/.gitignore index 2e451ae..c10f3d6 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,3 @@ node_modules .idea -*.lock \ No newline at end of file +*.lockyarn.lock diff --git a/README.md b/README.md index b9138cf..d9ae3cc 100644 --- a/README.md +++ b/README.md @@ -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`; @@ -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 () => { diff --git a/index.d.ts b/index.d.ts index 08d6064..ef8f2a2 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3,7 +3,6 @@ declare module 'axe-testcafe' { import 'testcafe'; export function axeCheck( - t: TestController, context?: ElementContext, options?: { runOnly?: RunOnly; @@ -14,5 +13,6 @@ declare module 'axe-testcafe' { } ): Promise; + export function createReport(violations: Result[]): string; -} \ No newline at end of file +} diff --git a/index.js b/index.js index b964ae5..518c0a7 100644 --- a/index.js +++ b/index.js @@ -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) => { @@ -41,11 +35,7 @@ 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) { @@ -53,7 +43,13 @@ const axeCheck = async (t, context, options) => { } }; +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 -}; \ No newline at end of file +}; diff --git a/package.json b/package.json index 70cf49d..c5a4f6f 100644 --- a/package.json +++ b/package.json @@ -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" @@ -17,14 +17,15 @@ "test", "accessibility" ], - "author": "Helen Dikareva (elena.dikareva@devexpress.com)", + "author": "Helen Dikareva (elena.dikareva@devexpress.com), Ben Monro (ben.monro@gmail.com)", "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", @@ -32,5 +33,8 @@ }, "dependencies": { "chalk": "^2.4.1" + }, + "devDependencies": { + "axe-core": "^3.5.4" } } diff --git a/workflows/nodejs.yml b/workflows/nodejs.yml new file mode 100644 index 0000000..56f59cb --- /dev/null +++ b/workflows/nodejs.yml @@ -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 }} diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..1b8e18c --- /dev/null +++ b/yarn.lock @@ -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" + +color-name@1.1.3: + 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"