testaro 1.0.0

package/tests/linkUl.js

@@ -0,0 +1,65 @@
+/*
+  linkUl
+  This test reports failures to underline inline links. Underlining and color are the
+  traditional style properties that identify links. Collections of links in blocks can be
+  recognized without underlines, but inline links are difficult or impossible to distinguish
+  visually from surrounding text if not underlined. Underlining inline links only on hover
+  provides an indicator valuable only to mouse users, and even they must traverse the text with
+  a mouse merely to discover which passages are links.
+*/
+exports.reporter = async (page, withItems) => {
+  // Identify the links in the page, by type.
+  const linkTypes = await require('../procs/test/linksByType').linksByType(page);
+  return await page.evaluate(args => {
+    const withItems = args[0];
+    const linkTypes = args[1];
+    // 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
+    // Identify the inline links.
+    const inLinks = linkTypes.inline;
+    const inLinkCount = inLinks.length;
+    let underlined = 0;
+    const ulInLinkTexts = [];
+    const nulInLinkTexts = [];
+    // For each of them:
+    inLinks.forEach(link => {
+      // Identify the text of the link if itemization is required.
+      const text = withItems ? compact(link.textContent) : '';
+      // 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 (withItems) {
+          ulInLinkTexts.push(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.
+        nulInLinkTexts.push(text);
+      }
+    });
+    // Get the percentage of underlined links among all inline links.
+    const underlinedPercent = inLinkCount ? Math.floor(100 * underlined / inLinkCount) : 'N/A';
+    const data = {
+      totals: {
+        links: inLinks.length + linkTypes.block.length,
+        inline: {
+          total: inLinkCount,
+          underlined,
+          underlinedPercent
+        }
+      }
+    };
+    if (withItems) {
+      data.items = {
+        underlined: ulInLinkTexts,
+        notUnderlined: nulInLinkTexts
+      };
+    }
+    return {result: data};
+  }, [withItems, linkTypes]);
+};

package/tests/menuNav.js

@@ -0,0 +1,254 @@
+/*
+  menuNav
+  This test reports nonstandard keyboard navigation among menu items in menus that manage true
+  focus. Menus that use pseudofocus with the 'aria-activedescendant' attribute are not tested.
+  Standards are based on https://www.w3.org/TR/wai-aria-practices-1.1/#menu.
+*/
+exports.reporter = async (page, withItems) => {
+  // Initialize a report.
+  const data = {
+    totals: {
+      navigations: {
+        all: {
+          total: 0,
+          correct: 0,
+          incorrect: 0
+        },
+        specific: {
+          tab: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          left: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          right: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          up: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          down: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          home: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          },
+          end: {
+            total: 0,
+            correct: 0,
+            incorrect: 0
+          }
+        }
+      },
+      menuItems: {
+        total: 0,
+        correct: 0,
+        incorrect: 0
+      },
+      menus: {
+        total: 0,
+        correct: 0,
+        incorrect: 0
+      }
+    }
+  };
+  if (withItems) {
+    data.menuItems = {
+      incorrect: [],
+      correct: []
+    };
+  }
+  // Identify an array of the true-focus menus.
+  const menus = await page.$$(
+    '[role=menu]:not([aria-activedescendant]), [role=menubar]:not([aria-activedescendant])'
+  );
+  if (menus.length) {
+    // FUNCTION DEFINITIONS START
+    // Returns text associated with an element.
+    const {allText} = require('../procs/test/allText');
+    // Returns the index of the focused menu item in an array of menu items.
+    const focusedMenuItem = async menuItems => await page.evaluate(menuItems => {
+      const focus = document.activeElement;
+      return menuItems.indexOf(focus);
+    }, menuItems);
+    // Tests a navigation on a menu item.
+    const testKey = async (
+      menu, menuItems, menuItem, keyName, keyProp, goodIndex, itemIsCorrect, itemData
+    ) => {
+      // Make the menu visible and the menu item the active one.
+      await page.evaluate(args => {
+        const menu = args[0];
+        const menuItems = args[1];
+        const menuItem = args[2];
+        menu.style.display = 'revert';
+        menu.style.visibility = 'visible';
+        menu.style.opacity = 1;
+        menuItems.forEach(item => {
+          item.tabIndex = -1;
+        });
+        menuItem.tabIndex = 0;
+      }, [menu, menuItems, menuItem]);
+      // Focus it and press the specified key.
+      await menuItem.press(keyName);
+      // Increment the counts of navigations and key navigations.
+      data.totals.navigations.all.total++;
+      data.totals.navigations.specific[keyProp].total++;
+      // Identify which menu item is now focused, if any.
+      const focusIndex = await focusedMenuItem(menuItems);
+      // If the focus is correct:
+      if (
+        goodIndex === null
+          ? [-1, menuItems.indexOf(menuItem)].includes(focusIndex)
+          : focusIndex === goodIndex
+      ) {
+        // Increment the counts of correct navigations and correct key navigations.
+        data.totals.navigations.all.correct++;
+        data.totals.navigations.specific[keyProp].correct++;
+      }
+      // Otherwise, i.e. if the focus is incorrect:
+      else {
+        // Increment the counts of incorrect navigations and incorrect key navigations.
+        data.totals.navigations.all.incorrect++;
+        data.totals.navigations.specific[keyProp].incorrect++;
+        // Update the menu-item status to incorrect.
+        itemIsCorrect = false;
+        // If itemization is required:
+        if (withItems) {
+          // Update the menu-item report.
+          itemData.navigationErrors.push(keyName);
+        }
+      }
+      return itemIsCorrect;
+    };
+    // Returns the index to which an arrow key should move the focus.
+    const arrowTarget = (startIndex, itemCount, orientation, direction) => {
+      if (orientation === 'horizontal') {
+        if (direction === 'left') {
+          return startIndex ? startIndex - 1 : itemCount - 1;
+        }
+        else if (direction === 'right') {
+          return startIndex === itemCount - 1 ? 0 : startIndex + 1;
+        }
+      }
+      else if (orientation === 'vertical') {
+        if (direction === 'up') {
+          return startIndex ? startIndex - 1 : itemCount - 1;
+        }
+        else if (direction === 'down') {
+          return startIndex === itemCount - 1 ? 0 : startIndex + 1;
+        }
+      }
+    };
+    // Recursively tests menu items of a menu.
+    const testMenuItems = async (menu, menuItems, index, orientation, menuIsCorrect) => {
+      const itemCount = menuItems.length;
+      // If any menu items remain to be tested:
+      if (index < itemCount) {
+        // Increment the reported count of menu items.
+        data.totals.menuItems.total++;
+        // Identify the menu item to be tested.
+        const currentItem = menuItems[index];
+        // Initialize it as correct.
+        let isCorrect = true;
+        const itemData = {};
+        // If itemization is required:
+        if (withItems) {
+          // Initialize a report on the menu item.
+          itemData.tagName = await page.evaluate(element => element.tagName, currentItem);
+          itemData.text = await allText(page, currentItem);
+          itemData.navigationErrors = [];
+        }
+        // Test the element with each navigation key.
+        isCorrect = await testKey(
+          menu, menuItems, currentItem, 'Tab', 'tab', -1, isCorrect, itemData
+        );
+        // FUNCTION DEFINITION START
+        // Tests arrow-key navigation.
+        const testArrow = async (keyName, keyProp) => {
+          isCorrect = await testKey(
+            menu,
+            menuItems,
+            currentItem,
+            keyName,
+            keyProp,
+            arrowTarget(index, itemCount, orientation, keyProp),
+            isCorrect,
+            itemData
+          );
+        };
+        // FUNCTION DEFINITION END
+        if (orientation === 'vertical') {
+          await testArrow('ArrowUp', 'up');
+          await testArrow('ArrowDown', 'down');
+        }
+        else {
+          await testArrow('ArrowRight', 'right');
+          await testArrow('ArrowLeft', 'left');
+        }
+        isCorrect = await testKey(
+          menu, menuItems, currentItem, 'Home', 'home', 0, isCorrect, itemData
+        );
+        isCorrect = await testKey(
+          menu, menuItems, currentItem, 'End', 'end', itemCount - 1, isCorrect, itemData
+        );
+        // Update the menu-item status (Node 14 does not support the ES 2021 &&= operator).
+        menuIsCorrect = menuIsCorrect && isCorrect;
+        // Increment the data.
+        data.totals.menuItems[isCorrect ? 'correct' : 'incorrect']++;
+        if (withItems) {
+          data.menuItems[isCorrect ? 'correct' : 'incorrect'].push(itemData);
+        }
+        // Process the next tab element.
+        return await testMenuItems(menu, menuItems, index + 1, orientation, menuIsCorrect);
+      }
+      // Otherwise, i.e. if all menu items have been tested:
+      else {
+        // Return whether the menu is correct.
+        return menuIsCorrect;
+      }
+    };
+    // Recursively tests menus.
+    const testMenus = async menus => {
+      // If any menus remain to be tested:
+      if (menus.length) {
+        // Identify the first of them.
+        const firstMenu = menus[0];
+        // Identify its orientation.
+        const menuRole = await firstMenu.getAttribute('role');
+        const orientationAttribute = await firstMenu.getAttribute('aria-orientation');
+        const orientation = orientationAttribute || (
+          menuRole === 'menu' ? 'vertical' : 'horizontal'
+        );
+        // Identify its direct menu items.
+        const menuItems = await firstMenu.$$(
+          '[role=menuitem]:not([role=menu] [role=menuitem]):not([role=menubar] [role=menuitem])'
+        );
+        // If the menu contains at least 2 direct menu items:
+        if (menuItems.length > 1) {
+          // Test its menu items.
+          const isCorrect = await testMenuItems(firstMenu, menuItems, 0, orientation, true);
+          // Increment the data.
+          data.totals.menus.total++;
+          data.totals.menus[isCorrect ? 'correct' : 'incorrect']++;
+          // Process the remaining menus.
+          await testMenus(menus.slice(1));
+        }
+      }
+    };
+    // FUNCTION DEFINITIONS END
+    await testMenus(menus);
+  }
+  return {result: data};
+};

package/tests/motion.js

@@ -0,0 +1,115 @@
+/*
+  motion
+  This test reports motion in a page. For minimal accessibility, standards require motion to be
+  brief, or else stoppable by the user. But stopping motion can be difficult or impossible, and,
+  by the time a user manages to stop motion, the motion may have caused annoyance or harm. For
+  superior accessibility, a page contains no motion until and unless the user authorizes it. The
+  test compares screen shots of the part of the page within the visible viewport. You can specify
+  how many milliseconds to wait before the first screen shot (delay), how many milliseconds to wait
+  between screen shots (interval), and how many screen shots to make (count). The test compares the
+  screen shots and reports 9 statistics:
+    0. bytes: an array of the sizes of the screen shots, in bytes
+    1. localRatios: an array of the ratios of bytes of the larger to the smaller of adjacent pairs of screen shots
+    2. meanLocalRatio: the mean of the ratios in the localRatios array
+    3. maxLocalRatio: the greatest of the ratios in the localRatios array
+    4. globalRatio: the ratio of bytes of the largest to the smallest screen shot
+    5. pixelChanges: an array of counts of differing pixels between adjacent pairs of screen shots
+    6. meanPixelChange: the mean of the counts in the pixelChanges array
+    7. maxPixelChange: the greatest of the counts in the pixelChanges array
+    8. changeFrequency: what fraction of the adjacent pairs of screen shots has pixel differences
+*/
+const pixelmatch = require('pixelmatch');
+const {PNG} = require('pngjs');
+// Creates and returns a screenshot.
+const shoot = async page => {
+  // Make a screenshot as a buffer.
+  return await page.screenshot({
+    fullPage: false,
+    omitBackground: true,
+    timeout: 3000
+  })
+  .catch(error => {
+    console.log(`ERROR: Screenshot failed(${error.message})`);
+    return '';
+  });
+};
+// Recursively creates and returns screenshots.
+const shootAll = async (page, delay, interval, count, toDo, buffers) => {
+  // Wait.
+  await page.waitForTimeout(toDo === count ? delay : interval);
+  // Make a screenshot.
+  const buffer = await shoot(
+    page, `${page.url().replace(/^.+\/\/|\/$/g, '').replace(/\//g, '+')}-${count - toDo}`
+  );
+  // Get its dimensions.
+  if (buffer.length) {
+    buffers.push(buffer);
+    if (toDo > 1) {
+      return shootAll(page, delay, interval, count, toDo - 1, buffers);
+    }
+    else {
+      return buffers;
+    }
+  }
+  else {
+    return '';
+  }
+};
+// Returns a number rounded to 2 decimal digits.
+const round = (num, precision) => Number.parseFloat(num.toPrecision(precision));
+// Reports motion in a page.
+exports.reporter = async (page, delay, interval, count) => {
+  // Make screenshots and get their image buffers.
+  const shots = await shootAll(page, delay, interval, count, count, []);
+  // If the shooting succeeded:
+  if (shots.length === count) {
+    // Get the sizes of the shots in bytes of code.
+    const bytes = shots.map(shot => shot.length);
+    // Get their ratios between adjacent pairs of shots.
+    const localRatios = bytes.slice(1).map((size, index) => round(
+      (size > bytes[index] ? size / bytes[index] : bytes[index] / size), 4
+    ));
+    // Get the mean and maximum of those ratios.
+    const meanLocalRatio = round(
+      localRatios.reduce((sum, currentRatio) => sum + currentRatio) / localRatios.length, 4
+    );
+    const maxLocalRatio = Math.max(...localRatios);
+    // Get the ratio between the largest and smallest shot.
+    const globalRatio = round((Math.max(...bytes) / Math.min(...bytes)), 4);
+    // Get the shots as PNG images.
+    const pngs = shots.map(shot => PNG.sync.read(shot));
+    // Get their dimensions.
+    const {width, height} = pngs[0];
+    // Get the counts of differing pixels between adjacent pairs of shots.
+    const pixelChanges = pngs
+    .slice(1)
+    .map((png, index) => pixelmatch(pngs[index].data, png.data, null, width, height));
+    // Get the mean and maximum of those counts.
+    const meanPixelChange = Math.floor(
+      pixelChanges.reduce((sum, currentChange) => sum + currentChange) / pixelChanges.length
+    );
+    const maxPixelChange = Math.max(...pixelChanges);
+    const changeFrequency = round(
+      pixelChanges.reduce((count, change) => count + (change ? 1 : 0), 0) / pixelChanges.length, 2
+    );
+    // Return the result.
+    return {
+      result: {
+        bytes,
+        localRatios,
+        meanLocalRatio,
+        maxLocalRatio,
+        globalRatio,
+        pixelChanges,
+        meanPixelChange,
+        maxPixelChange,
+        changeFrequency
+      }
+    };
+  }
+  // Otherwise, i.e. if the shooting failed:
+  else {
+    // Return failure.
+    return {result: {error: 'ERROR: screenshots failed'}};
+  }
+};

package/tests/radioSet.js

@@ -0,0 +1,87 @@
+/*
+  radioSet
+  This test reports nonstandard grouping of radio buttons. It defines standard grouping to require
+  that two or more radio buttons with the same name, and no other radio buttons, be grouped in a
+  'fieldset' element with a valid 'legend' element.
+*/
+const fs = require('fs/promises');
+// Tabulates and lists radio buttons in and not in accessible field sets.
+exports.reporter = async (page, withItems) => {
+  // Initialize the argument array to be passed to the page function.
+  const args = [withItems];
+  // If itemization is required:
+  if (withItems) {
+    // Add the body of the textOf function as a string to the array.
+    const textOfBody = await fs.readFile('procs/test/textOf.txt', 'utf8');
+    args.push(textOfBody);
+  }
+  // Get the result data.
+  const dataJSHandle = await page.evaluateHandle(args => {
+    const withItems = args[0];
+    // FUNCTION DEFINITIONS START
+    /*
+      If itemization is required, define the textOf function to get element texts.
+      The function body is read as a string and passed to this method because
+      a string can be passed in but a function cannot.
+    */
+    const textOf = args[1] ? new Function('element', args[1]) : '';
+    // Trim excess spaces from a string.
+    const debloat = text => text.trim().replace(/\s+/g, ' ');
+    // FUNCTION DEFINITIONS END
+    // Initialize a report.
+    const data = {
+      totals: {
+        total: 0,
+        inSet: 0,
+        percent: 0
+      }
+    };
+    if (withItems) {
+      data.items = {
+        inSet: [],
+        notInSet: []
+      };
+    }
+    // Get an array of all fieldset elements.
+    const fieldsets = Array.from(document.body.querySelectorAll('fieldset'));
+    // Get an array of those with valid legends.
+    const legendSets = fieldsets.filter(fieldset => {
+      const firstChild = fieldset.firstElementChild;
+      return firstChild
+      && firstChild.tagName === 'LEGEND'
+      && debloat(firstChild.textContent).length;
+    });
+    // Get an array of the radio buttons in those with homogeneous radio buttons.
+    const setRadios = legendSets.reduce((radios, currentSet) => {
+      const currentRadios = Array.from(currentSet.querySelectorAll('input[type=radio]'));
+      const radioCount = currentRadios.length;
+      if (radioCount == 1) {
+        radios.push(currentRadios[0]);
+      }
+      else if (radioCount > 1) {
+        const radioName = currentRadios[0].name;
+        if (radioName && currentRadios.slice(1).every(radio => radio.name === radioName)) {
+          radios.push(...currentRadios);
+        }
+      }
+      return radios;
+    }, []);
+    // Get an array of all radio buttons.
+    const allRadios = Array.from(document.body.querySelectorAll('input[type=radio'));
+    // Tabulate the results.
+    const totals = data.totals;
+    totals.total = allRadios.length;
+    totals.inSet = setRadios.length;
+    totals.percent = totals.total ? Math.floor(100 * totals.inSet / totals.total) : 'N.A.';
+    // If itemization is required:
+    if (withItems) {
+      // Add it to the results.
+      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));
+    }
+    return {result: data};
+  }, args);
+  return await dataJSHandle.jsonValue();
+};

package/tests/role.js

@@ -0,0 +1,164 @@
+/*
+  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:
+    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',
+    'button',
+    'cell',
+    'checkbox',
+    'columnheader',
+    'combobox',
+    'complementary',
+    'contentinfo',
+    'definition',
+    'dialog',
+    'document',
+    'figure',
+    'graphics-document',
+    'gridcell',
+    'group',
+    'heading',
+    'link',
+    'list',
+    'listbox',
+    'listitem',
+    'main',
+    'navigation',
+    'option',
+    'progressbar',
+    'radio',
+    'region',
+    'row',
+    'rowgroup',
+    'rowheader',
+    'searchbox',
+    'separator',
+    'slider',
+    'spinbutton',
+    'status',
+    'table',
+    'term',
+    'textbox'
+  ]);
+  // All non-abstract roles
+  const goodRoles = new Set([
+    'alert',
+    'alertdialog',
+    'application',
+    'article',
+    'banner',
+    'button',
+    'cell',
+    'checkbox',
+    'columnheader',
+    'combobox',
+    'complementary',
+    'contentinfo',
+    'definition',
+    'dialog',
+    'directory',
+    'document',
+    'feed',
+    'figure',
+    'form',
+    'grid',
+    'gridcell',
+    'group',
+    'heading',
+    'img',
+    'link',
+    'list',
+    'listbox',
+    'listitem',
+    'log',
+    'main',
+    'marquee',
+    'menu',
+    'menubar',
+    'menuitem',
+    'menuitemcheckbox',
+    'menuitemradio',
+    'navigation',
+    'none',
+    'note',
+    'option',
+    'presentation',
+    'progressbar',
+    'radio',
+    'radiogroup',
+    'region',
+    'row',
+    'rowgroup',
+    'rowheader',
+    'scrollbar',
+    'search',
+    'searchbox',
+    'separator',
+    'separator',
+    'slider',
+    'spinbutton',
+    'status',
+    'switch',
+    'tab',
+    'table',
+    'tablist',
+    'tabpanel',
+    'term',
+    'textbox',
+    'timer',
+    'toolbar',
+    'tooltip',
+    'tree',
+    'treegrid',
+    'treeitem',
+  ]);
+  // 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]'));
+  // Identify those with roles that are either deprecated or invalid.
+  const bads = roleElements.filter(element => {
+    const role = element.getAttribute('role');
+    return badRoles.has(role) || ! goodRoles.has(role);
+  });
+  // Initialize the result.
+  const data = {
+    roleElements: roleElements.length,
+    badRoleElements: bads.length,
+    tagNames: {}
+  };
+  // For each element with a deprecated role:
+  bads.forEach(element => {
+    // Identify its facts.
+    const tagName = element.tagName;
+    const role = element.getAttribute('role');
+    // Add them to the result.
+    if (data.tagNames[tagName]) {
+      if (data.tagNames[tagName][role]) {
+        data.tagNames[tagName][role]++;
+      }
+      else {
+        data.tagNames[tagName][role] = 1;
+      }
+    }
+    else {
+      data.tagNames[tagName] = {[role]: 1};
+    }
+  });
+  return {result: data};
+});