axe-html-reporter - npm Package Compare versions

Comparing version 1.2.1 to 2.0.0

dist/index.d.ts

@@ -1,8 +0,3 @@
-import { Result } from 'axe-core';
-export interface CreateReport {
-    violations: Result[];
-    url: string;
-    passes?: Result[];
-    incomplete?: Result[];
-    inapplicable?: Result[];
+import { AxeResults, Result } from 'axe-core';
+export interface Options {
     reportFileName?: string;
@@ -13,2 +8,6 @@ outputDir?: string;
 }
+export interface CreateReport {
+    results: Partial<AxeResults>;
+    options?: Options;
+}
 export interface PreparedResults {
@@ -20,2 +19,2 @@ violations: Result[];
 }
-export declare function createHtmlReport({ violations, url, passes, incomplete, inapplicable, reportFileName, outputDir, projectKey, customSummary, }: CreateReport): void;
+export declare function createHtmlReport({ results, options }: CreateReport): void;

dist/index.js

@@ -10,26 +10,41 @@ "use strict";
 const prepareReportData_1 = require("./util/prepareReportData");
+const prepareAxeRules_1 = require("./util/prepareAxeRules");
 const saveHtmlReport_1 = require("./util/saveHtmlReport");
-function createHtmlReport({ violations, url, passes, incomplete, inapplicable, reportFileName, outputDir, projectKey, customSummary, }) {
-    if (!violations || !url) {
-        throw new Error("violations and url parameters are required for HTML accessibility report. Example: createHtmlReport({violations: Result[], url: 'www.example.com'})");
+function createHtmlReport({ results, options }) {
+    var _a;
+    if (!results.violations) {
+        throw new Error("'violations' is required for HTML accessibility report. Example: createHtmlReport({ results : { violations: Result[] } })");
     }
     try {
         const template = loadTemplate_1.loadTemplate();
-        const reportData = prepareReportData_1.prepareReportData({ violations, passes, incomplete, inapplicable });
+        const preparedReportData = prepareReportData_1.prepareReportData({
+            violations: results.violations,
+            passes: results.passes,
+            incomplete: results.incomplete,
+            inapplicable: results.inapplicable,
+        });
         const htmlContent = mustache_1.default.render(template, {
-            url,
-            violationsSummary: reportData.violationsSummary,
-            violations: reportData.violationsSummaryTable,
-            violationDetails: reportData.violationsDetails,
-            checksPassed: reportData.checksPassed,
-            checksIncomplete: reportData.checksIncomplete,
-            checksInapplicable: reportData.checksInapplicable,
-            hasPassed: passes !== undefined,
-            hasIncomplete: incomplete !== undefined,
-            hasInapplicable: inapplicable !== undefined,
-            incompleteTotal: reportData.checksIncomplete ? reportData.checksIncomplete.length : 0,
-            projectKey,
-            customSummary,
+            url: results.url,
+            violationsSummary: preparedReportData.violationsSummary,
+            violations: preparedReportData.violationsSummaryTable,
+            violationDetails: preparedReportData.violationsDetails,
+            checksPassed: preparedReportData.checksPassed,
+            checksIncomplete: preparedReportData.checksIncomplete,
+            checksInapplicable: preparedReportData.checksInapplicable,
+            hasPassed: Boolean(results.passes),
+            hasIncomplete: Boolean(results.incomplete),
+            hasInapplicable: Boolean(results.inapplicable),
+            incompleteTotal: preparedReportData.checksIncomplete
+                ? preparedReportData.checksIncomplete.length
+                : 0,
+            projectKey: options === null || options === void 0 ? void 0 : options.projectKey,
+            customSummary: options === null || options === void 0 ? void 0 : options.customSummary,
+            hasAxeRawResults: Boolean(results === null || results === void 0 ? void 0 : results.timestamp),
+            rules: prepareAxeRules_1.prepareAxeRules(((_a = results === null || results === void 0 ? void 0 : results.toolOptions) === null || _a === void 0 ? void 0 : _a.rules) || {}),
         });
-        saveHtmlReport_1.saveHtmlReport({ htmlContent, reportFileName, outputDir });
+        saveHtmlReport_1.saveHtmlReport({
+            htmlContent,
+            reportFileName: options === null || options === void 0 ? void 0 : options.reportFileName,
+            outputDir: options === null || options === void 0 ? void 0 : options.outputDir,
+        });
     }
@@ -41,2 +56,2 @@ catch (e) {
 exports.createHtmlReport = createHtmlReport;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsd0RBQWdDO0FBRWhDLHNEQUFtRDtBQUNuRCxnRUFBNkQ7QUFDN0QsMERBQXVEO0FBcUJ2RCxTQUFnQixnQkFBZ0IsQ0FBQyxFQUM3QixVQUFVLEVBQ1YsR0FBRyxFQUNILE1BQU0sRUFDTixVQUFVLEVBQ1YsWUFBWSxFQUNaLGNBQWMsRUFDZCxTQUFTLEVBQ1QsVUFBVSxFQUNWLGFBQWEsR0FDRjtJQUNYLElBQUksQ0FBQyxVQUFVLElBQUksQ0FBQyxHQUFHLEVBQUU7UUFDckIsTUFBTSxJQUFJLEtBQUssQ0FDWCxxSkFBcUosQ0FDeEosQ0FBQztLQUNMO0lBQ0QsSUFBSTtRQUNBLE1BQU0sUUFBUSxHQUFHLDJCQUFZLEVBQUUsQ0FBQztRQUNoQyxNQUFNLFVBQVUsR0FBRyxxQ0FBaUIsQ0FBQyxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLFlBQVksRUFBRSxDQUFDLENBQUM7UUFDdkYsTUFBTSxXQUFXLEdBQUcsa0JBQVEsQ0FBQyxNQUFNLENBQUMsUUFBUSxFQUFFO1lBQzFDLEdBQUc7WUFDSCxpQkFBaUIsRUFBRSxVQUFVLENBQUMsaUJBQWlCO1lBQy9DLFVBQVUsRUFBRSxVQUFVLENBQUMsc0JBQXNCO1lBQzdDLGdCQUFnQixFQUFFLFVBQVUsQ0FBQyxpQkFBaUI7WUFDOUMsWUFBWSxFQUFFLFVBQVUsQ0FBQyxZQUFZO1lBQ3JDLGdCQUFnQixFQUFFLFVBQVUsQ0FBQyxnQkFBZ0I7WUFDN0Msa0JBQWtCLEVBQUUsVUFBVSxDQUFDLGtCQUFrQjtZQUNqRCxTQUFTLEVBQUUsTUFBTSxLQUFLLFNBQVM7WUFDL0IsYUFBYSxFQUFFLFVBQVUsS0FBSyxTQUFTO1lBQ3ZDLGVBQWUsRUFBRSxZQUFZLEtBQUssU0FBUztZQUMzQyxlQUFlLEVBQUUsVUFBVSxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsZ0JBQWdCLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQ3JGLFVBQVU7WUFDVixhQUFhO1NBQ2hCLENBQUMsQ0FBQztRQUNILCtCQUFjLENBQUMsRUFBRSxXQUFXLEVBQUUsY0FBYyxFQUFFLFNBQVMsRUFBRSxDQUFDLENBQUM7S0FDOUQ7SUFBQyxPQUFPLENBQUMsRUFBRTtRQUNSLE9BQU8sQ0FBQyxJQUFJLENBQUMsZ0RBQWdELENBQUMsQ0FBQyxPQUFPLEVBQUUsQ0FBQyxDQUFDO0tBQzdFO0FBQ0wsQ0FBQztBQXRDRCw0Q0FzQ0MifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsd0RBQWdDO0FBRWhDLHNEQUFtRDtBQUNuRCxnRUFBNkQ7QUFDN0QsNERBQXlEO0FBQ3pELDBEQUF1RDtBQXFCdkQsU0FBZ0IsZ0JBQWdCLENBQUMsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFnQjs7SUFDL0QsSUFBSSxDQUFDLE9BQU8sQ0FBQyxVQUFVLEVBQUU7UUFDckIsTUFBTSxJQUFJLEtBQUssQ0FDWCwySEFBMkgsQ0FDOUgsQ0FBQztLQUNMO0lBQ0QsSUFBSTtRQUNBLE1BQU0sUUFBUSxHQUFHLDJCQUFZLEVBQUUsQ0FBQztRQUNoQyxNQUFNLGtCQUFrQixHQUFHLHFDQUFpQixDQUFDO1lBQ3pDLFVBQVUsRUFBRSxPQUFPLENBQUMsVUFBVTtZQUM5QixNQUFNLEVBQUUsT0FBTyxDQUFDLE1BQU07WUFDdEIsVUFBVSxFQUFFLE9BQU8sQ0FBQyxVQUFVO1lBQzlCLFlBQVksRUFBRSxPQUFPLENBQUMsWUFBWTtTQUNyQyxDQUFDLENBQUM7UUFDSCxNQUFNLFdBQVcsR0FBRyxrQkFBUSxDQUFDLE1BQU0sQ0FBQyxRQUFRLEVBQUU7WUFDMUMsR0FBRyxFQUFFLE9BQU8sQ0FBQyxHQUFHO1lBQ2hCLGlCQUFpQixFQUFFLGtCQUFrQixDQUFDLGlCQUFpQjtZQUN2RCxVQUFVLEVBQUUsa0JBQWtCLENBQUMsc0JBQXNCO1lBQ3JELGdCQUFnQixFQUFFLGtCQUFrQixDQUFDLGlCQUFpQjtZQUN0RCxZQUFZLEVBQUUsa0JBQWtCLENBQUMsWUFBWTtZQUM3QyxnQkFBZ0IsRUFBRSxrQkFBa0IsQ0FBQyxnQkFBZ0I7WUFDckQsa0JBQWtCLEVBQUUsa0JBQWtCLENBQUMsa0JBQWtCO1lBQ3pELFNBQVMsRUFBRSxPQUFPLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQztZQUNsQyxhQUFhLEVBQUUsT0FBTyxDQUFDLE9BQU8sQ0FBQyxVQUFVLENBQUM7WUFDMUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxPQUFPLENBQUMsWUFBWSxDQUFDO1lBQzlDLGVBQWUsRUFBRSxrQkFBa0IsQ0FBQyxnQkFBZ0I7Z0JBQ2hELENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxnQkFBZ0IsQ0FBQyxNQUFNO2dCQUM1QyxDQUFDLENBQUMsQ0FBQztZQUNQLFVBQVUsRUFBRSxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsVUFBVTtZQUMvQixhQUFhLEVBQUUsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFFLGFBQWE7WUFDckMsZ0JBQWdCLEVBQUUsT0FBTyxDQUFDLE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRSxTQUFTLENBQUM7WUFDN0MsS0FBSyxFQUFFLGlDQUFlLENBQUMsT0FBQSxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsV0FBVywwQ0FBRSxLQUFLLEtBQUksRUFBRSxDQUFDO1NBQzVELENBQUMsQ0FBQztRQUNILCtCQUFjLENBQUM7WUFDWCxXQUFXO1lBQ1gsY0FBYyxFQUFFLE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRSxjQUFjO1lBQ3ZDLFNBQVMsRUFBRSxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsU0FBUztTQUNoQyxDQUFDLENBQUM7S0FDTjtJQUFDLE9BQU8sQ0FBQyxFQUFFO1FBQ1IsT0FBTyxDQUFDLElBQUksQ0FBQyxnREFBZ0QsQ0FBQyxDQUFDLE9BQU8sRUFBRSxDQUFDLENBQUM7S0FDN0U7QUFDTCxDQUFDO0FBekNELDRDQXlDQyJ9

dist/util/prepareReportData.js

@@ -13,3 +13,3 @@ "use strict";
         impact: impact || 'n/a',
-        nodes: nodes.length,
+        nodes: nodes.length
     }));
@@ -16,0 +16,0 @@ }

dist/util/saveHtmlReport.d.ts

@@ -0,1 +1,2 @@
+export declare const defaultReportFileName = "accessibilityReport.html";
 interface SaveReportOptions {
@@ -2,0 +3,0 @@ htmlContent: string;

dist/util/saveHtmlReport.js

@@ -6,4 +6,5 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.saveHtmlReport = void 0;
+exports.saveHtmlReport = exports.defaultReportFileName = void 0;
 const fs_1 = __importDefault(require("fs"));
+exports.defaultReportFileName = 'accessibilityReport.html';
 /**
@@ -22,3 +23,3 @@ * Saves the file with specified file name or with default file name index.thml
         }
-        const reportFilePath = `${reportDirectory}/${reportFileName || 'accessibilityReport.html'}`;
+        const reportFilePath = `${reportDirectory}/${reportFileName || exports.defaultReportFileName}`;
         fs_1.default.writeFileSync(reportFilePath, htmlContent);
@@ -32,2 +33,2 @@ console.info(`HTML report was saved into the following directory ${reportFilePath}`);
 exports.saveHtmlReport = saveHtmlReport;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2F2ZUh0bWxSZXBvcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvdXRpbC9zYXZlSHRtbFJlcG9ydC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSw0Q0FBb0I7QUFPcEI7Ozs7R0FJRztBQUNILFNBQWdCLGNBQWMsQ0FBQyxFQUMzQixXQUFXLEVBQ1gsY0FBYyxFQUNkLFNBQVMsR0FDTztJQUNoQixJQUFJO1FBQ0EsTUFBTSxlQUFlLEdBQUcsR0FBRyxPQUFPLENBQUMsR0FBRyxFQUFFLElBQUksU0FBUyxJQUFJLFdBQVcsRUFBRSxDQUFDO1FBQ3ZFLElBQUksQ0FBQyxZQUFFLENBQUMsVUFBVSxDQUFDLGVBQWUsQ0FBQyxFQUFFO1lBQ2pDLFlBQUUsQ0FBQyxTQUFTLENBQUMsZUFBZSxFQUFFO2dCQUMxQixTQUFTLEVBQUUsSUFBSTthQUNsQixDQUFDLENBQUM7U0FDTjtRQUNELE1BQU0sY0FBYyxHQUFHLEdBQUcsZUFBZSxJQUFJLGNBQWMsSUFBSSwwQkFBMEIsRUFBRSxDQUFDO1FBQzVGLFlBQUUsQ0FBQyxhQUFhLENBQUMsY0FBYyxFQUFFLFdBQVcsQ0FBQyxDQUFDO1FBQzlDLE9BQU8sQ0FBQyxJQUFJLENBQUMsc0RBQXNELGNBQWMsRUFBRSxDQUFDLENBQUM7S0FDeEY7SUFBQyxPQUFPLEdBQUcsRUFBRTtRQUNWLE9BQU8sQ0FBQyxLQUFLLENBQUMsb0RBQW9ELEdBQUcsRUFBRSxDQUFDLENBQUM7S0FDNUU7QUFDTCxDQUFDO0FBbEJELHdDQWtCQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2F2ZUh0bWxSZXBvcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvdXRpbC9zYXZlSHRtbFJlcG9ydC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSw0Q0FBb0I7QUFFUCxRQUFBLHFCQUFxQixHQUFHLDBCQUEwQixDQUFDO0FBT2hFOzs7O0dBSUc7QUFDSCxTQUFnQixjQUFjLENBQUMsRUFDM0IsV0FBVyxFQUNYLGNBQWMsRUFDZCxTQUFTLEdBQ087SUFDaEIsSUFBSTtRQUNBLE1BQU0sZUFBZSxHQUFHLEdBQUcsT0FBTyxDQUFDLEdBQUcsRUFBRSxJQUFJLFNBQVMsSUFBSSxXQUFXLEVBQUUsQ0FBQztRQUN2RSxJQUFJLENBQUMsWUFBRSxDQUFDLFVBQVUsQ0FBQyxlQUFlLENBQUMsRUFBRTtZQUNqQyxZQUFFLENBQUMsU0FBUyxDQUFDLGVBQWUsRUFBRTtnQkFDMUIsU0FBUyxFQUFFLElBQUk7YUFDbEIsQ0FBQyxDQUFDO1NBQ047UUFDRCxNQUFNLGNBQWMsR0FBRyxHQUFHLGVBQWUsSUFBSSxjQUFjLElBQUksNkJBQXFCLEVBQUUsQ0FBQztRQUN2RixZQUFFLENBQUMsYUFBYSxDQUFDLGNBQWMsRUFBRSxXQUFXLENBQUMsQ0FBQztRQUM5QyxPQUFPLENBQUMsSUFBSSxDQUFDLHNEQUFzRCxjQUFjLEVBQUUsQ0FBQyxDQUFDO0tBQ3hGO0lBQUMsT0FBTyxHQUFHLEVBQUU7UUFDVixPQUFPLENBQUMsS0FBSyxDQUFDLG9EQUFvRCxHQUFHLEVBQUUsQ0FBQyxDQUFDO0tBQzVFO0FBQ0wsQ0FBQztBQWxCRCx3Q0FrQkMifQ==

package.json

 {
     "name": "axe-html-reporter",
-    "version": "1.2.1",
+    "version": "2.0.0",
     "description": "The module that allows you to create HTML Report from raw accessibility aXe result object",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

 # axe-html-reporter
 
-Creates an HTML report from axe results object with list of violations, passes and incomplete results.
+Creates an HTML report from axe-core library AxeResults object listing violations, passes, incomplete and incompatible results.
 
-Allows specifying `url`, `projectKey` and `outputDir`.
+Allows specifying report creation options: `reportFileName`, `outputDir`, `projectKey` and `customSummary`.
 
-See [sample report output](https://lpelypenko.github.io/axe-html-reporter/)
+`customSummary` allows having html parameters.
 
+Please check [sample report output.](https://lpelypenko.github.io/axe-html-reporter/)
+
 ## Install
@@ -19,5 +21,4 @@
 
+To run TestCafe tests with axe-core, install testcafe, axe-core and [@testcafe-community/axe](https://www.npmjs.com/package/@testcafe-community/axe):
 
-To run TestCafe tests with axe-core, install testcafe, axe-core and [@testcafe-community/axe](https://www.npmjs.com/package/@testcafe-community/axe): 
-
 ```shell script
@@ -31,11 +32,11 @@ npm i -D axe-html-reporter testcafe axe-core @testcafe-community/axe
 {
-  "clientScripts":[{"module":"axe-core/axe.min.js"}]
+    "clientScripts": [{ "module": "axe-core/axe.min.js" }]
 }
 ```
-In the example bellow `fileName` is not passed. In this case html report with default name `accessibilityReport.html` will be created in `artifacts` directory.
 
-See full TestCafe test example is bellow: 
+In the example bellow `fileName` is not passed. If `fileName` is not passed, HTML report will be created with default name `accessibilityReport.html` in `artifacts` directory.
 
+See full TestCafe test example is bellow:
+
 ```javascript
-
 import { runAxe } from '@testcafe-community/axe';
@@ -48,15 +49,20 @@ import { createHtmlReport } from 'axe-html-reporter';
     const axeContext = { exclude: [['select']] };
-    const axeOptions = { rules: rulesMap() };
+    const axeOptions = {
+        rules: {
+            'object-alt': { enabled: true },
+            'role-img-alt': { enabled: true },
+            'input-image-alt': { enabled: true },
+            'image-alt': { enabled: true },
+        },
+    };
     const { error, results } = await runAxe(axeContext, axeOptions);
-    await t.expect(error).eql(null, `axe check failed with an error: ${error.message}`);
+    await t.expect(error).notOk(`axe check failed with an error: ${error.message}`);
     // creates html report with the default file name `accessibilityReport.html`
     createHtmlReport({
-        violations: results.violations,
-        passes: results.passes,
-        incomplete: results.incomplete,
-        url: results.url,
-        projectKey: 'EXAMPLE',
+        results,
+        options: {
+            projectKey: 'EXAMPLE',
+        },
     });
 });
-
 ```
@@ -83,32 +89,22 @@
 ```javascript
-
 import { axeHtmlReporter } from 'axe-html-reporter';
 
 (() => {
-    const results = { violations: [], passes: [], incomplete: [], inapplicable: [], url: 'http://example.com' }; 
     // creates html report with the default name `accessibilityReport.html` file
-    axeHtmlReporter({
-        violations: results.violations,
-        passes: results.passes,
-        incomplete: results.incomplete,
-        inapplicable: results.inapplicable,
-        url: results.url
-    });
+    axeHtmlReporter({ results: 'AxeResults' }); // full AxeResults object
+    // creates html report with the default name `accessibilityReport.html` file and all supported AxeResults values
+    axeHtmlReporter({ results: { violations: 'Result[]' } }); // passing only violations from axe.run output
     // creates html report with the default name `accessibilityReport.html` file and adds url and projectKey
     axeHtmlReporter({
-        violations: results.violations,
-        passes: results.passes,
-        incomplete: results.incomplete,
-        projectKey: 'JIRA_PROJECT_KEY',
-        url: results.url,
+        results: 'AxeResults',
+        options: { projectKey: 'JIRA_PROJECT_KEY' },
     });
-    // creates html report with the name `exampleReport.html` in 'axe-reports' directory and adds url and projectKey to the header
+    // creates html report with the name `exampleReport.html` in 'axe-reports' directory and adds projectKey to the header
     axeHtmlReporter({
-        violations: results.violations,
-        passes: results.passes,
-        incomplete: results.incomplete,
-        projectKey: 'JIRA_PROJECT_KEY',
-        outputDir: 'axe-reports',
-        url: results.url,
-        fileName: 'exampleReport.html',
+        results: 'AxeResults',
+        options: {
+            projectKey: 'JIRA_PROJECT_KEY',
+            outputDir: 'axe-reports',
+            fileName: 'exampleReport.html',
+        },
     });
@@ -123,11 +119,9 @@ // creates html report with all optional parameters, saving the report into 'docs' directory with report file name 'index.html'
     createHtmlReport({
-        violations: axeRawViolations,
-        passes: axeRawPassed,
-        incomplete: [],
-        inapplicable: axeRawInapplicable,
-        projectKey: 'DEQUE',
-        url: 'https://dequeuniversity.com/demo/mars/',
-        customSummary,
-        outputDir: 'docs',
-        reportFileName: 'index.html'
+        results: 'AxeResults',
+        options: {
+            projectKey: 'DEQUE',
+            customSummary,
+            outputDir: 'docs',
+            reportFileName: 'index.html',
+        },
     });
@@ -144,4 +138,4 @@ })();
     // creates html report with the name `accessibilityReport.html` file
-    axeHtmlReporter({ violations: results.violations });
+    axeHtmlReporter({ results: { violations: 'Result[]' } });
 })();
 ```

src/index.ts

 import mustache from 'mustache';
-import { Result } from 'axe-core';
+import { AxeResults, Result } from 'axe-core';
 import { loadTemplate } from './util/loadTemplate';
 import { prepareReportData } from './util/prepareReportData';
+import { prepareAxeRules } from './util/prepareAxeRules';
 import { saveHtmlReport } from './util/saveHtmlReport';
 
-export interface CreateReport {
-    violations: Result[];
-    url: string;
-    passes?: Result[];
-    incomplete?: Result[];
-    inapplicable?: Result[];
+export interface Options {
     reportFileName?: string;
@@ -19,2 +15,7 @@ outputDir?: string;
 
+export interface CreateReport {
+    results: Partial<AxeResults>;
+    options?: Options;
+}
+
 export interface PreparedResults {
@@ -27,16 +28,6 @@ violations: Result[];
 
-export function createHtmlReport({
-    violations,
-    url,
-    passes,
-    incomplete,
-    inapplicable,
-    reportFileName,
-    outputDir,
-    projectKey,
-    customSummary,
-}: CreateReport): void {
-    if (!violations || !url) {
+export function createHtmlReport({ results, options }: CreateReport): void {
+    if (!results.violations) {
         throw new Error(
-            "violations and url parameters are required for HTML accessibility report. Example: createHtmlReport({violations: Result[], url: 'www.example.com'})"
+            "'violations' is required for HTML accessibility report. Example: createHtmlReport({ results : { violations: Result[] } })"
         );
@@ -46,19 +37,32 @@ }
         const template = loadTemplate();
-        const reportData = prepareReportData({ violations, passes, incomplete, inapplicable });
+        const preparedReportData = prepareReportData({
+            violations: results.violations,
+            passes: results.passes,
+            incomplete: results.incomplete,
+            inapplicable: results.inapplicable,
+        });
         const htmlContent = mustache.render(template, {
-            url,
-            violationsSummary: reportData.violationsSummary,
-            violations: reportData.violationsSummaryTable,
-            violationDetails: reportData.violationsDetails,
-            checksPassed: reportData.checksPassed,
-            checksIncomplete: reportData.checksIncomplete,
-            checksInapplicable: reportData.checksInapplicable,
-            hasPassed: passes !== undefined,
-            hasIncomplete: incomplete !== undefined,
-            hasInapplicable: inapplicable !== undefined,
-            incompleteTotal: reportData.checksIncomplete ? reportData.checksIncomplete.length : 0,
-            projectKey,
-            customSummary,
+            url: results.url,
+            violationsSummary: preparedReportData.violationsSummary,
+            violations: preparedReportData.violationsSummaryTable,
+            violationDetails: preparedReportData.violationsDetails,
+            checksPassed: preparedReportData.checksPassed,
+            checksIncomplete: preparedReportData.checksIncomplete,
+            checksInapplicable: preparedReportData.checksInapplicable,
+            hasPassed: Boolean(results.passes),
+            hasIncomplete: Boolean(results.incomplete),
+            hasInapplicable: Boolean(results.inapplicable),
+            incompleteTotal: preparedReportData.checksIncomplete
+                ? preparedReportData.checksIncomplete.length
+                : 0,
+            projectKey: options?.projectKey,
+            customSummary: options?.customSummary,
+            hasAxeRawResults: Boolean(results?.timestamp),
+            rules: prepareAxeRules(results?.toolOptions?.rules || {}),
         });
-        saveHtmlReport({ htmlContent, reportFileName, outputDir });
+        saveHtmlReport({
+            htmlContent,
+            reportFileName: options?.reportFileName,
+            outputDir: options?.outputDir,
+        });
     } catch (e) {
@@ -65,0 +69,0 @@ console.warn(`HTML report was not created due to the error ${e.message}`);

src/util/prepareReportData.ts

@@ -15,3 +15,3 @@ import { AxeReport } from './AxeReport';
         impact: impact || 'n/a',
-        nodes: nodes.length,
+        nodes: nodes.length
     }));
@@ -18,0 +18,0 @@ }

src/util/saveHtmlReport.ts

 import fs from 'fs';
 
+export const defaultReportFileName = 'accessibilityReport.html';
+
 interface SaveReportOptions {
@@ -25,3 +27,3 @@ htmlContent: string;
         }
-        const reportFilePath = `${reportDirectory}/${reportFileName || 'accessibilityReport.html'}`;
+        const reportFilePath = `${reportDirectory}/${reportFileName || defaultReportFileName}`;
         fs.writeFileSync(reportFilePath, htmlContent);
@@ -28,0 +30,0 @@ console.info(`HTML report was saved into the following directory ${reportFilePath}`);

test/index.test.ts

 import { createHtmlReport } from '../src';
+import { defaultReportFileName } from '../src/util/saveHtmlReport';
 import fs from 'fs';
@@ -8,130 +9,149 @@ import path from 'path';
 const axeRawInapplicable = require('./rawInapplicable.json');
+const rawAxeResults = require('./rawAxeResults.json');
 
+function getPathToCreatedReport(customFileName?: string, customOutputDir?: string) {
+    return path.resolve(
+        process.cwd(),
+        customOutputDir ? customOutputDir : 'artifacts',
+        customFileName ? customFileName : defaultReportFileName
+    );
+}
+
 describe('createHtmlReport() test', () => {
     it('Verify throwing an error if required parameters are not passed', async () => {
         expect(() => {
-            //@ts-ignore
-            createHtmlReport({ passes: [] });
+            createHtmlReport({
+                // @ts-ignore
+                results: {
+                    passes: [],
+                },
+            });
         }).toThrow(
-            "violations and url parameters are required for HTML accessibility report. Example: createHtmlReport({violations: Result[], url: 'www.example.com'})"
+            "'violations' is required for HTML accessibility report. Example: createHtmlReport({ results : { violations: Result[] } })"
         );
     });
+
     it('Verify report is created only with violations because passes and incomplete are not passed', async () => {
         createHtmlReport({
-            violations: axeRawViolations,
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: axeRawViolations,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
         });
-        const pathToTheReport = path.resolve(
-            process.cwd(),
-            'artifacts',
-            'accessibilityReport.html'
-        );
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
+        expect(fs.readFileSync(getPathToCreatedReport(), { encoding: 'utf8' })).toMatchSnapshot();
+    });
+    it('URL is not passed', async () => {
+        const reportFileName = 'urlIsNotPassed.html';
+        createHtmlReport({
+            results: {
+                violations: axeRawViolations,
+            },
+            options: { reportFileName },
         });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report is created with violations and passes', async () => {
+        const reportFileName = 'tcPassesAndViolations.html';
         createHtmlReport({
-            violations: axeRawViolations,
-            passes: axeRawPassed,
-            reportFileName: 'tcPassesAndViolations.html',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: axeRawViolations,
+                passes: axeRawPassed,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { reportFileName },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'artifacts', 'tcPassesAndViolations.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report is created with violations, passes and incomplete with optional reportFileName and outputDir params', async () => {
+        const reportFileName = 'tcPassesViolationsIncomplete.html';
+        const outputDir = 'temp';
         createHtmlReport({
-            violations: axeRawViolations,
-            passes: axeRawPassed,
-            incomplete: axeRawIncomplete,
-            reportFileName: 'tcPassesViolationsIncomplete.html',
-            outputDir: 'temp',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: axeRawViolations,
+                passes: axeRawPassed,
+                incomplete: axeRawIncomplete,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: {
+                reportFileName,
+                outputDir,
+            },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'temp', 'tcPassesViolationsIncomplete.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName, outputDir), {
+                encoding: 'utf8',
+            })
+        ).toMatchSnapshot();
     });
     it('Verify report is created with violations, passes and incomplete with optional reportFileName, url and project key params', async () => {
+        const reportFileName = 'tcWithTheKey.html';
         createHtmlReport({
-            violations: axeRawViolations,
-            passes: axeRawPassed,
-            incomplete: axeRawIncomplete,
-            reportFileName: 'tcWithTheKey.html',
-            projectKey: 'DEQUE',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: axeRawViolations,
+                passes: axeRawPassed,
+                incomplete: axeRawIncomplete,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: {
+                reportFileName,
+                projectKey: 'DEQUE',
+            },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'artifacts', 'tcWithTheKey.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report with no violations, passes and incomplete with optional reportFileName, url and project key params', async () => {
+        const reportFileName = 'tcAllPassed.html';
         createHtmlReport({
-            violations: [],
-            passes: axeRawPassed,
-            incomplete: axeRawIncomplete,
-            reportFileName: 'tcAllPassed.html',
-            projectKey: 'DEQUE',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: [],
+                passes: axeRawPassed,
+                incomplete: axeRawIncomplete,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { reportFileName, projectKey: 'DEQUE' },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'artifacts', 'tcAllPassed.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report with no violations, passes and incomplete with optional reportFileName, url and project key params', async () => {
+        const reportFileName = 'tcInapplicablePresent.html';
         createHtmlReport({
-            violations: axeRawViolations,
-            passes: axeRawPassed,
-            incomplete: axeRawIncomplete,
-            inapplicable: axeRawInapplicable,
-            reportFileName: 'tcInapplicablePresent.html',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: axeRawViolations,
+                passes: axeRawPassed,
+                incomplete: axeRawIncomplete,
+                inapplicable: axeRawInapplicable,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { reportFileName },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'artifacts', 'tcAllPassed.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report with no violations, no passes, no incomplete, no inapplicable', async () => {
+        const reportFileName = 'tcOnlyPasses.html';
         createHtmlReport({
-            violations: [],
-            passes: [],
-            incomplete: [],
-            inapplicable: [],
-            reportFileName: 'tcOnlyPasses.html',
-            url: 'https://dequeuniversity.com/demo/mars/',
+            results: {
+                violations: [],
+                passes: [],
+                incomplete: [],
+                inapplicable: [],
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { reportFileName },
         });
-        const pathToTheReport = path.resolve(process.cwd(), 'artifacts', 'tcOnlyPasses.html');
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
     it('Verify report is created with violations and custom summary', async () => {
+        const reportFileName = 'tcIncludingCustomSummary.html';
         const customSummary = `Test Case: Full page analysis
@@ -144,22 +164,13 @@ <br>Steps:</br>
         createHtmlReport({
-            violations: axeRawViolations,
-            url: 'https://dequeuniversity.com/demo/mars/',
-            customSummary,
-            reportFileName: 'tcIncludingCustomSummary.html'
+            results: {
+                violations: axeRawViolations,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { reportFileName, customSummary },
         });
-        const pathToTheReport = path.resolve(
-            process.cwd(),
-            'artifacts',
-            'tcIncludingCustomSummary.html'
-        );
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
-        });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), { encoding: 'utf8' })
+        ).toMatchSnapshot();
     });
-
-    it('All optional parameters present', async () => {
-        const customSummary = `Test Case: Full page analysis
+    const customSummary = `Test Case: Full page analysis
         <br>Steps:</br>
@@ -170,25 +181,33 @@ <ol style="margin: 0">
         </ol>`;
+    it('All optional parameters present', async () => {
+        const reportFileName = 'tsAllOptionalParametersPresent.html';
         createHtmlReport({
-            violations: axeRawViolations,
-            passes: axeRawPassed,
-            incomplete: [],
-            inapplicable: axeRawInapplicable,
-            projectKey: 'DEQUE',
-            url: 'https://dequeuniversity.com/demo/mars/',
-            customSummary,
-            outputDir: 'docs',
-            reportFileName: 'index.html'
+            results: {
+                violations: axeRawViolations,
+                passes: axeRawPassed,
+                incomplete: [],
+                inapplicable: axeRawInapplicable,
+                url: 'https://dequeuniversity.com/demo/mars/',
+            },
+            options: { projectKey: 'DEQUE', customSummary, reportFileName },
         });
-        const pathToTheReport = path.resolve(
-            process.cwd(),
-            'artifacts',
-            'tcIncludingCustomSummary.html'
-        );
-        const htmlFileContent = fs.readFileSync(pathToTheReport, {
-            encoding: 'utf8',
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName), {
+                encoding: 'utf8',
+            })
+        ).toMatchSnapshot();
+    });
+    it('AxeResults passed', async () => {
+        const reportFileName = 'index.html';
+        const outputDir = 'docs';
+        createHtmlReport({
+            results: rawAxeResults,
+            options: { projectKey: 'DEQUE', customSummary, outputDir, reportFileName },
         });
-        // do not clean up to verify results manually
-        // validate
-        expect(htmlFileContent).toMatchSnapshot();
+        expect(
+            fs.readFileSync(getPathToCreatedReport(reportFileName, outputDir), {
+                encoding: 'utf8',
+            })
+        ).toMatchSnapshot();
     });
 });

No alert changes

Improved metrics

Total package byte prevSize

2155578

increased by20.64%

Number of package files

34

increased by13.33%

Lines of code

27200

increased by6.24%

Worsened metrics

Number of lines in readme file

136

decreased by-4.23%

No dependency changes