testaro 5.6.2 → 5.7.0

package/README.md

@@ -6,7 +6,7 @@ Federated accessibility test automation
 
 Testaro is a collection of collections of web accessibility tests.
 
-The purpose of Testaro is to provide programmatic access to over 800 accessibility tests defined in several test packages and in Testaro itself.
+The purpose of Testaro is to provide programmatic access to 1228 accessibility tests defined in several test packages and in Testaro itself.
 
 ## System requirements
 
@@ -26,6 +26,9 @@ Testaro includes some of its own accessibility tests. In addition, it performs t
 - [axe-playwright](https://www.npmjs.com/package/axe-playwright) (Deque Axe-core)
 - [Tenon](https://tenon.io/documentation/what-tenon-tests.php) (Level Access)
 - [WAVE API](https://wave.webaim.org/api/) (WebAIM WAVE)
+- [Nu Html Checker](https://github.com/validator/validator)
+
+Some of the Testaro tests are derived from tests performed by the [BBC Accessibility Standards Checker](https://github.com/bbc/bbc-a11y).
 
 As of this version, the counts of tests in the packages referenced above were:
 - Alfa: 103
@@ -35,9 +38,10 @@ As of this version, the counts of tests in the packages referenced above were:
 - HTML CodeSniffer: 98
 - Tenon: 180
 - WAVE: 110
+- Nu Html Checker: 147
 - subtotal: 612
-- Testaro tests: 16
-- grand total: 1075
+- Testaro tests: 22
+- grand total: 1228
 
 ## Code organization
 
@@ -330,6 +334,10 @@ The changes in `htmlcs/HTMLCS.js` are:
 >       );
 ```
 
+###### BBC Accessibility Standards Checker
+
+The BBC Accessibility Standards Checker has obsolete dependencies with security vulnerabilities. Therefore, it is not used as a dependency of Testaro. Instead, 6 of its tests were reimplemented, in some case with revisions, as Testaro tests. They were drawn from the 18 automated tests of the Checker. The other 12 tests were found too duplicative of other tests to justify reimplementation.
+
 ##### Branching
 
 An example of a **branching** command is:

package/commands.js

@@ -170,6 +170,12 @@ exports.commands = {
         withItems: [true, 'boolean']
       }
     ],
+    focVis: [
+      'Perform a focVis test',
+      {
+        withItems: [true, 'boolean']
+      }
+    ],
     hover: [
       'Perform a hover test',
       {
@@ -196,6 +202,12 @@ exports.commands = {
         withItems: [true, 'boolean']
       }
     ],
+    linkTo: [
+      'Perform a linkTo test',
+      {
+        withItems: [true, 'boolean']
+      }
+    ],
     linkUl: [
       'Perform a linkUl test',
       {
@@ -208,6 +220,12 @@ exports.commands = {
         withItems: [true, 'boolean']
       }
     ],
+    miniText: [
+      'Perform a miniText test',
+      {
+        withItems: [true, 'boolean']
+      }
+    ],
     motion: [
       'Perform a motion test',
       {
@@ -216,6 +234,12 @@ exports.commands = {
         count: [true, 'number', '', 'count of screen shots to make']
       }
     ],
+    nonTable: [
+      'Perform a nonTable test',
+      {
+        withItems: [true, 'boolean']
+      }
+    ],
     radioSet: [
       'Perform a radioSet test',
       {
@@ -240,6 +264,12 @@ exports.commands = {
         id: [true, 'string', 'hasLength', 'ID of the requested test instance']
       }
     ],
+    titledEl: [
+      'Perform a titledEl test',
+      {
+        withItems: [true, 'boolean']
+      }
+    ],
     wave: [
       'Perform a WebAIM WAVE test',
       {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "testaro",
-  "version": "5.6.2",
+  "version": "5.7.0",
   "description": "Automation of accessibility testing",
   "main": "index.js",
   "scripts": {

package/run.js

@@ -33,22 +33,29 @@ const tests = {
   axe: 'Axe',
   bulk: 'count of visible elements',
   continuum: 'Level Access Continuum, community edition',
+  docType: 'document without a doctype property',
   embAc: 'active elements embedded in links or buttons',
   focAll: 'focusable and Tab-focused elements',
   focInd: 'focus indicators',
   focOp: 'focusability and operability',
+  focVis: 'links that are invisible when focused',
   hover: 'hover-caused content changes',
   htmlcs: 'HTML CodeSniffer WCAG 2.1 AA ruleset',
   ibm: 'IBM Accessibility Checker',
   labClash: 'labeling inconsistencies',
+  linkTo: 'links without destinations',
   linkUl: 'adjacent-link underlining',
   menuNav: 'keyboard navigation between focusable menu items',
+  miniText: 'text smaller than 11 pixels',
   motion: 'motion',
+  nonTable: 'table elements used for layout',
+  nuVal: 'failures to pass the Nu Html Checker',
   radioSet: 'fieldset grouping of radio buttons',
   role: 'roles',
   styleDiff: 'style inconsistencies',
   tabNav: 'keyboard navigation between tab elements',
   tenon: 'Tenon',
+  titledEl: 'title attributes on inappropriate elements',
   wave: 'WAVE',
   zIndex: 'z indexes'
 };

package/samples/scripts/tp14.json

@@ -1,8 +1,8 @@
 {
-  "id": "tp12",
+  "id": "tp14",
   "what": "Alfa, Axe, Continuum, HTML CodeSniffer, IBM, Tenon, WAVE, and 16 custom tests",
   "strict": true,
-  "timeLimit": 300,
+  "timeLimit": 400,
   "commands": [
     {
       "type": "launch",

package/samples/scripts/tp15.json

@@ -0,0 +1,173 @@
+{
+  "id": "tp15",
+  "what": "Alfa, Axe, Continuum, HTML CodeSniffer, IBM, Nu Html Checker, Tenon, WAVE, and 22 custom tests",
+  "strict": true,
+  "timeLimit": 500,
+  "commands": [
+    {
+      "type": "launch",
+      "which": "webkit",
+      "what": "Webkit browser"
+    },
+    {
+      "type": "url",
+      "which": "https://*",
+      "what": "any page"
+    },
+    {
+      "type": "tenonRequest",
+      "id": "a",
+      "withNewContent": true,
+      "what": "Tenon API version 2 test request"
+    },
+    {
+      "type": "test",
+      "which": "motion",
+      "what": "spontaneous change of content; requires webkit",
+      "delay": 2500,
+      "interval": 2500,
+      "count": 5
+    },
+    {
+      "type": "launch",
+      "which": "chromium",
+      "what": "Chromium browser"
+    },
+    {
+      "type": "url",
+      "which": "https://*",
+      "what": "any page"
+    },
+    {
+      "type": "test",
+      "which": "bulk",
+      "what": "count of visible elements"
+    },
+    {
+      "type": "test",
+      "which": "embAc",
+      "withItems": true,
+      "what": "active elements incorrectly embedded in each other"
+    },
+    {
+      "type": "test",
+      "which": "focAll",
+      "what": "Tab-focusability"
+    },
+    {
+      "type": "test",
+      "which": "focInd",
+      "revealAll": false,
+      "allowedDelay": 250,
+      "withItems": true,
+      "what": "focus indicators"
+    },
+    {
+      "type": "test",
+      "which": "focOp",
+      "withItems": true,
+      "what": "focusability and operability of elements"
+    },
+    {
+      "type": "test",
+      "which": "hover",
+      "headSize": 40,
+      "headSampleSize": 20,
+      "tailSampleSize": 15,
+      "withItems": true,
+      "what": "hover impacts"
+    },
+    {
+      "type": "test",
+      "which": "labClash",
+      "withItems": true,
+      "what": "unlabeled and mislabeled form controls"
+    },
+    {
+      "type": "test",
+      "which": "linkUl",
+      "withItems": true,
+      "what": "underlining of inline links"
+    },
+    {
+      "type": "test",
+      "which": "menuNav",
+      "withItems": true,
+      "what": "keyboard navigation within true-focus menus"
+    },
+    {
+      "type": "test",
+      "which": "radioSet",
+      "withItems": true,
+      "what": "grouping of radio buttons in fieldsets"
+    },
+    {
+      "type": "test",
+      "which": "role",
+      "what": "validity and necessity of role assignments"
+    },
+    {
+      "type": "test",
+      "which": "styleDiff",
+      "withItems": true,
+      "what": "style consistency of headings, buttons, and links"
+    },
+    {
+      "type": "test",
+      "which": "tabNav",
+      "withItems": true,
+      "what": "keyboard navigation within tab lists"
+    },
+    {
+      "type": "test",
+      "which": "zIndex",
+      "withItems": true,
+      "what": "elements with non-auto z indexes"
+    },
+    {
+      "type": "test",
+      "which": "alfa",
+      "what": "Siteimprove alfa"
+    },
+    {
+      "type": "test",
+      "which": "axe",
+      "detailLevel": 2,
+      "rules": [],
+      "what": "Axe core, all rules"
+    },
+    {
+      "type": "test",
+      "which": "continuum",
+      "what": "Continuum"
+    },
+    {
+      "type": "test",
+      "which": "htmlcs",
+      "what": "HTML CodeSniffer"
+    },
+    {
+      "type": "test",
+      "which": "ibm",
+      "withItems": true,
+      "what": "IBM Accessibility Checker, with page content and again with URL"
+    },
+    {
+      "type": "test",
+      "which": "nuVal",
+      "what": "Nu Html Checker"
+    },
+    {
+      "type": "test",
+      "which": "wave",
+      "reportType": 4,
+      "what": "WAVE, report-type 4"
+    },
+    {
+      "type": "test",
+      "which": "tenon",
+      "id": "a",
+      "what": "Tenon API version 2 result retrieval"
+    }
+  ]
+}

package/tests/docType.js

@@ -0,0 +1,12 @@
+/*
+  docType
+  Derived from the bbc-a11y allDocumentsMustHaveAW3cRecommendedDoctype test.
+  This test reports a failure to equip the page document with a W3C-recommended doctype.
+*/
+exports.reporter = async page => {
+  // Identify the visible links without href attributes.
+  const docType = await page.evaluate(() => document.doctype);
+  return {result: {
+    docHasType: Boolean(docType)
+  }};
+};

package/tests/focVis.js

@@ -0,0 +1,29 @@
+/*
+  focVis
+  Derived from the bbc-a11y elementsMustBeVisibleOnFocus test.
+  This test reports links that are off the display when focused.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the initially visible links.
+  const badLinks = await page.$$eval('a:visible', links => {
+    // FUNCTION DEFINITION START
+    // Returns a space-minimized copy of a string.
+    const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
+    // FUNCTION DEFINITION END
+    const badLinks = [];
+    links.forEach(link => {
+      link.focus();
+      if (link.offsetTop + link.offsetHeight <= 0 || link.offsetLeft + link.offsetWidth <= 0) {
+        badLinks.push(compact(link.textContent));
+      }
+    });
+    return badLinks;
+  });
+  const data = {
+    totals: badLinks.length
+  };
+  if (withItems) {
+    data.items = badLinks;
+  }
+  return {result: data};
+};

package/tests/linkTo.js

@@ -0,0 +1,25 @@
+/*
+  linkTo
+  Derived from the bbc-a11y anchorsMustHaveHrefs test.
+  This test reports failures to equip links with destinations.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the visible links without href attributes.
+  const badLinkTexts = await page.$$eval(
+    'a:not([href]):visible',
+    badLinks => {
+      // FUNCTION DEFINITION START
+      // Returns a space-minimized copy of a string.
+      const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
+      // FUNCTION DEFINITION END
+      return badLinks.map(link => compact(link.textContent));
+    }
+  );
+  const data = {
+    totals: badLinkTexts.length
+  };
+  if (withItems) {
+    data.items = badLinkTexts;
+  }
+  return {result: data};
+};

package/tests/miniText.js

@@ -0,0 +1,48 @@
+/*
+  miniText
+  Derived from the bbc-a11y textCannotBeTooSmall test.
+  This test reports text nodes smaller than 11 pixels.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the text nodes smaller than 11 pixels.
+  const miniTexts = await page.$$eval(
+    'body *:not(script, style):visible',
+    elements => {
+      // FUNCTION DEFINITION START
+      // Returns a space-minimized copy of a string.
+      const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
+      // FUNCTION DEFINITION END
+      const textParents = new Set();
+      const miniTexts = [];
+      elements.forEach(element => {
+        element.childNodes.forEach(node => {
+          if (node.nodeType === 3) {
+            const nodeText = compact(node.textContent);
+            if (nodeText) {
+              textParents.add(element);
+            }
+          }
+        });
+      });
+      textParents.forEach(textParent => {
+        const {fontSize} = window.getComputedStyle(textParent);
+        const pixels = Number.parseInt(fontSize);
+        if (pixels < 11) {
+          textParent.childNodes.forEach(node => {
+            if (node.nodeType === 3 && compact(node.textContent)) {
+              miniTexts.push(compact(node.textContent));
+            }
+          });
+        }
+      });
+      return miniTexts;
+    }
+  );
+  const data = {
+    totals: miniTexts.length
+  };
+  if (withItems) {
+    data.items = miniTexts;
+  }
+  return {result: data};
+};

package/tests/nonTable.js

@@ -0,0 +1,55 @@
+/*
+  nonTable
+  Derived from the bbc-a11y useTablesForData test. Crude heuristics omitted.
+  This test reports tables used for layout.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the visible links without href attributes.
+  const badTableTexts = await page.$$eval('table', tables => {
+    const badTableTexts = [];
+    // FUNCTION DEFINITIONS START
+    // Returns a space-minimized copy of a string.
+    const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
+    const addBad = table => {
+      badTableTexts.push(compact(table.outerHTML).slice(0, 100));
+    };
+    // FUNCTION DEFINITIONS END
+    tables.forEach(table => {
+      const role = table.getAttribute('role');
+      if (
+        table.caption
+        || ['grid', 'treegrid'].includes(role)
+        || table.querySelector('col, colgroup, tfoot, thead, th')
+      ) {
+        return;
+      }
+      else if (table.querySelector('table')) {
+        addBad(table);
+        return;
+      }
+      else if (
+        table.querySelectorAll('tr').length === 1
+        || Math.max(
+          ... Array
+          .from(table.querySelectorAll('tr'))
+          .map(row => Array.from(row.querySelectorAll('td')).length)
+        ) === 1
+      ) {
+        addBad(table);
+        return;
+      }
+      else if (table.querySelector('object, embed, applet, audio, video')) {
+        addBad(table);
+        return;
+      }
+    });
+    return badTableTexts;
+  });
+  const data = {
+    totals: badTableTexts.length
+  };
+  if (withItems) {
+    data.items = badTableTexts;
+  }
+  return {result: data};
+};

package/tests/nuVal.js

@@ -0,0 +1,46 @@
+/*
+  nuVal
+  This test subjects a page to the Nu Html Checker.
+*/
+const https = require('https');
+exports.reporter = async page => {
+  const pageContent = await page.content();
+  // Get the data from a Nu validation.
+  const data = await new Promise(resolve => {
+    const request = https.request(
+      {
+        host: 'validator.nu',
+        path: '/?parser=html&out=json',
+        method: 'POST',
+        headers: {
+          'User-Agent': 'Mozilla/5.0',
+          'Content-Type': 'text/html; charset=utf-8'
+        }
+      },
+      response => {
+        let report = '';
+        response.on('data', chunk => {
+          report += chunk;
+        });
+        // When the data arrive:
+        response.on('end', async () => {
+          try {
+            // Delete unnecessary properties.
+            const result = JSON.parse(report);
+            return resolve(result);
+          }
+          catch (error) {
+            return resolve({
+              prevented: true,
+              error: error.message,
+              report
+            });
+          }
+        });
+      }
+    );
+    request.write(pageContent);
+    request.end();
+  });
+  return {result: data};
+};

package/tests/role.js

@@ -2,15 +2,19 @@
   role
   This test reports role assignment that violate either an applicable standard or an applicable
   recommendation from WAI-ARIA. Invalid roles include those that are abstract and thus prohibited
-  from direct use, and those that are implicit in HTML elements and thus advised against. The math
-  role has been removed, because of poor adoption and exclusion from HTML5. The img role has
-  accessibility uses, so is not classified as deprecated. See:
+  from direct use, and those that are implicit in HTML elements and thus advised against. Roles
+  that explicitly confirm implicit roles are deemed redundant and can be scored as less serious
+  than roles that override implicit roles. The math role has been removed, because of poor
+  adoption and exclusion from HTML5. The img role has accessibility uses, so is not classified
+  as deprecated. See:
     https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Role_Img
     https://www.w3.org/TR/html-aria/
     https://www.w3.org/TR/wai-aria/#roles_categorization
 */
 exports.reporter = async page => await page.$eval('body', body => {
+
   // CONSTANTS
+
   const badRoles = new Set([
     'article',
     'banner',
@@ -354,7 +358,32 @@ exports.reporter = async page => await page.$eval('body', body => {
   };
   // Array of th and td elements with redundant roles.
   const redundantCells = [];
+  // Elements with role attributes.
+  const roleElements = Array.from(body.querySelectorAll('[role]'));
+  // th and td elements with redundant roles.
+  const gridHeaders = Array.from(
+    document.body.querySelectorAll('table[role=grid] th, table[role=treegrid] th')
+  );
+  const gridCells = Array.from(
+    document.body.querySelectorAll('table[role=grid] td, table[role=treegrid] td')
+  );
+  const tableHeaders = Array.from(
+    document.body.querySelectorAll('table[role=table] th, table:not([role]) th')
+  );
+  const tableCells = Array.from(
+    document.body.querySelectorAll('table[role=table] td, table:not([role]) td')
+  );
+  // Initialized result.
+  const data = {
+    roleElements: roleElements.length,
+    badRoleElements: 0,
+    redundantRoleElements: 0,
+    tagNames: {}
+  };
+
   // FUNCTIONS
+
+  // Initializes the results.
   const dataInit = (data, tagName, role) => {
     if (! data.tagNames[tagName]) {
       data.tagNames[tagName] = {};
@@ -366,6 +395,7 @@ exports.reporter = async page => await page.$eval('body', body => {
       };
     }
   };
+  // 
   const tallyTableRedundancy = (elements, okRoles, tagName) => {
     elements.forEach(element => {
       const role = element.getAttribute('role');
@@ -377,35 +407,16 @@ exports.reporter = async page => await page.$eval('body', body => {
       }
     });
   };
+
   // OPERATION
+
   // Remove the deprecated roles from the non-abstract roles.
   goodRoles.forEach(role => {
     if (badRoles.has(role)) {
       goodRoles.delete(role);
     }
   });
-  // Identify all elements with role attributes.
-  const roleElements = Array.from(body.querySelectorAll('[role]'));
-  // Initialize the result.
-  const data = {
-    roleElements: roleElements.length,
-    badRoleElements: 0,
-    redundantRoleElements: 0,
-    tagNames: {}
-  };
-  // Identify the th and td elements with redundant roles.
-  const gridHeaders = Array.from(
-    document.body.querySelectorAll('table[role=grid] th, table[role=treegrid] th')
-  );
-  const gridCells = Array.from(
-    document.body.querySelectorAll('table[role=grid] td, table[role=treegrid] td')
-  );
-  const tableHeaders = Array.from(
-    document.body.querySelectorAll('table[role=table] th, table:not([role]) th')
-  );
-  const tableCells = Array.from(
-    document.body.querySelectorAll('table[role=table] td, table:not([role]) td')
-  );
+  // Identify the table elements with redundant roles.
   tallyTableRedundancy(gridHeaders, ['columnheader', 'rowheader', 'gridcell'], 'TH');
   tallyTableRedundancy(gridCells, ['gridcell'], 'TD');
   tallyTableRedundancy(tableHeaders, ['columnheader', 'rowheader', 'cell'], 'TH');
@@ -422,6 +433,7 @@ exports.reporter = async page => await page.$eval('body', body => {
         const lcTagName = tagName.toLowerCase();
         // If it is simply redundant:
         if (role === implicitRoles[lcTagName]) {
+          // Update the results.
           data.redundantRoleElements++;
           data.tagNames[tagName][role].redundant++;
         }
@@ -446,18 +458,20 @@ exports.reporter = async page => await page.$eval('body', body => {
             )
           )
         ) {
+          // Update the results.
           data.redundantRoleElements++;
           data.tagNames[tagName][role].redundant++;
         }
         // Otherwise, i.e. if it is absolutely invalid:
         else {
+          // Update the results.
           data.badRoleElements++;
           data.tagNames[tagName][role].bad++;
         }
       }
       // Otherwise, i.e. if it is absolutely invalid:
       else {
-        // Add the facts to the result.
+        // Update the results.
         data.badRoleElements++;
         dataInit(data, tagName, role);
         data.tagNames[tagName][role].bad++;

package/tests/titledEl.js

@@ -0,0 +1,29 @@
+/*
+  titledEl
+  Derived from the bbc-a11y titleAttributesOnlyOnInputs test.
+  This test reports title attributes on inappropriate elements.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the inappropriate elements with title attributes.
+  const badTitleElements = await page.$$eval(
+    '[title]:not(input, button, textarea, select, iframe):visible',
+    badTitleElements => {
+      // FUNCTION DEFINITION START
+      // Returns a space-minimized copy of a string.
+      const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
+      // FUNCTION DEFINITION END
+      return badTitleElements.map(element => ({
+        tagName: element.tagName,
+        text: compact(element.textContent),
+        title: compact(element.title)
+      }));
+    }
+  );
+  const data = {
+    totals: badTitleElements.length
+  };
+  if (withItems) {
+    data.items = badTitleElements;
+  }
+  return {result: data};
+};

package/tests/wave.js

@@ -41,7 +41,7 @@ exports.reporter = async (page, reportType) => {
                 const {guidelines} = issueDoc;
                 items[issueName].wcag = guidelines;
               });
-            })
+            });
             return resolve(result);
           }
           catch (error) {