testaro 72.2.3 → 72.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "testaro",
-  "version": "72.2.3",
+  "version": "72.3.0",
   "description": "Run 1300 web accessibility tests from 10 tools and get a standardized report",
   "main": "index.js",
   "scripts": {

package/testaro/{targetSmall.js → targetsNear.js}

@@ -8,9 +8,9 @@
 */
 
 /*
-  targetSmall
+  targetsNear
   Related to Tenon rule 152.
-  This test reports visible pointer targets, i.e. labels, buttons, inputs, and links, that are small enough or near enough to other targets to make pointer interaction difficult. This test relates to WCAG 2.2 Success Criteria 2.5.5 and 2.5.8, but does not attempt to implement either of them precisely. For example, the test reports a small pointer target that is far from all other targets, although it conforms to the Success Criteria.
+  This test reports visible pointer targets, i.e. labels, buttons, inputs, and links, that are near enough to other targets to make pointer interaction difficult. This test relates to WCAG 2.2 Success Criteria 2.5.5 and 2.5.8, but does not attempt to implement either of them precisely. For example, the test reports a small pointer target that is far from all other targets, although it conforms to the Success Criteria.
 */
 
 // IMPORTS
@@ -24,17 +24,41 @@ exports.reporter = async (page, catalog, withItems) => {
   // Return totals and standard instances for the rule.
   const protoResult = await page.evaluate(withItems => {
     // Get all pointer targets.
-    const allPTs = Array.from(document.body.querySelectorAll('label, button, input, a'));
+    const allTargets = Array.from(document.body.querySelectorAll('label, button, input, a'));
     // Get the visible ones.
-    const visiblePTs = allPTs.filter(pt => pt.checkVisibility({
+    const visibleTargets = allTargets.filter(target => target.checkVisibility({
       contentVisibilityAuto: true,
       opacityProperty: true,
       visibilityProperty: true
     }));
+    // For each visible one:
+    const visibleBlockTargets = visibleTargets.filter(target => {
+      const style = window.getComputedStyle(target);
+      // If it is block-displayed:
+      if (['block', 'list-item', 'table-cell'].includes(style.display)) {
+        // Include it.
+        return true;
+      }
+      const parent = target.parentElement;
+      // Otherwise, if it has a parent:
+      if (parent) {
+        // If the parent has no additional text:
+        if (parent.innerText === target.innerText) {
+          const parentStyle = window.getComputedStyle(parent);
+          // If the parent is block-displayed:
+          if (['block', 'list-item', 'table-cell'].includes(parentStyle.display)) {
+            // Include the target.
+            return true;
+          }
+        }
+      }
+      // Otherwise, exclude it.
+      return false;
+    });
     // Initialize the data.
     const ptsData = [];
-    // For each visible pointer target:
-    visiblePTs.forEach(element => {
+    // For each visible block-displayed pointer target:
+    visibleBlockTargets.forEach(element => {
       // Get the coordinates of its centerpoint.
       const rect = element.getBoundingClientRect();
       const centerX = rect.left + rect.width / 2;
@@ -45,8 +69,8 @@ exports.reporter = async (page, catalog, withItems) => {
     // Initialize the counts of minor and major violations.
     let violationCounts = [0, 0];
     const protoInstances = [];
-    // For each visible pointer target:
-    visiblePTs.forEach((element, index) => {
+    // For each visible block-displayed pointer target:
+    visibleBlockTargets.forEach((element, index) => {
       const [centerX, centerY] = ptsData[index];
       const otherPTsData = ptsData.toSpliced(index, 1);
       // Get the minimum of the vertical distances of its centerpoint from those of the others.
@@ -66,6 +90,7 @@ exports.reporter = async (page, catalog, withItems) => {
         }));
         // If the minimum planar distance is less than 44px:
         if (minPlanarDistance < 44) {
+          // Get whether it is less than 24px.
           const isVeryNear = minPlanarDistance < 24;
           // Get the ordinal severity of the violation.
           const ordinalSeverity = isVeryNear ? 3 : 2;
@@ -76,7 +101,7 @@ exports.reporter = async (page, catalog, withItems) => {
             const what = `Pointer-target centerpoint is only ${Math.round(minPlanarDistance)}px from another one`;
             // Add a proto-instance to the proto-instances.
             protoInstances.push({
-              ruleID: 'targetSmall',
+              ruleID: 'targetsNear',
               what,
               ordinalSeverity,
               count: 1,
@@ -92,7 +117,7 @@ exports.reporter = async (page, catalog, withItems) => {
       if (violationCounts[1]) {
         // Add a summary instance to the proto-instances.
         protoInstances.push({
-          ruleID: 'targetSmall',
+          ruleID: 'targetsNear',
           what: 'Pointer-target centerpoints are less than 24px from others',
           ordinalSeverity: 1,
           count: violationCounts[1]
@@ -102,7 +127,7 @@ exports.reporter = async (page, catalog, withItems) => {
       if (violationCounts[0]) {
         // Add a summary instance to the proto-instances.
         protoInstances.push({
-          ruleID: 'targetSmall',
+          ruleID: 'targetsNear',
           what: 'Pointer-target centerpoints are less than 44px from others',
           ordinalSeverity: 0,
           count: violationCounts[0]

package/tests/testaro.js

@@ -288,7 +288,7 @@ const allRules = [
     defaultOn: true
   },
   {
-    id: 'targetSmall',
+    id: 'targetsNear',
     what: 'labels, buttons, inputs, and links too near each other',
     contaminates: false,
     needsAccessibleName: false,

package/validation/tests/jobProperties/targetSmall.json

@@ -1,11 +1,11 @@
 {
-  "rule": "targetSmall",
+  "rule": "targetsNear",
   "timeLimit": 20,
   "acts": [
     {
       "type": "launch",
       "target": {
-        "url": "file://validation/tests/targetSmall/index.html",
+        "url": "file://validation/tests/targetsNear/index.html",
         "what": "page with variously sized interaction targets"
       }
     },
@@ -28,7 +28,7 @@
         [
           "standardResult.instances.0.ruleID",
           "=",
-          "targetSmall"
+          "targetsNear"
         ],
         [
           "standardResult.instances.0.what",
@@ -103,7 +103,7 @@
       ],
       "rules": [
         "y",
-        "targetSmall"
+        "targetsNear"
       ]
     },
     {
@@ -125,7 +125,7 @@
         [
           "standardResult.instances.0.ruleID",
           "=",
-          "targetSmall"
+          "targetsNear"
         ],
         [
           "standardResult.instances.0.what",
@@ -145,7 +145,7 @@
       ],
       "rules": [
         "y",
-        "targetSmall"
+        "targetsNear"
       ]
     }
   ]

package/validation/tests/jobProperties/targetTiny.json

@@ -5,7 +5,7 @@
     {
       "type": "launch",
       "target": {
-        "url": "file://validation/tests/targets/targetSmall/index.html",
+        "url": "file://validation/tests/targets/targetsNear/index.html",
         "what": "page with variously sized interaction targets"
       }
     },