testaro 14.3.0 → 14.4.0

package/testaro/focInd.js

@@ -67,6 +67,7 @@ exports.reporter = async (page, withItems, revealAll = false, allowedDelay = 250
       if (withItems) {
         const elementData = {
           tagName,
+          id: element.id,
           text: (element.textContent.trim() || element.outerHTML.trim()).replace(/\s+/g, ' ')
           .slice(0, 100)
         };
@@ -174,8 +175,10 @@ exports.reporter = async (page, withItems, revealAll = false, allowedDelay = 250
         const qualifier = issueName === 'nonOutlinePresent' ? 'a non-outline' : 'no';
         standardInstances.push({
           issueID: `focInd-${issueName}`,
-          what: `Element ${item.tagName} has ${qualifier} focus indicator`,
+          what: `${item.tagName} element has ${qualifier} focus indicator`,
           ordinalSeverity: issueName === 'nonOutlinePresent' ? 2 : 3,
+          tagName: item.tagName,
+          id: item.id,
           location: {
             doc: '',
             type: '',
@@ -193,6 +196,8 @@ exports.reporter = async (page, withItems, revealAll = false, allowedDelay = 250
         what: 'Elements have missing focus indicators',
         count: types.indicatorMissing.total,
         ordinalSeverity: 3,
+        tagName: '',
+        id: '',
         location: {
           doc: '',
           type: '',
@@ -207,6 +212,8 @@ exports.reporter = async (page, withItems, revealAll = false, allowedDelay = 250
         what: 'Elements have non-outline focus indicators',
         count: types.nonOutlinePresent.total,
         ordinalSeverity: 2,
+        tagName: '',
+        id: '',
         location: {
           doc: '',
           type: '',

package/testaro/focOp.js

@@ -158,12 +158,12 @@ exports.reporter = async (page, withItems) => {
         : 'is operable but not focusable';
       const ordinalSeverity = issue === 'onlyFocusable' ? 2 : 3;
       data.items[issue].forEach(item => {
-        const itemID = item.id ? ` (ID ${item.id})` : '';
-        const which = `${item.tagName}${itemID}`;
         standardInstances.push({
           issueID,
-          what: `Element ${which} ${gripe}`,
+          what: `${item.tagName} element ${gripe}`,
           ordinalSeverity,
+          tagName: item.tagName,
+          id: item.id,
           location: {
             doc: '',
             type: '',
@@ -181,6 +181,8 @@ exports.reporter = async (page, withItems) => {
         what: 'Focusable elements are inoperable',
         count: totals[2],
         ordinalSeverity: 2,
+        tagName: '',
+        id: '',
         location: {
           doc: '',
           type: '',
@@ -195,6 +197,8 @@ exports.reporter = async (page, withItems) => {
         what: 'Operable elements are nonfocusable',
         count: totals[3],
         ordinalSeverity: 3,
+        tagName: '',
+        id: '',
         location: {
           doc: '',
           type: '',

package/testaro/focVis.js

@@ -14,7 +14,10 @@ exports.reporter = async (page, withItems) => {
     links.forEach(link => {
       link.focus();
       if (link.offsetTop + link.offsetHeight <= 0 || link.offsetLeft + link.offsetWidth <= 0) {
-        badLinks.push(compact(link.textContent));
+        badLinks.push({
+          id: link.id,
+          text: compact(link.textContent)
+        });
       }
     });
     return badLinks;
@@ -33,12 +36,14 @@ exports.reporter = async (page, withItems) => {
         issueID: 'focVis',
         what: 'Visible link is above or to the left of the display',
         ordinalSeverity: 2,
+        tagName: 'A',
+        id: item.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: item
+        excerpt: item.text
       });
     });
   }
@@ -48,6 +53,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Visible links are above or to the left of the display',
       count: data.total,
       ordinalSeverity: 2,
+      tagName: 'A',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/hover.js

@@ -269,6 +269,7 @@ const find = async (data, withItems, page, sample) => {
                 // Add them to the data.
                 data.items.impactTriggers.push({
                   tagName,
+                  id: itemData.id,
                   text: await textOf(firstTrigger[0], 100),
                   additions,
                   removals,
@@ -404,18 +405,19 @@ exports.reporter = async (page, withItems, sampleSize = -1) => {
   if (data.items) {
     Object.keys(data.items).forEach(issue => {
       data.items[issue].forEach(item => {
-        const itemID = item.id ? ` (ID ${item.id})` : '';
         standardInstances.push({
           issueID: `hover-${issue}`,
           what: what[issue],
           count: data.totals[issue],
           ordinalSeverity: severity[issue],
+          tagName: item.tagName,
+          id: item.id,
           location: {
             doc: '',
             type: '',
             spec: ''
           },
-          excerpt: `${itemID}: ${item.text}`
+          excerpt: item.text
         });
       });
     });
@@ -426,6 +428,8 @@ exports.reporter = async (page, withItems, sampleSize = -1) => {
       what: 'Hovering has unexpected impacts',
       count: Object.values(data.totals).reduce((total, current) => total + current),
       ordinalSeverity: totals.reduce((max, current, index) => current ? index : max, 0),
+      tagName: '',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/labClash.js

@@ -140,6 +140,7 @@ exports.reporter = async (page, withItems) => {
           data.items.mislabeled.push({
             index,
             tagName: labelee.tagName,
+            id: labelee.id,
             type: labelee.type,
             labelTypes,
             texts
@@ -166,6 +167,8 @@ exports.reporter = async (page, withItems) => {
             issueID: `labClash-${issue}`,
             what: `Element ${item.tagName} ${diagnosis}`,
             ordinalSeverity: issue === 'mislabeled' ? 2 : 3,
+            tagName: item.tagName,
+            id: item.id,
             location: {
               doc: '',
               type: '',
@@ -183,6 +186,8 @@ exports.reporter = async (page, withItems) => {
           what: 'Element labels are missing',
           count: data.totals.unlabeled,
           ordinalSeverity: 3,
+          tagName: '',
+          id: '',
           location: {
             doc: '',
             type: '',
@@ -197,6 +202,8 @@ exports.reporter = async (page, withItems) => {
           what: 'Element labels are conflicting',
           count: data.totals.mislabeled,
           ordinalSeverity: 2,
+          tagName: '',
+          id: '',
           location: {
             doc: '',
             type: '',

package/testaro/linkTo.js

@@ -5,34 +5,39 @@
 */
 exports.reporter = async (page, withItems) => {
   // Identify the visible links without href attributes.
-  const badLinkTexts = await page.$$eval(
+  const badLinkData = 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));
+      return badLinks.map(link => ({
+        id: link.id,
+        text: compact(link.textContent)
+      }));
     }
   );
   const data = {
-    total: badLinkTexts.length
+    total: badLinkData.length
   };
   const totals = [0, 0, data.total, 0];
   const standardInstances = [];
   if (withItems) {
-    data.items = badLinkTexts;
+    data.items = badLinkData;
     data.items.forEach(item => {
       standardInstances.push({
         issueID: 'linkTo',
         what: 'Element a has no href attribute',
         ordinalSeverity: 2,
+        tagName: 'A',
+        id: item.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: item
+        excerpt: item.text
       });
     });
   }
@@ -42,6 +47,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Links are missing href attributes',
       count: data.total,
       ordinalSeverity: 2,
+      tagName: 'A',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/linkUl.js

@@ -25,25 +25,32 @@ exports.reporter = async (page, withItems) => {
     const adjacentLinks = linkTypes.adjacent;
     const adjacentLinkCount = adjacentLinks.length;
     let underlined = 0;
-    const ulAdjacentLinkTexts = [];
-    const nulAdjacentLinkTexts = [];
+    const ulAdjacentLinkData = [];
+    const nulAdjacentLinkData = [];
     // For each of them:
     adjacentLinks.forEach(link => {
       // Identify the text of the link if itemization is required.
+      const id = link.id;
       const text = withItems ? compact(link.textContent) || compact(link.outerHTML) : '';
       // If it is underlined:
       if (window.getComputedStyle(link).textDecorationLine === 'underline') {
         // Increment the count of underlined inline links.
         underlined++;
-        // If required, add its text to the array of their texts.
+        // If required, add its data to the array of their data.
         if (withItems) {
-          ulAdjacentLinkTexts.push(text);
+          ulAdjacentLinkData.push({
+            id,
+            text
+          });
         }
       }
       // Otherwise, if it is not underlined and itemization is required:
       else if (withItems) {
         // Add its text to the array of texts of non-underlined inline links.
-        nulAdjacentLinkTexts.push(text);
+        nulAdjacentLinkData.push({
+          id,
+          text
+        });
       }
     });
     // Get the percentage of underlined links among all inline links.
@@ -62,8 +69,8 @@ exports.reporter = async (page, withItems) => {
     };
     if (withItems) {
       data.items = {
-        underlined: ulAdjacentLinkTexts,
-        notUnderlined: nulAdjacentLinkTexts
+        underlined: ulAdjacentLinkData,
+        notUnderlined: nulAdjacentLinkData
       };
     }
     const {adjacent} = data.totals;
@@ -73,14 +80,16 @@ exports.reporter = async (page, withItems) => {
       data.items.notUnderlined.forEach(item => {
         standardInstances.push({
           issueID: 'linkUl',
-          what: 'Element a is inline but has no underline',
+          what: 'Link is inline but has no underline',
           ordinalSeverity: 1,
+          tagName: 'A',
+          id: item.id,
           location: {
             doc: '',
             type: '',
             spec: ''
           },
-          excerpt: item
+          excerpt: item.text
         });
       });
     }
@@ -90,6 +99,8 @@ exports.reporter = async (page, withItems) => {
         what: 'Inline links are missing underlines',
         count: adjacent.total - adjacent.underlined,
         ordinalSeverity: 1,
+        tagName: 'A',
+        id: '',
         location: {
           doc: '',
           type: '',

package/testaro/menuNav.js

@@ -166,7 +166,12 @@ exports.reporter = async (page, withItems) => {
         // If itemization is required:
         if (withItems) {
           // Initialize a report on the menu item.
-          itemData.tagName = await page.evaluate(element => element.tagName, currentItem);
+          const identifiers = await page.evaluate(element => ({
+            tagName: element.tagName,
+            id: element.id
+          }), currentItem);
+          itemData.tagName = identifiers.tagName;
+          itemData.id = identifiers.id;
           itemData.text = await allText(page, currentItem);
           itemData.navigationErrors = [];
         }
@@ -271,16 +276,17 @@ exports.reporter = async (page, withItems) => {
     data.menuItems.incorrect.forEach(item => {
       standardInstances.push({
         issueID: 'menuNav',
-        what:
-        `Menu item ${item.tagName} responds nonstandardly to ${item.navigationErrors.join(', ')}`,
+        what: `Menu item responds nonstandardly to ${item.navigationErrors.join(', ')}`,
         count: item.navigationErrors.length,
         ordinalSeverity: 1,
+        tagName: item.tagName,
+        id: item.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: `${item.tagName}: ${item.text}`
+        excerpt: item.text
       });
     });
   }
@@ -290,6 +296,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Menus and menu items have nonstandard navigation',
       count: data.totals.navigations.all.incorrect,
       ordinalSeverity: 1,
+      tagName: '',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/miniText.js

@@ -30,7 +30,11 @@ exports.reporter = async (page, withItems) => {
         if (pixels < 11) {
           textParent.childNodes.forEach(node => {
             if (node.nodeType === 3 && compact(node.textContent)) {
-              miniTexts.push(compact(node.textContent));
+              miniTexts.push({
+                tagName: textParent.tagName,
+                id: textParent.id || '',
+                text: compact(node.textContent)
+              });
             }
           });
         }
@@ -49,12 +53,14 @@ exports.reporter = async (page, withItems) => {
         issueID: 'miniText',
         what: 'Text font is smaller than 11 pixels',
         ordinalSeverity: 2,
+        tagName: text.tagName,
+        id: text.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: text
+        excerpt: text.text
       });
     });
   }
@@ -64,6 +70,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Texts have fonts smaller than 11 pixels',
       count: data.total,
       ordinalSeverity: 2,
+      tagName: '',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/motion.js

@@ -98,13 +98,13 @@ exports.reporter = async (page, withItems, delay = 2500, interval = 2500, count
       pixelChanges.reduce((count, change) => count + (change ? 1 : 0), 0) / pixelChanges.length, 2
     );
     // Return the result.
-    const count = 2 * (meanLocalRatio - 1)
+    const rawCount = 2 * (meanLocalRatio - 1)
     + maxLocalRatio - 1
     + globalRatio - 1
     + meanPixelChange / 10000
     + maxPixelChange / 25000
-    + 3 * changeFrequency
-    || 0;
+    + 3 * changeFrequency;
+    const count = rawCount ? Math.round(rawCount) : 0;
     return {
       data: {
         bytes,
@@ -128,6 +128,8 @@ exports.reporter = async (page, withItems, delay = 2500, interval = 2500, count
         what: 'Content moves or changes without user request',
         count,
         ordinalSeverity: 2,
+        tagName: '',
+        id: '',
         location: {
           doc: '',
           type: '',

package/testaro/nonTable.js

@@ -13,7 +13,10 @@ exports.reporter = async (page, withItems) => {
     const compact = string => string.replace(/[\t\n]/g, '').replace(/\s{2,}/g, ' ').trim();
     // Adds the first 100 characters of the code of a pseudotable to the array of pseudotable texts.
     const addBad = table => {
-      badTableTexts.push(compact(table.outerHTML).slice(0, 100));
+      badTableTexts.push({
+        id: table.id,
+        text: compact(table.outerHTML).slice(0, 100)
+      });
     };
     // FUNCTION DEFINITIONS END
     // For each table on the page:
@@ -63,17 +66,19 @@ exports.reporter = async (page, withItems) => {
   const standardInstances = [];
   if (withItems) {
     data.items = badTableTexts;
-    data.items.forEach(text => {
+    data.items.forEach(item => {
       standardInstances.push({
         issueID: 'nonTable',
         what: 'Table is misused to arrange content',
         ordinalSeverity: 0,
+        tagName: 'TABLE',
+        id: item.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: text
+        excerpt: item.text
       });
     });
   }
@@ -83,6 +88,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Tables are misused to arrange content',
       count: data.total,
       ordinalSeverity: 0,
+      tagName: 'TABLE',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/radioSet.js

@@ -82,18 +82,23 @@ exports.reporter = async (page, withItems) => {
         const nonSetRadios = allRadios.filter(radio => ! setRadios.includes(radio));
         const items = data.items;
         items.inSet = setRadios.map(radio => textOf(radio));
-        items.notInSet = nonSetRadios.map(radio => textOf(radio));
-        items.notInSet.forEach(text => {
+        items.notInSet = nonSetRadios.map(radio => ({
+          id: radio.id,
+          text: textOf(radio)
+        }));
+        items.notInSet.forEach(item => {
           standardInstances.push({
             issueID: 'radioSet',
             what: 'Radio button and its peers are not in a fieldset with a legend',
             ordinalSeverity: 2,
+            tagName: 'INPUT',
+            id: item.id,
             location: {
               doc: '',
               type: '',
               spec: ''
             },
-            excerpt: text
+            excerpt: item.text
           });
         });
       }
@@ -103,6 +108,8 @@ exports.reporter = async (page, withItems) => {
           what: 'Radio buttons are not validly grouped in fieldsets with legends',
           count: loneRadios,
           ordinalSeverity: 2,
+          tagName: 'INPUT',
+          id: '',
           location: {
             doc: '',
             type: '',

package/testaro/role.js

@@ -15,6 +15,7 @@ exports.reporter = async page => await page.$eval('body', body => {
 
   // CONSTANTS
 
+  // All roles implicit in HTML elements.
   const badRoles = new Set([
     'article',
     'banner',
@@ -52,7 +53,7 @@ exports.reporter = async page => await page.$eval('body', body => {
     'term',
     'textbox'
   ]);
-  // All non-abstract roles
+  // All non-abstract roles.
   const goodRoles = new Set([
     'alert',
     'alertdialog',
@@ -410,7 +411,7 @@ exports.reporter = async page => await page.$eval('body', body => {
 
   // OPERATION
 
-  // Remove the deprecated roles from the non-abstract roles.
+  // Remove the element-implicit roles from the non-abstract roles.
   goodRoles.forEach(role => {
     if (badRoles.has(role)) {
       goodRoles.delete(role);
@@ -489,6 +490,8 @@ exports.reporter = async page => await page.$eval('body', body => {
           what: `${tagName} elements have redundant explicit role ${role} (count: ${redCount})`,
           count: redCount,
           ordinalSeverity: 1,
+          tagName,
+          id: '',
           location: {
             doc: '',
             type: '',
@@ -502,9 +505,11 @@ exports.reporter = async page => await page.$eval('body', body => {
         standardInstances.push({
           issueID: 'role-bad',
           what:
-          `Elements ${tagName} have invalid or native-replaceable explicit role ${role} (count: ${badCount})`,
+          `${tagName} elements have invalid or native-replaceable explicit role ${role} (count: ${badCount})`,
           count: badCount,
           ordinalSeverity: 3,
+          tagName,
+          id: '',
           location: {
             doc: '',
             type: '',

package/testaro/styleDiff.js

@@ -155,15 +155,15 @@ exports.reporter = async (page, withItems) => {
     const totals = [0, 0, 0, 0];
     const standardInstances = [];
     const elementData = {
-      adjacentLink: [0, 'In-line links'],
-      listLink: [1, 'Links in columns'],
-      button: [2, 'Buttons'],
-      h1: [3, 'Level-1 headings'],
-      h2: [3, 'Level-2 headings'],
-      h3: [3, 'Level-3 headings'],
-      h4: [3, 'Level-4 headings'],
-      h5: [3, 'Level-5 headings'],
-      h6: [3, 'Level-6 headings'],
+      adjacentLink: [0, 'In-line links', 'A'],
+      listLink: [1, 'Links in columns', 'A'],
+      button: [2, 'Buttons', 'BUTTON'],
+      h1: [3, 'Level-1 headings', 'H1'],
+      h2: [3, 'Level-2 headings', 'H2'],
+      h3: [3, 'Level-3 headings', 'H3'],
+      h4: [3, 'Level-4 headings', 'H4'],
+      h5: [3, 'Level-5 headings', 'H5'],
+      h6: [3, 'Level-6 headings', 'H6'],
     };
     Object.keys(elementData).forEach(elementName => {
       const elementTotal = data.totals[elementName];
@@ -178,6 +178,8 @@ exports.reporter = async (page, withItems) => {
           what: `${currentData[1]} have ${elementSubtotals.length} different styles`,
           count: extraCount,
           ordinalSeverity: severity,
+          tagName: currentData[2],
+          id: '',
           location: {
             doc: '',
             type: '',

package/testaro/tabNav.js

@@ -220,7 +220,10 @@ exports.reporter = async (page, withItems) => {
         if (withItems) {
           let found = true;
           // Initialize a report on the element.
-          itemData.tagName = await page.evaluate(element => element.tagName, currentTab)
+          const moreItemData = await page.evaluate(element => ({
+            tagName: element.tagName,
+            id: element.id
+          }), currentTab)
           .catch(error => {
             console.log(`ERROR: could not get tag name (${error.message})`);
             found = false;
@@ -228,6 +231,8 @@ exports.reporter = async (page, withItems) => {
             return 'ERROR: not found';
           });
           if (found) {
+            itemData.tagName = moreItemData.tagName;
+            itemData.id = moreItemData.id;
             itemData.text = await allText(page, currentTab);
             itemData.navigationErrors = [];
           }
@@ -339,12 +344,14 @@ exports.reporter = async (page, withItems) => {
         `${item.tagName} element responds nonstandardly to ${item.navigationErrors.join(', ')}`,
         count: item.navigationErrors.length,
         ordinalSeverity: 1,
+        tagName: item.tagName,
+        id: item.id,
         location: {
           doc: '',
           type: '',
           spec: ''
         },
-        excerpt: `${item.tagName}: ${item.text}`
+        excerpt: item.text
       });
     });
   }
@@ -354,6 +361,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Tablists have nonstandard navigation',
       count: data.totals.navigations.all.incorrect,
       ordinalSeverity: 1,
+      tagName: '',
+      id: '',
       location: {
         doc: '',
         type: '',

package/testaro/titledEl.js

@@ -16,6 +16,7 @@ exports.reporter = async (page, withItems) => {
       // FUNCTION DEFINITION END
       return badTitleElements.map(element => ({
         tagName: element.tagName,
+        id: element.id,
         text: compact(element.textContent),
         title: compact(element.title)
       }));
@@ -30,8 +31,10 @@ exports.reporter = async (page, withItems) => {
     badTitleElements.forEach(element => {
       standardInstances.push({
         issueID: 'titledEl',
-        what: `Element ${element.tagName} has a title attribute`,
+        what: `${element.tagName} element has a title attribute`,
         ordinalSeverity: 2,
+        tagName: element.tagName,
+        id: element.id,
         location: {
           doc: '',
           type: '',
@@ -47,6 +50,8 @@ exports.reporter = async (page, withItems) => {
       what: 'Ineligible elements have title attributes',
       count: data.total,
       ordinalSeverity: 2,
+      tagName: '',
+      id: '',
       location: {
         doc: '',
         type: '',