axe-playwright 1.1.11 → 1.2.1

package/README.md

@@ -6,7 +6,7 @@
 [![NPM release](https://img.shields.io/npm/v/axe-playwright.svg 'NPM release')](https://www.npmjs.com/package/axe-playwright)
 [![NPM Downloads](https://img.shields.io/npm/dt/axe-playwright.svg?style=flat-square)](https://www.npmjs.com/package/axe-playwright)
 
-[Axe](https://www.deque.com/axe/) is an accessibility testing engine for websites and other HTML-based user interfaces. This package provides simple axe analyser commands which you can incorporate in your [Playwright](https://www.npmjs.com/package/playwright) tests.The idea is highly inspired by [Andy Van Slaars](https://github.com/avanslaars) cypress-axe project.
+[Axe](https://www.deque.com/axe/) is an accessibility testing engine for websites and other HTML-based user interfaces. This package provides simple axe analyser commands which you can incorporate in your [Playwright](https://www.npmjs.com/package/playwright) tests.
 
 ## Install and configure
 
@@ -95,11 +95,11 @@ The `page` instance of `playwright`.
 
 Defines the scope of the analysis - the part of the DOM that you would like to analyze. This will typically be the document or a specific selector such as class name, ID, selector, etc.
 
-##### options (optional)
+##### axeOptions (optional)
 
 Set of options passed into rules or checks, temporarily modifying them. This contrasts with axe.configure, which is more permanent.
 
-The keys consist of [those accepted by `axe.run`'s options argument](https://www.deque.com/axe/documentation/api-documentation/#parameters-axerun) as well as custom `includedImpacts`, `detailedReport`, and `detailedReportOptions` keys.
+The keys consist of [those accepted by `axe.run`'s options argument](https://www.deque.com/axe/documentation/api-documentation/#parameters-axerun) as well as custom `includedImpacts`, `detailedReport`, `verbose`, and `detailedReportOptions` keys.
 
 The `includedImpacts` key is an array of strings that map to `impact` levels in violations. Specifying this array will only include violations where the impact matches one of the included values. Possible impact values are "minor", "moderate", "serious", or "critical".
 
@@ -116,14 +116,21 @@ The `detailedReport` key is a boolean whether to print the more detailed report
 }
 ```
 
+The `verbose` key is a boolean to whether to print the message `No accessibility violations detected!` when there aren't accessibility violations present in the test. For the `DefaultTerminalReporter` this is true and for the `v2 Reporter` this is false.
+
 ##### reporter (optional)
 
-A class instance that implements the `Reporter` interface. Custom reporter instances can be supplied to override default reporting behaviour dictated by `DefaultTerminalReporter`.
+A class instance that implements the `Reporter` interface or values `default` and `v2`. Custom reporter instances can be supplied to override default reporting behaviour dictated by `DefaultTerminalReporter` set by the value `default`. `v2` is the new TerminalReporter inspired by the reports from [jest-axe](https://github.com/nickcolley/jest-axe).
 
 ##### skipFailures (optional, defaults to false)
 
 Disables assertions based on violations and only logs violations to the console output. If you set `skipFailures` as `true`, although accessibility check is not passed, your test will not fail. It will simply print the violations in the console, but will not make the test fail.
 
+##### options (dedicated for axe-html-reporter)
+
+Options dedicated for HTML reporter. 
+[axe-html-reporter](https://www.npmjs.com/package/axe-html-reporter)
+
 ### getAxeResults
 
 This will run axe against the document at the point in which it is called, then returns the full set of results as reported by `axe.run`.
@@ -213,11 +220,9 @@ describe('Playwright web page accessibility test', () => {
 
   it('gets and reports a11y for the specific element', async () => {
     const violations = await getViolations(page, 'input[name="password"]', {
-      axeOptions: {
-        runOnly: {
-          type: 'tag',
-          values: ['wcag2a'],
-        },
+      runOnly: {
+        type: 'tag',
+        values: ['wcag2a'],
       },
     })
 
@@ -280,6 +285,34 @@ describe('Playwright web page accessibility test', () => {
 
 ![Detailed Report with HTML](./docs/detailed-report-html-example.png)
 
+#### HTML Report
+
+Thanks to [axe-html-reporter](https://www.npmjs.com/package/axe-html-reporter) you can generate HTML report(s).
+From default HTML file(s) will be generated under `/artifacts/accessibilityReport.html`. 
+Report's options can customized from `checkAlly` level:
+
+```
+await checkA11y(
+      page,
+      'form',
+      {
+        axeOptions: {
+          runOnly: {
+            type: 'tag',
+            values: ['wcag2a'],
+          },
+        },
+      },
+      true, 'default',
+      {
+        outputDirPath: 'results',
+        outputDir: 'accessibility',
+        reportFileName: 'accessibility-audit.html'
+      }
+    )
+```
+
+
 ## Before you Go
 
 If it works for you , leave a [Star](https://github.com/abhinaba-ghosh/axe-playwright)! :star:

package/dist/index.d.ts

@@ -0,0 +1,56 @@
+import { Page } from 'playwright';
+import { AxeResults, ElementContext, Result, RunOptions } from 'axe-core';
+import DefaultTerminalReporter from './reporter/defaultTerminalReporter';
+import Reporter, { ConfigOptions, AxeOptions } from './types';
+import { Options } from 'axe-html-reporter';
+declare global {
+    interface Window {
+        axe: any;
+    }
+}
+declare module 'axe-core' {
+    interface Node {
+    }
+}
+/**
+ * Injects axe executable commands in the active window
+ * @param page
+ */
+export declare const injectAxe: (page: Page) => Promise<void>;
+/**
+ * Configures axe runtime options
+ * @param page
+ * @param configurationOptions
+ */
+export declare const configureAxe: (page: Page, configurationOptions?: ConfigOptions) => Promise<void>;
+/**
+ * Runs axe-core tools on the relevant page and returns all results
+ * @param page
+ * @param context
+ * @param options
+ */
+export declare const getAxeResults: (page: Page, context?: ElementContext, options?: RunOptions) => Promise<AxeResults>;
+/**
+ * Runs axe-core tools on the relevant page and returns all accessibility violations detected on the page
+ * @param page
+ * @param context
+ * @param options
+ */
+export declare const getViolations: (page: Page, context?: ElementContext, options?: RunOptions) => Promise<Result[]>;
+/**
+ * Report violations given the reporter.
+ * @param violations
+ * @param reporter
+ */
+export declare const reportViolations: (violations: Result[], reporter: Reporter) => Promise<void>;
+/**
+ * Performs Axe validations
+ * @param page
+ * @param context
+ * @param axeOptions
+ * @param skipFailures
+ * @param reporter
+ * @param options
+ */
+export declare const checkA11y: (page: Page, context?: ElementContext | undefined, axeOptions?: AxeOptions | undefined, skipFailures?: boolean, reporter?: Reporter | 'default' | 'v2', options?: Options | undefined) => Promise<void>;
+export { DefaultTerminalReporter };

package/dist/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -31,10 +35,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.checkA11y = exports.reportViolations = exports.getViolations = exports.getAxeResults = exports.configureAxe = exports.injectAxe = void 0;
+exports.DefaultTerminalReporter = exports.checkA11y = exports.reportViolations = exports.getViolations = exports.getAxeResults = exports.configureAxe = exports.injectAxe = void 0;
 const fs = __importStar(require("fs"));
 const utils_1 = require("./utils");
 const defaultTerminalReporter_1 = __importDefault(require("./reporter/defaultTerminalReporter"));
+exports.DefaultTerminalReporter = defaultTerminalReporter_1.default;
+const terminalReporterV2_1 = __importDefault(require("./reporter/terminalReporterV2"));
+const axe_html_reporter_1 = require("axe-html-reporter");
 /**
  * Injects axe executable commands in the active window
  * @param page
@@ -73,7 +80,7 @@ exports.getAxeResults = getAxeResults;
  * @param options
  */
 const getViolations = (page, context, options) => __awaiter(void 0, void 0, void 0, function* () {
-    const result = yield exports.getAxeResults(page, context, options);
+    const result = yield (0, exports.getAxeResults)(page, context, options);
     return result.violations;
 });
 exports.getViolations = getViolations;
@@ -90,19 +97,32 @@ exports.reportViolations = reportViolations;
  * Performs Axe validations
  * @param page
  * @param context
- * @param options
+ * @param axeOptions
  * @param skipFailures
  * @param reporter
+ * @param options
  */
-const checkA11y = (page, context, options, skipFailures, reporter) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a;
-    if (context === void 0) { context = undefined; }
-    if (options === void 0) { options = undefined; }
-    if (skipFailures === void 0) { skipFailures = false; }
-    if (reporter === void 0) { reporter = new defaultTerminalReporter_1.default(options === null || options === void 0 ? void 0 : options.detailedReport, (_a = options === null || options === void 0 ? void 0 : options.detailedReportOptions) === null || _a === void 0 ? void 0 : _a.html); }
-    const violations = yield exports.getViolations(page, context, options === null || options === void 0 ? void 0 : options.axeOptions);
-    const impactedViolations = utils_1.getImpactedViolations(violations, options === null || options === void 0 ? void 0 : options.includedImpacts);
-    yield exports.reportViolations(impactedViolations, reporter);
-    utils_1.testResultDependsOnViolations(impactedViolations, skipFailures);
+const checkA11y = (page, context = undefined, axeOptions = undefined, skipFailures = false, reporter = 'default', options = undefined) => __awaiter(void 0, void 0, void 0, function* () {
+    var _a, _b, _c;
+    const violations = yield (0, exports.getViolations)(page, context, axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.axeOptions);
+    if (violations.length > 0) {
+        yield (0, axe_html_reporter_1.createHtmlReport)({ results: { violations }, options });
+    }
+    else
+        console.log("There were no violations to save in report");
+    const impactedViolations = (0, utils_1.getImpactedViolations)(violations, axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.includedImpacts);
+    let reporterWithOptions;
+    if (reporter === 'default') {
+        reporterWithOptions = new defaultTerminalReporter_1.default(axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.detailedReport, (_a = axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.detailedReportOptions) === null || _a === void 0 ? void 0 : _a.html, (_b = axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.verbose) !== null && _b !== void 0 ? _b : true);
+    }
+    else if (reporter === 'v2') {
+        reporterWithOptions = new terminalReporterV2_1.default((_c = axeOptions === null || axeOptions === void 0 ? void 0 : axeOptions.verbose) !== null && _c !== void 0 ? _c : false);
+    }
+    else {
+        reporterWithOptions = reporter;
+    }
+    yield (0, exports.reportViolations)(impactedViolations, reporterWithOptions);
+    if (reporter !== 'v2')
+        (0, utils_1.testResultDependsOnViolations)(impactedViolations, skipFailures);
 });
 exports.checkA11y = checkA11y;

package/dist/reporter/defaultTerminalReporter.d.ts

@@ -0,0 +1,9 @@
+import Reporter from '../types';
+import { Result } from 'axe-core';
+export default class DefaultTerminalReporter implements Reporter {
+    protected detailedReport: boolean | undefined;
+    protected includeHtml: boolean | undefined;
+    protected verbose: boolean | undefined;
+    constructor(detailedReport: boolean | undefined, includeHtml: boolean | undefined, verbose: boolean | undefined);
+    report(violations: Result[]): Promise<void>;
+}

package/dist/reporter/defaultTerminalReporter.js

@@ -11,9 +11,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
 class DefaultTerminalReporter {
-    constructor(detailedReport, includeHtml) {
+    constructor(detailedReport, includeHtml, verbose) {
         this.detailedReport = detailedReport;
         this.includeHtml = includeHtml;
+        this.verbose = verbose;
     }
     report(violations) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -29,7 +30,7 @@ class DefaultTerminalReporter {
                 // summary
                 console.table(violationData);
                 if (this.detailedReport) {
-                    const nodeViolations = utils_1.describeViolations(violations).map(({ target, html, violations }) => {
+                    const nodeViolations = (0, utils_1.describeViolations)(violations).map(({ target, html, violations }) => {
                         if (!this.includeHtml) {
                             return {
                                 target,
@@ -43,7 +44,7 @@ class DefaultTerminalReporter {
                 }
             }
             else {
-                console.log(`No accessibility violations detected!`);
+                this.verbose && console.log(`No accessibility violations detected!`);
             }
         });
     }

package/dist/reporter/terminalReporterV2.d.ts

@@ -0,0 +1,7 @@
+import Reporter from '../types';
+import { Result } from 'axe-core';
+export default class TerminalReporterV2 implements Reporter {
+    protected verbose: boolean | undefined;
+    constructor(verbose: boolean | undefined);
+    report(violations: Result[]): Promise<void>;
+}

package/dist/reporter/terminalReporterV2.js

@@ -0,0 +1,69 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const assert_1 = __importDefault(require("assert"));
+const picocolors_1 = __importDefault(require("picocolors"));
+class TerminalReporterV2 {
+    constructor(verbose) {
+        this.verbose = verbose;
+    }
+    report(violations) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const lineBreak = '\n\n';
+            const message = violations.length === 0
+                ? 'No accessibility violations detected!'
+                : `Found ${violations.length} accessibility violations: \n`;
+            const horizontalLine = picocolors_1.default.bold('-'.repeat(message.length));
+            const reporter = (violations) => {
+                if (violations.length === 0) {
+                    return [];
+                }
+                return violations
+                    .map((violation) => {
+                    const errorBody = violation.nodes
+                        .map((node) => {
+                        const selector = node.target.join(', ');
+                        const expectedText = `Expected the HTML found at $('${selector}') to have no violations:` +
+                            '\n';
+                        return (picocolors_1.default.bold(expectedText) +
+                            picocolors_1.default.gray(node.html) +
+                            lineBreak +
+                            `Received:\n` +
+                            picocolors_1.default.red(`${violation.help} (${violation.id})`) +
+                            lineBreak +
+                            picocolors_1.default.bold(picocolors_1.default.yellow(node.failureSummary)) +
+                            lineBreak +
+                            (violation.helpUrl
+                                ? `You can find more information on this issue here: \n${picocolors_1.default.bold(picocolors_1.default.blue(violation.helpUrl))}`
+                                : '') +
+                            '\n' +
+                            horizontalLine);
+                    })
+                        .join(lineBreak);
+                    return errorBody;
+                })
+                    .join(lineBreak);
+            };
+            const formatedViolations = reporter(violations);
+            const pass = formatedViolations.length === 0;
+            if (pass) {
+                this.verbose && console.log(message);
+            }
+            else {
+                assert_1.default.fail(message + horizontalLine + '\n' + formatedViolations);
+            }
+        });
+    }
+}
+exports.default = TerminalReporterV2;

package/dist/types.d.ts

@@ -0,0 +1,45 @@
+import { Result, Check, ImpactValue, Locale, Rule, RunOptions } from 'axe-core';
+export interface NodeViolation {
+    target: string;
+    html: string;
+    violations: string;
+}
+export interface Aggregate {
+    [key: string]: {
+        target: string;
+        html: string;
+        violations: number[];
+    };
+}
+export default interface Reporter {
+    report(violations: Result[]): Promise<void>;
+}
+export interface axeOptionsConfig {
+    axeOptions?: RunOptions;
+}
+export interface ConfigOptions {
+    branding?: {
+        brand?: string;
+        application?: string;
+    };
+    reporter?: 'v1' | 'v2' | 'no-passes';
+    checks?: Check[];
+    rules?: Rule[];
+    locale?: Locale;
+    axeVersion?: string;
+}
+/**
+ * Implement this interface to be able to specific custom reporting behaviour for checkA11y method.
+ * @see checkA11y
+ */
+export default interface Reporter {
+    report(violations: Result[]): Promise<void>;
+}
+export type AxeOptions = {
+    includedImpacts?: ImpactValue[];
+    detailedReport?: boolean;
+    detailedReportOptions?: {
+        html?: boolean;
+    };
+    verbose?: boolean;
+} & axeOptionsConfig;

package/dist/utils.d.ts

@@ -0,0 +1,5 @@
+import { NodeViolation } from './types';
+import { ImpactValue, Result } from 'axe-core';
+export declare const getImpactedViolations: (violations: Result[], includedImpacts?: ImpactValue[]) => Result[];
+export declare const testResultDependsOnViolations: (violations: Result[], skipFailures: boolean) => void;
+export declare const describeViolations: (violations: Result[]) => NodeViolation[];

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "axe-playwright",
-  "version": "1.1.11",
+  "version": "1.2.1",
   "description": "Custom Playwright commands to inject axe-core and test for a11y",
   "main": "dist/index.js",
-  "types": "index.d.ts",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist/**/*",
+    "README.md"
+  ],
   "keywords": [
     "a11y",
     "accessibility",
@@ -20,24 +24,25 @@
     "release": "npm cache clean --force && npm version patch && npm publish --force"
   },
   "peerDependencies": {
-    "playwright-core": ">1.0.0"
+    "playwright": ">1.0.0"
   },
   "author": "Abhinaba Ghosh",
   "license": "MIT",
   "devDependencies": {
-    "@types/is-ci": "^3.0.0",
-    "@types/jest": "^27.0.3",
-    "@types/node": "^17.0.4",
-    "jest": "^26.6.3",
-    "jest-each": "^27.0.2",
-    "jest-playwright-preset": "^1.3.1",
-    "playwright": "^1.1.1",
-    "prettier": "^2.0.5",
-    "ts-jest": "^26.5.0",
-    "typescript": "^4.1.3"
+    "@types/jest": "^28.1.1",
+    "@types/node": "^18.11.9",
+    "jest": "^28.1.3",
+    "jest-each": "^28.1.3",
+    "jest-playwright-preset": "^2.0.0",
+    "playwright": "^1.27.1",
+    "prettier": "^2.7.1",
+    "ts-jest": "^28.0.8",
+    "typescript": "^4.8.4"
   },
   "dependencies": {
-    "axe-core": "^4.0.1"
+    "picocolors": "^1.0.0",
+    "axe-core": "^4.5.1",
+    "axe-html-reporter": "2.2.3"
   },
   "repository": {
     "type": "git",

package/.circleci/config.yml

@@ -1,19 +0,0 @@
-version: 2
-jobs:
-  build:
-    docker:
-      - image: qawolf/playwright-ci:v1.0.0
-    steps:
-      - checkout
-
-      - run:
-          command: npm install
-
-      - run:
-          command: |
-            # # Start local server
-            # npm run start & 
-            # npx wait-on http://localhost:3000
-            # replace below with command you want to run, example for running a script below
-            # node myScript.js
-            npm test

package/.github/dependabot.yml

@@ -1,12 +0,0 @@
-version: 2
-updates:
-- package-ecosystem: npm
-  directory: "/"
-  schedule:
-    interval: daily
-    time: "23:30"
-  open-pull-requests-limit: 10
-  ignore:
-  - dependency-name: "@types/node"
-    versions:
-    - 15.0.0

package/index.d.ts

@@ -1,93 +0,0 @@
-import { AxeResults, Check, ElementContext, ImpactValue, Locale, Result, Rule, RunOptions } from 'axe-core'
-import { Page } from 'playwright'
-
-export interface axeOptionsConfig {
-  axeOptions: RunOptions
-}
-
-export interface ConfigOptions {
-  branding?: {
-    brand?: string
-    application?: string
-  }
-  reporter?: 'v1' | 'v2' | 'no-passes'
-  checks?: Check[]
-  rules?: Rule[]
-  locale?: Locale
-  axeVersion?: string
-}
-
-/**
- * Implement this interface to be able to specific custom reporting behaviour for checkA11y method.
- * @see checkA11y
- */
-export default interface Reporter {
-  report(violations: Result[]): Promise<void>
-}
-
-/**
- * Default implementation of a reporter which prints a summary to the console.
- */
-export class DefaultTerminalReporter implements Reporter {
-  constructor(detailedReport: boolean | undefined, includeHtml: boolean | undefined)
-  report(violations: Result[]): Promise<void>
-}
-
-export type Options = {
-  includedImpacts?: ImpactValue[]
-  detailedReport?: boolean
-  detailedReportOptions?: { html?: boolean }
-} & axeOptionsConfig
-
-declare module 'axe-core' {
-  interface Node {}
-}
-
-/**
- * Injects axe into browser-context
- */
-export function injectAxe(page: Page): Promise<void>
-
-/**
- * Performs accessibility checks in the web page
- * @param page
- * @param context
- * @param options
- * @param skipFailures
- */
-export function checkA11y(
-  page: Page,
-  context?: ElementContext,
-  options?: Options,
-  skipFailures?: boolean,
-): Promise<void>
-
-/**
- * configure different axe configurations
- * @param page
- * @param options
- */
-export function configureAxe(page: Page, options?: ConfigOptions): Promise<void>
-
-/**
- * Runs axe-core tools on the relevant page and returns all results
- * @param page
- * @param context
- * @param options
- */
-export function getAxeResults(page: Page, context?: ElementContext, options?: RunOptions): Promise<AxeResults>
-
-/**
- * Runs axe-core tools on the relevant page and returns all accessibility violations detected on the page
- * @param page
- * @param context
- * @param options
- */
-export function getViolations(page: Page, context?: ElementContext, options?: RunOptions): Promise<Result[]>
-
-/**
- * Report violations given the reporter.
- * @param violations
- * @param reporter
- */
-export function reportViolations(violations: Result[], reporter: Reporter): Promise<void>

package/jest.config.js

@@ -1,10 +0,0 @@
-module.exports = {
-  preset: 'jest-playwright-preset',
-  testEnvironment: 'node',
-  testMatch: ['**/tests/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[tj]s?(x)'],
-  testPathIgnorePatterns: ['/node_modules/'],
-  testTimeout: 30000,
-  transform: {
-    '^.+\\.tsx?$': 'ts-jest',
-  },
-}

package/src/index.ts

@@ -1,115 +0,0 @@
-import { Page } from 'playwright'
-import * as fs from 'fs'
-import { AxeResults, ElementContext, Result, RunOptions, Spec } from 'axe-core'
-import { ConfigOptions, Options } from '../index'
-import { getImpactedViolations, testResultDependsOnViolations } from './utils'
-import DefaultTerminalReporter from './reporter/defaultTerminalReporter'
-import Reporter from './types'
-
-declare global {
-  interface Window {
-    axe: any
-  }
-}
-
-/**
- * Injects axe executable commands in the active window
- * @param page
- */
-export const injectAxe = async (page: Page): Promise<void> => {
-  const axe: string = fs.readFileSync(
-    require.resolve('axe-core/axe.min.js'),
-    'utf8',
-  )
-  await page.evaluate((axe: string) => window.eval(axe), axe)
-}
-
-/**
- * Configures axe runtime options
- * @param page
- * @param configurationOptions
- */
-export const configureAxe = async (
-  page: Page,
-  configurationOptions: ConfigOptions = {},
-): Promise<void> => {
-  await page.evaluate(
-    (configOptions: Spec) => window.axe.configure(configOptions),
-    configurationOptions as Spec,
-  )
-}
-
-/**
- * Runs axe-core tools on the relevant page and returns all results
- * @param page
- * @param context
- * @param options
- */
-export const getAxeResults = async (
-  page: Page,
-  context?: ElementContext,
-  options?: RunOptions,
-): Promise<AxeResults> => {
-  const result = await page.evaluate(
-    ([context, options]) => {
-      return window.axe.run(context || window.document, options)
-    },
-    [context, options],
-  )
-
-  return result
-}
-
-/**
- * Runs axe-core tools on the relevant page and returns all accessibility violations detected on the page
- * @param page
- * @param context
- * @param options
- */
-export const getViolations = async (
-  page: Page,
-  context?: ElementContext,
-  options?: RunOptions,
-): Promise<Result[]> => {
-  const result = await getAxeResults(page, context, options)
-  return result.violations
-}
-
-/**
- * Report violations given the reporter.
- * @param violations
- * @param reporter
- */
-export const reportViolations = async (violations: Result[], reporter: Reporter): Promise<void> => {
-  await reporter.report(violations)
-}
-
-/**
- * Performs Axe validations
- * @param page
- * @param context
- * @param options
- * @param skipFailures
- * @param reporter
- */
-export const checkA11y = async (
-  page: Page,
-  context: ElementContext | undefined = undefined,
-  options: Options | undefined = undefined,
-  skipFailures: boolean = false,
-  reporter: Reporter = new DefaultTerminalReporter(options?.detailedReport, options?.detailedReportOptions?.html),
-): Promise<void> => {
-  const violations = await getViolations(page, context, options?.axeOptions)
-
-  const impactedViolations = getImpactedViolations(
-    violations,
-    options?.includedImpacts,
-  )
-
-  await reportViolations(
-    impactedViolations,
-    reporter,
-  )
-
-  testResultDependsOnViolations(impactedViolations, skipFailures)
-}

package/src/reporter/defaultTerminalReporter.ts

@@ -1,43 +0,0 @@
-import Reporter from '../types'
-import { Result } from 'axe-core'
-import { describeViolations } from '../utils'
-
-export default class DefaultTerminalReporter implements Reporter {
-  constructor(
-    protected detailedReport: boolean | undefined,
-    protected includeHtml: boolean | undefined,
-  ) {}
-
-  async report(violations: Result[]): Promise<void> {
-    const violationData = violations.map(({ id, impact, description, nodes }) => {
-      return {
-        id,
-        impact,
-        description,
-        nodes: nodes.length,
-      }
-    })
-
-    if (violationData.length > 0) {
-      // summary
-      console.table(violationData)
-      if (this.detailedReport) {
-        const nodeViolations = describeViolations(violations).map(
-          ({ target, html, violations }) => {
-            if (!this.includeHtml) {
-              return {
-                target,
-                violations,
-              }
-            }
-            return { target, html, violations }
-          },
-        )
-        // per node
-        console.table(nodeViolations)
-      }
-    } else {
-      console.log(`No accessibility violations detected!`)
-    }
-  }
-}

package/src/types.ts

@@ -1,19 +0,0 @@
-import { Result } from 'axe-core'
-
-export interface NodeViolation {
-  target: string
-  html: string
-  violations: string
-}
-
-export interface Aggregate {
-  [key: string]: {
-    target: string
-    html: string
-    violations: number[]
-  }
-}
-
-export default interface Reporter {
-  report(violations: Result[]): Promise<void>
-}

package/src/utils.ts

@@ -1,61 +0,0 @@
-import { Aggregate, NodeViolation } from './types'
-import { ImpactValue, Result } from 'axe-core'
-import assert from 'assert'
-
-export const getImpactedViolations = (
-  violations: Result[],
-  includedImpacts: ImpactValue[] = [],
-): Result[] => {
-  return Array.isArray(includedImpacts) && includedImpacts.length
-    ? violations.filter(
-      (v: Result) => v.impact && includedImpacts.includes(v.impact),
-    )
-    : violations
-}
-
-export const testResultDependsOnViolations = (
-  violations: Result[],
-  skipFailures: boolean,
-) => {
-  if (!skipFailures) {
-    assert.strictEqual(
-      violations.length,
-      0,
-      `${violations.length} accessibility violation${
-        violations.length === 1 ? '' : 's'
-      } ${violations.length === 1 ? 'was' : 'were'} detected`,
-    )
-  } else {
-    if (violations.length) {
-      console.warn({
-        name: 'a11y violation summary',
-        message: `${violations.length} accessibility violation${
-          violations.length === 1 ? '' : 's'
-        } ${violations.length === 1 ? 'was' : 'were'} detected`,
-      })
-    }
-  }
-}
-
-export const describeViolations = (violations: Result[]): NodeViolation[] => {
-  const aggregate: Aggregate = {}
-
-  violations.map(({ nodes }, index) => {
-    nodes.forEach(({ target, html }) => {
-      const key = JSON.stringify(target) + html
-
-      if (aggregate[key]) {
-        aggregate[key].violations.push(index)
-      } else {
-        aggregate[key] = {
-          target: JSON.stringify(target),
-          html,
-          violations: [index],
-        }
-      }
-    })
-  })
-  return Object.values(aggregate).map(({ target, html, violations }) => {
-    return { target, html, violations: JSON.stringify(violations) }
-  })
-}

package/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es6",
-    "module": "commonjs",
-    "strict": true,
-    "declaration": false,
-    "rootDir": "src",
-    "moduleResolution": "node",
-    "typeRoots": ["node_modules/@types"],
-    "esModuleInterop": true,
-    "outDir": "dist",
-    "noImplicitAny": false,
-    "types": ["node", "jest"]
-  },
-  "exclude": ["node_modules"],
-  "include": ["src/"]
-}