testaro 78.0.8 → 78.6.0

package/testaro/elements.ts

@@ -0,0 +1,215 @@
+/*
+  © 2023 CVS Health and/or one of its affiliates. All rights reserved.
+  © 2026 Jonathan Robert Pool.
+
+  Licensed under the MIT License. See LICENSE file at the project root or   https://opensource.org/license/mit/ for details.
+
+  SPDX-License-Identifier: MIT
+*/
+
+// IMPORTS
+
+import type {Page} from 'playwright';
+
+// TYPES
+
+// Data on one attribute of an element.
+interface AttributeDatum {
+  name: string;
+  value: string;
+}
+// Data on one sibling node of an element.
+interface SibInfo {
+  type: number;
+  tagName?: string;
+  attributes?: AttributeDatum[];
+  text?: string;
+}
+// Data on one specified element.
+interface ElementDatum {
+  tagName: string;
+  parentTagName: string;
+  code: string;
+  attributes: AttributeDatum[];
+  textContent: string;
+  labelers?: string[];
+  labels?: string[];
+  parentTextContent?: string;
+  siblings?: {before: SibInfo[]; after: SibInfo[]};
+}
+
+/*
+  elements
+  This test reports data about specified elements within the document body. Meanings of detailLevel values:
+  0. Only total element count; no detail.
+  1. Also data on each specified element.
+  2. Data on each specified element also include the text content of the parent element.
+  3. Data on each specified element also include data on its sibling nodes.
+  Compiled to elements.js by tsc (issue #73); edit this file, not the emitted one.
+*/
+
+// FUNCTIONS
+
+export const reporter = async (
+  page: Page,
+  _0: unknown,
+  _1: unknown,
+  _2: unknown,
+  detailLevel = 0,
+  tagName: string | null = null,
+  onlyVisible = false,
+  attribute?: string
+) => {
+  // Determine a selector of the specified elements, including any descendants of open shadow roots.
+  let selector = `body ${tagName ? tagName.toLowerCase() : '*'}`;
+  if (attribute) {
+    selector += `[${attribute}]`;
+  }
+  if (onlyVisible) {
+    selector += ':visible';
+  }
+  let data: Record<string, unknown> = {};
+  // Get the data on the elements.
+  try {
+    const locator = page.locator(selector);
+    data = await locator.evaluateAll((elements, detailLevel) => {
+      // FUNCTION DEFINITIONS START
+      // Compacts a string.
+      const compact = (string: string) => string.replace(/\s+/g, ' ').trim();
+      // Gets data on a sibling node of an element.
+      const getSibInfo = (node: Node, nodeType: number, text: string | null) => {
+        const sibInfo: SibInfo = {
+          type: nodeType
+        };
+        // If the sibling node is an element:
+        if (nodeType === 1) {
+          sibInfo.tagName = (node as Element).tagName;
+          sibInfo.attributes = [];
+          Array.from((node as Element).attributes).forEach(attribute => {
+            sibInfo.attributes!.push({
+              name: attribute.name,
+              value: attribute.value
+            });
+          });
+        }
+        else if (nodeType === 3) {
+          sibInfo.text = compact(text!);
+        }
+        return sibInfo;
+      };
+      // FUNCTION DEFINITIONS END
+      // Initialize the data with the count of the specified elements.
+      const data: {total: number; items?: ElementDatum[]} = {
+        total: elements.length
+      };
+      // If no itemization is required:
+      if (detailLevel === 0) {
+        // Return the element count.
+        return data;
+      }
+      // Otherwise, i.e. if itemization is required:
+      else {
+        // Initialize the item data.
+        data.items = [];
+        // For each specified element:
+        elements.forEach(element => {
+          // Initialize data on it.
+          const parent = element.parentElement;
+          const datum: ElementDatum = {
+            tagName: element.tagName,
+            parentTagName: parent ? parent.tagName : '',
+            code: compact(element.outerHTML),
+            attributes: [],
+            textContent: compact(element.textContent!)
+          };
+          // For each of its attributes:
+          for (const attribute of element.attributes) {
+            // Add data on the attribute to the element data.
+            const {name, value} = attribute;
+            datum.attributes.push({
+              name,
+              value
+            });
+            // If the element has reference labels:
+            if (name === 'aria-labelledby') {
+              // Add their texts to the element data.
+              const labelerIDs = value.split(/\s+/);
+              const labelers: string[] = [];
+              labelerIDs.forEach(id => {
+                const labeler = document.getElementById(id);
+                if (labeler) {
+                  labelers.push(compact(labeler.textContent!));
+                }
+              });
+              if (labelers.length) {
+                datum.labelers = labelers;
+              }
+            }
+          }
+          // If the element has text content:
+          const {labels, textContent} = element as HTMLInputElement;
+          const compactContent = compact(textContent!);
+          if (compactContent) {
+            // Add it to the element data.
+            datum.textContent = compactContent;
+          }
+          // If the element has labels:
+          if (labels && labels.length) {
+            // Add their texts to the element data.
+            datum.labels = Array.from(labels).map(label => compact(label.textContent!));
+          }
+          // If the parental text content is required:
+          if (detailLevel > 1) {
+            // Add it (excluding any shadow-root descendants) to the element data.
+            datum.parentTextContent = parent ? compact(parent.textContent!) : '';
+          }
+          // If sibling itemization is required:
+          if (detailLevel === 3) {
+            // Add data on the siblings, excluding any descendants of shadow roots, to the data.
+            datum.siblings = {
+              before: [],
+              after: []
+            };
+            let more: Node | null = element;
+            while (more) {
+              more = more.previousSibling;
+              if (more) {
+                const {nodeType, nodeValue} = more;
+                if (! (nodeType === 3 && nodeValue === '')) {
+                  const sibInfo = getSibInfo(more, nodeType, nodeValue);
+                  datum.siblings!.before.unshift(sibInfo);
+                }
+              }
+            }
+            more = element;
+            while (more) {
+              more = more.nextSibling;
+              if (more) {
+                const {nodeType, textContent} = more;
+                if (! (nodeType === 3 && textContent === '')) {
+                  const sibInfo = getSibInfo(more, nodeType, compact(textContent!));
+                  datum.siblings!.after.push(sibInfo);
+                }
+              }
+            }
+          }
+          data.items!.push(datum);
+        });
+        return data;
+      }
+    }, detailLevel);
+  }
+  catch(error) {
+    console.log(`ERROR performing test (${(error as Error).message})`);
+    data = {
+      prevented: true,
+      error: 'ERROR performing test'
+    };
+  }
+  // Return the result.
+  return {
+    data,
+    totals: [],
+    standardInstances: []
+  };
+};

package/testaro/embAc.d.ts

@@ -0,0 +1,3 @@
+import type { Page } from 'playwright';
+import type { Report } from '../types';
+export declare const reporter: (page: Page, report: Report, _: unknown, withItems: boolean) => Promise<import("../procs/testaro").RuleResult>;

package/testaro/embAc.js

@@ -1,3 +1,4 @@
+"use strict";
 /*
   © 2021–2023 CVS Health and/or one of its affiliates. All rights reserved.
   © 2026 Jeff Witt.
@@ -8,30 +9,28 @@
 
   SPDX-License-Identifier: MIT
 */
-
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reporter = void 0;
+const testaro_1 = require("../procs/testaro");
 /*
   embAc
   This test reports interactive elements (links, buttons, inputs, and select lists) contained by links or buttons. Such embedding not only violates the HTML standard, but also complicates user interaction and creates risks of error. It becomes non-obvious what a user will activate with a click.
+  Compiled to embAc.js by tsc (issue #73); edit this file, not the emitted one.
 */
-
-// IMPORTS
-
-const {doTest} = require('../procs/testaro');
-
 // FUNCTIONS
-
 // Runs the test and returns the result.
-exports.reporter = async (page, report, _, withItems) => {
-  const getBadWhat = element => {
-    // Get whether the embedding element is a link or a button.
-    const embedder = element.parentElement.closest('a, button');
-    const embedderWhat = embedder.tagName.toLowerCase() === 'a' ? 'a link' : 'a button';
-    // Return a violation description.
-    return `interactive element is embedded in ${embedderWhat}`;
-  };
-  const selector = ['a', 'button', 'input', 'select']
-  .map(tag => `a ${tag}, button ${tag}`)
-  .join(', ');
-  const whats = 'interactive elements are embedded in links or buttons';
-  return await doTest(page, report, withItems, 'embAc', selector, whats, 2, getBadWhat.toString());
+const reporter = async (page, report, _, withItems) => {
+    const getBadWhat = element => {
+        // Get whether the embedding element is a link or a button.
+        const embedder = element.parentElement.closest('a, button');
+        const embedderWhat = embedder.tagName.toLowerCase() === 'a' ? 'a link' : 'a button';
+        // Return a violation description.
+        return `interactive element is embedded in ${embedderWhat}`;
+    };
+    const selector = ['a', 'button', 'input', 'select']
+        .map(tag => `a ${tag}, button ${tag}`)
+        .join(', ');
+    const whats = 'interactive elements are embedded in links or buttons';
+    return await (0, testaro_1.doTest)(page, report, withItems, 'embAc', selector, whats, 2, getBadWhat.toString());
 };
+exports.reporter = reporter;

package/testaro/embAc.ts

@@ -0,0 +1,40 @@
+/*
+  © 2021–2023 CVS Health and/or one of its affiliates. All rights reserved.
+  © 2026 Jeff Witt.
+  © 2026 Jonathan Robert Pool.
+
+  Licensed under the MIT License. See LICENSE file at the project root or
+  https://opensource.org/license/mit/ for details.
+
+  SPDX-License-Identifier: MIT
+*/
+
+// IMPORTS
+
+import type {Page} from 'playwright';
+import {doTest} from '../procs/testaro';
+import type {GetBadWhat, Report} from '../types';
+
+/*
+  embAc
+  This test reports interactive elements (links, buttons, inputs, and select lists) contained by links or buttons. Such embedding not only violates the HTML standard, but also complicates user interaction and creates risks of error. It becomes non-obvious what a user will activate with a click.
+  Compiled to embAc.js by tsc (issue #73); edit this file, not the emitted one.
+*/
+
+// FUNCTIONS
+
+// Runs the test and returns the result.
+export const reporter = async (page: Page, report: Report, _: unknown, withItems: boolean) => {
+  const getBadWhat: GetBadWhat = element => {
+    // Get whether the embedding element is a link or a button.
+    const embedder = element.parentElement!.closest('a, button');
+    const embedderWhat = embedder!.tagName.toLowerCase() === 'a' ? 'a link' : 'a button';
+    // Return a violation description.
+    return `interactive element is embedded in ${embedderWhat}`;
+  };
+  const selector = ['a', 'button', 'input', 'select']
+  .map(tag => `a ${tag}, button ${tag}`)
+  .join(', ');
+  const whats = 'interactive elements are embedded in links or buttons';
+  return await doTest(page, report, withItems, 'embAc', selector, whats, 2, getBadWhat.toString());
+};

package/testaro/focAll.d.ts

@@ -0,0 +1,13 @@
+import type { Page } from 'playwright';
+import type { Report, StandardInstance } from '../types';
+export declare const reporter: (page: Page, report: Report, _: unknown, withItems: boolean) => Promise<{
+    data: {
+        focusableCount: number;
+        tabFocused: number;
+        discrepancy: number;
+        unreachedCount: number;
+        unexpectedCount: number;
+    };
+    totals: number[];
+    standardInstances: StandardInstance[];
+}>;