Merge pull request #1454 from IBMa/update-puppeteer-19

chore(node): Update to latest Puppeteer (20.2.0)

.github/workflows/test.yml

@@ -117,15 +117,15 @@ jobs:
       - run: npm run build
         working-directory: accessibility-checker
 
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Baselines/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Baselines/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Functions.Defined/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Functions.Defined/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.ObjectStructure/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.ObjectStructure/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.assertionCompliance.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.assertionCompliance.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.Puppeteer.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.Puppeteer.test.mjs
         working-directory: accessibility-checker
 
 ###############################################################################
@@ -163,15 +163,15 @@ jobs:
       - run: npm run build
         working-directory: accessibility-checker
 
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Baselines/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Baselines/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Functions.Defined/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Functions.Defined/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.ObjectStructure/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.ObjectStructure/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.assertionCompliance.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.assertionCompliance.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.Puppeteer.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.Puppeteer.test.mjs
         working-directory: accessibility-checker
 
 ###############################################################################
@@ -209,9 +209,9 @@ jobs:
       - run: npm run build
         working-directory: accessibility-checker
 
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.Content.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.URL.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Fast/aChecker.Scans/aChecker.URL.test.mjs
         working-directory: accessibility-checker
 
 ###############################################################################
@@ -249,9 +249,9 @@ jobs:
       - run: npm run build
         working-directory: accessibility-checker
 
-      - run: npx mocha -R dot test/mocha/aChecker.Slow1/aChecker.Scans/**/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Slow1/aChecker.Scans/**/*.test.mjs
         working-directory: accessibility-checker
-      - run: npx mocha -R dot test/mocha/aChecker.Slow1/aChecker.ObjectStructure/**/*.test.js
+      - run: npx mocha -R dot test/mocha/aChecker.Slow1/aChecker.ObjectStructure/**/*.test.mjs
         working-directory: accessibility-checker
 
 

accessibility-checker-engine/test/v2/checker/accessibility/rules/text_contrast_sufficient_ruleunit/act_pass_10.html

@@ -7,7 +7,10 @@
 
 <body>
 
-  <button>My button!</button>
+    <!-- Specify the background style because Windows default colors are #f0f0f0 
+        instead of #efefef used by Mac / Linux
+    -->
+  <button style="background-color: #efefef;">My button!</button>
 
 <script type="text/javascript">
         UnitTest = {

accessibility-checker/.gitignore

@@ -8,4 +8,5 @@ results
 package-lock.json
 src/**/*.js
 src/**/*.map
-src/**/*.d.ts
+src/**/*.d.ts
+!src/bin/achecker.js

accessibility-checker/boilerplates/cucumber-selenium/features/Demo.feature

@@ -1,15 +1,15 @@
 Feature: Cucumber Demo
     Demonstrate a basic usage of AAT
 
-    Scenario: Check pages and fail when issues found
-        Given I am at URL "http://www.altoromutual.com/"
-        Then Page is accessible with label "DEMO1"
-        When I click on ID "CatLink1"
-        Then Page is accessible with label "DEMO1_Personal"
+#    Scenario: Check pages and fail when issues found
+#        Given I am at URL "https://altoromutual.12mc9fdq8fib.us-south.codeengine.appdomain.cloud/#"
+#        Then Page is accessible with label "DEMO1"
+#        When I click on ID "feedbackButton"
+#        Then Page is accessible with label "DEMO1_Personal"
 
     Scenario: Check pages, but just record results when issues found
-        Given I am at URL "http://www.altoromutual.com/"
+        Given I am at URL "https://altoromutual.12mc9fdq8fib.us-south.codeengine.appdomain.cloud/#"
         Then Scan page for accessibility with label "DEMO2"
-        When I click on ID "CatLink1"
+        When I click on ID "feedbackButton"
         Then Scan page for accessibility with label "DEMO2_Personal"
 

accessibility-checker/boilerplates/cucumber-selenium/features/step_definitions/browser_step.js

@@ -23,11 +23,16 @@ When(/^I click on XPath "([^"]*)"$/, function(selector) {
     });
 });
 
-When(/^I click on ID "([^"]*)"$/, function(selector) {
+When(/^I click on ID "([^"]*)"$/, async function(selector) {
     const myThis = this;
     const condition = until.elementLocated(By.id(selector));
-    return myThis.driver.wait(condition, 8000).then(function() {
-        return myThis.driver.findElement(By.id(selector)).click();
+    return myThis.driver.wait(condition, 8000).then(async function() {
+        let elem = await myThis.driver.findElement(By.id(selector));
+        let rect = await elem.getRect();
+        await myThis.driver.executeScript(`window.scrollTo(${rect.x+rect.width}, ${rect.y+rect.height});`);
+        await myThis.driver.sleep(2000);
+        await elem.click();
+        await myThis.driver.sleep(2000);
     });
 });
 

accessibility-checker/boilerplates/cucumber-selenium/features/step_definitions/hooks.js

@@ -25,12 +25,10 @@ function getBrowserChrome() {
 
     const options = new chrome.Options();
     options.addArguments("--disable-dev-shm-usage");
-    options.addArguments("--headless");
+    options.addArguments("--headless=new");
     options.addArguments('--ignore-certificate-errors')
 
     let service = new chrome.ServiceBuilder(spath).build();
-    // setDefaultService function is removed since web-driver v4.3.1+
-    //chrome.setDefaultService(service);
     chrome.Driver.createSession(options, service);
 
     return new webdriver.Builder()
@@ -61,7 +59,6 @@ const {BeforeAll, AfterAll, Before} = require("cucumber");
 
     BeforeAll(function() {
         driver = getBrowser();
-
         /*
         return new Promise(function(resolve, reject) {
             aChecker.onRunComplete(resolve);

accessibility-checker/boilerplates/jest-selenium/test/basic.test.js

@@ -18,7 +18,7 @@ beforeAll(function() {
 
         const options = new chrome.Options();
         options.addArguments("--disable-dev-shm-usage");
-        options.addArguments("--headless");
+        options.addArguments("--headless=new");
         options.addArguments('--ignore-certificate-errors')
 
         const service = new chrome.ServiceBuilder(spath).build();

accessibility-checker/boilerplates/mocha-puppeteer-ts/package.json

@@ -2,6 +2,7 @@
   "name": "@ibma/ac-boilerplate-mocha-ts",
   "version": "3.0.0",
   "description": "Example usage of Accessibility Checker with Mocha and typescript",
+  "type": "module",
   "main": "src/app.js",
   "scripts": {
     "test": "tsc && mocha test/*.test.js"
@@ -13,7 +14,7 @@
     "accessibility-checker": "*",
     "chai": "^4.3.0",
     "mocha": "^8.3.0",
-    "puppeteer": "^13.4.0",
+    "puppeteer": "^20.2.1",
     "typescript": "^4.1.5"
   }
 }

accessibility-checker/boilerplates/mocha-puppeteer-ts/test-ts/basic.test.ts

@@ -6,13 +6,16 @@ import * as path from "path";
 import { expect } from "chai";
 import { before, after, describe, it } from "mocha";
 import { ICheckerReport } from "accessibility-checker/lib/api/IChecker";
+import { dirname } from 'path';
+import { fileURLToPath } from 'url';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 let browser: Puppeteer.Browser;
 let page: Puppeteer.Page;
 
 before(async () => {
     try {
-        browser = await Puppeteer.launch();
+        browser = await Puppeteer.launch({ headless: "new"});
         page = await browser.newPage();
     } catch (e) {
         console.log(e);
@@ -33,14 +36,14 @@ describe("Hello World Basics", function () {
 
         const result = await getCompliance(page, "HOME");
         const report = result!.report;
-        expect(assertCompliance(report)).to.equal(0, stringifyResults(report));
+        expect(assertCompliance(report as ICheckerReport)).to.equal(0, stringifyResults(report as ICheckerReport));
     }).timeout(10000);
 
     it("Homepage, Show Card", async() => {
         await page.click("#clickMe");
         const result = await getCompliance(page, "HOME_CARD");
         const report = result!.report;
-        expect(assertCompliance(report)).to.equal(0, stringifyResults(report));
+        expect(assertCompliance(report as ICheckerReport)).to.equal(0, stringifyResults(report as ICheckerReport));
     }).timeout(10000);
 });
 //# sourceMappingURL=basic.test.js.map

accessibility-checker/boilerplates/mocha-puppeteer-ts/tsconfig.json

@@ -2,7 +2,8 @@
     "compilerOptions": {
         "declaration": true,
         "allowJs": true,
-        "target": "ES5",
+        "target": "ES6",
+        "module": "es2022",
         "removeComments": false,
         "noEmitOnError": true,
         "sourceMap": true,

accessibility-checker/gulp/gulpfile.js → accessibility-checker/gulp/gulpfile.mjs

@@ -31,13 +31,13 @@ function notice(years) {
         " *****************************************************************************/\n";
 }
 
-const gulp = require("gulp"),
-    ginsert = require("gulp-insert"),
-    greplace = require("gulp-replace"),
-    terser = require("gulp-terser");
+import gulp from "gulp";
+import ginsert from "gulp-insert";
+import greplace from "gulp-replace";
+import terser from "gulp-terser";
 
 gulp.task("build-uglify", function () {
-    return gulp.src(["../src/**/lib/**/*.js", "../src/index.js", "!../src/node_modules/**"])
+    return gulp.src(["../src/**/lib/**/*.js", "../src/*/index.js", "!../src/node_modules/**"])
         .pipe(terser())
         .pipe(greplace('if(void 0===globalThis.ace_ibma)', "if('undefined' === typeof(globalThis.ace_ibma))"))
         .pipe(ginsert.prepend(notice("2016,2017,2018,2019")))

accessibility-checker/package.json

@@ -8,25 +8,24 @@
     "lint": "eslint src",
     "test": "mocha -R dot test/mocha/**/*.test.js test/a11y-rule-test-able/*.test.js",
     "build": "npm run build:report && npm run build:ts && cd ../accessibility-checker-engine && npm install && npm run build && npm run build-debug && npm run build-node && npm run build-node-debug",
-    "build:ts": "npx tsc",
+    "build:ts": "npx tsc -p tsconfig.json && npx tsc -p tsconfig-cjs.json",
     "build:report": "(cd ../report-react && npm run build && cd ../accessibility-checker && shx cp ../report-react/build/genReport.tsx ./src-ts/lib/reporters/genReport.ts)",
-    "package:zip": "shx rm -rf package && gulp --gulpfile gulp/gulpfile.js && shx chmod u+x package/bin/*.js && cd package && npm pack",
-    "package:npm": "shx rm -rf package && gulp --gulpfile gulp/gulpfile.js && shx chmod u+x package/bin/*.js"
+    "package:zip": "shx rm -rf package && gulp --gulpfile gulp/gulpfile.mjs && shx chmod u+x package/bin/*.js && cd package && npm pack",
+    "package:npm": "shx rm -rf package && gulp --gulpfile gulp/gulpfile.mjs && shx chmod u+x package/bin/*.js"
   },
   "repository": {
     "type": "git",
     "url": "[email protected]/IBMa/equal-access/accessibility-checker"
   },
   "engines": {
-    "node": ">=10"
+    "node": ">=16"
   },
   "dependencies": {
-    "axios": "^0.27.2",
     "chromedriver": "*",
     "deep-diff": "^1.0.2",
     "exceljs": "^4.3.0",
     "js-yaml": "^4.1.0",
-    "puppeteer": "^13.0.0",
+    "puppeteer": "^20.2.1",
     "string-hash": "^1.1.3",
     "uuid": "^8.3.2"
   },

accessibility-checker/src-ts/bin/achecker.js

@@ -15,11 +15,11 @@
     See the License for the specific language governing permissions and
     limitations under the License.
   *****************************************************************************/
- 
-const aChecker = require("../index.js")
-const fs = require('fs');
-const readline = require('readline');
-const path = require("path");
+
+import * as aChecker from "../index.js";
+import * as fs from "fs";
+import * as readline from "readline";
+import * as path from "path";
 
 let validCLParams = [
     "inputFile"

accessibility-checker/src-ts/index.ts

@@ -14,12 +14,12 @@
     limitations under the License.
   *****************************************************************************/
 
-import { ACBrowserManager } from "./lib/ACBrowserManager";
-import { ACConfigManager } from "./lib/ACConfigManager";
-import { ACEngineManager } from "./lib/ACEngineManager";
-import { getComplianceHelper } from "./lib/ACHelper";
-import { ACReportManager } from "./lib/ACReportManager";
-import { eAssertResult, ICheckerReport, ICheckerResult, IConfig, IConfigUnsupported, ReportResult } from "./lib/api/IChecker";
+import { ACBrowserManager } from "./lib/ACBrowserManager.js";
+import { ACConfigManager } from "./lib/ACConfigManager.js";
+import { ACEngineManager } from "./lib/ACEngineManager.js";
+import { getComplianceHelper } from "./lib/ACHelper.js";
+import { ACReportManager } from "./lib/ACReportManager.js";
+import { eAssertResult, ICheckerReport, ICheckerResult, IConfig, IConfigUnsupported, ReportResult } from "./lib/api/IChecker.js";
 /**
  * This function is responsible performing a scan based on the context that is provided, following are
  * the supported context type:

accessibility-checker/src-ts/lib/ACBrowserManager.ts

@@ -1,6 +1,6 @@
 import * as puppeteer from "puppeteer";
-import { IConfigUnsupported } from "./api/IChecker";
-import { ACConfigManager } from "./ACConfigManager";
+import { IConfigUnsupported } from "./api/IChecker.js";
+import { ACConfigManager } from "./ACConfigManager.js";
 
 
 export class ACBrowserManager {

accessibility-checker/src-ts/lib/ACConfigManager.ts

@@ -17,10 +17,9 @@
 import * as pathLib from "path";
 import * as fs from "fs";
 import * as YAML from "js-yaml";
-import { ACConstants } from "./ACConstants";
+import { ACConstants } from "./ACConstants.js";
 import { v4 as uuidv4 } from 'uuid';
-import { IConfig, IConfigUnsupported } from "./api/IChecker";
-import axios from "axios";
+import { IConfig, IConfigUnsupported } from "./api/IChecker.js";
 
 /**
  * This function is responsible converting policies into an Array based on string or Array.
@@ -100,8 +99,8 @@ async function processACConfig(ACConfig) {
         if (ACConfig.ignoreHTTPSErrors) {
             process.env.NODE_TLS_REJECT_UNAUTHORIZED="0"
         }
-        const response = await axios.get(ruleArchiveFile);
-        ruleArchiveParse = await response.data;
+        const response = await fetch(ruleArchiveFile);
+        ruleArchiveParse = await response.json();
     } catch (err) {
         console.log(err);
         throw new Error(err);
@@ -176,7 +175,7 @@ function initializeDefaults(config: IConfigUnsupported) {
     // Load in the package.json file so that we can extract the module name and the version to build
     // a toolID which needs to be used when results are build for the purpose of keeping track of
     // which tool is uploading the results.
-    let packageObject = require('../package.json');
+    const packageObject = JSON.parse(fs.readFileSync('./package.json').toString());
 
     // Build the toolID based on name and version
     config.toolID = packageObject.name + "-v" + packageObject.version;
@@ -271,7 +270,7 @@ function loadConfigFromYAMLorJSONFile() {
                     ACConstants.DEBUG && console.log("Loading: " + jsOrJSONFile)
 
                     // Load in as json or js and return this object
-                    return require(fileToCheck);
+                    return JSON.parse(fs.readFileSync(fileToCheck).toString());
                 }
             } catch (e) {
                 ACConstants.DEBUG && console.log("JSON or JS file does not exists, will load default config.")

accessibility-checker/src-ts/lib/ACConstants.ts

@@ -22,8 +22,8 @@
 // Load all the modules that are needed
 import { tmpdir } from "os";
 import * as pathLib from "path";
-import { IConfigUnsupported } from "./api/IChecker";
-import { eRuleLevel } from "./api/IEngine";
+import { IConfigUnsupported } from "./api/IChecker.js";
+import { eRuleLevel } from "./api/IEngine.js";
 
 // Used to specify all the constant
 export const ACConstants : IConfigUnsupported = {
@@ -81,5 +81,6 @@ export const ACConstants : IConfigUnsupported = {
     // both json and js are present it loads js first.
     configFiles: [".achecker.yml", ".achecker.yaml", "achecker", "aceconfig", pathLib.join(".config", ".achecker.yml"), pathLib.join(".config", ".achecker.yaml"), pathLib.join(".config", "achecker"), pathLib.join(".config", "aceconfig")],
 
-    ignoreHTTPSErrors: false
+    ignoreHTTPSErrors: false,
+    headless: "new"
 };