aria-ease 3.0.1 → 3.0.3

package/README.md

@@ -172,7 +172,7 @@ updateAccordionTriggerAriaAttributes(
   "accordion-container", // Container ID
   "accordion-trigger", // Shared class for triggers
   accordionStates, // State array
-  0 // Index of trigger that changed
+  0, // Index of trigger that changed
 );
 ```
 
@@ -223,7 +223,7 @@ function handleCheckboxClick(index) {
     "checkbox-group",
     "custom-checkbox",
     checkboxStates,
-    index
+    index,
   );
 }
 ```
@@ -314,14 +314,14 @@ Aria-Ease includes a built-in testing framework for automated accessibility vali
 import { testUiComponent } from "aria-ease/test";
 
 // In your test file (Vitest, Jest, etc.)
-test("menu is accessible", async () => {
-  const { container } = render(<MyMenu />);
+test("combobox is accessible", async () => {
+  const { container } = render(<Combobox />);
 
   // Runs axe-core + contract tests
   const result = await testUiComponent(
-    "menu",
+    "combobox",
     container,
-    "http://localhost:3000" // Optional: full E2E with Playwright
+    "http://localhost:3000", // Optional: full E2E with Playwright
   );
 
   expect(result.violations).toHaveLength(0);

package/bin/{audit-XZJXMUPL.js → audit-6A7OW5NJ.js}

@@ -1,4 +1,4 @@
-import "./chunk-JSBRDJBE.js";
+import "./chunk-2P3A4VVY.js";
 
 // src/utils/audit/src/audit/audit.ts
 import AxeBuilder from "@axe-core/playwright";

package/bin/{chunk-JSBRDJBE.js → chunk-2P3A4VVY.js}

@@ -7,6 +7,10 @@ var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __commonJS = (cb, mod) => function __require() {
   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -15,6 +19,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
   // If the importer is in node compatibility mode or this is not an ESM
   // file that has been converted to a CommonJS file using a Babel-
@@ -26,5 +31,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 
 export {
   __commonJS,
+  __export,
+  __reExport,
   __toESM
 };

package/bin/cli.cjs

@@ -24,6 +24,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
   // If the importer is in node compatibility mode or this is not an ESM
   // file that has been converted to a CommonJS file using a Babel-
@@ -13260,7 +13261,7 @@ async function runContractTests(componentName, component) {
   const staticFailed = 0;
   reporter.reportStatic(staticPassed, staticFailed);
   reporter.summary(failures);
-  return { passes, failures };
+  return { passes, failures, skipped };
 }
 var import_promises, import_meta;
 var init_contractTestRunner = __esm({
@@ -13274,6 +13275,20 @@ var init_contractTestRunner = __esm({
   }
 });
 
+// node_modules/@playwright/test/index.mjs
+var test_exports = {};
+__export(test_exports, {
+  default: () => import_test.default
+});
+var import_test;
+var init_test = __esm({
+  "node_modules/@playwright/test/index.mjs"() {
+    "use strict";
+    __reExport(test_exports, require("playwright/test"));
+    import_test = __toESM(require("playwright/test"), 1);
+  }
+});
+
 // src/utils/test/contract/contractTestRunnerPlaywright.ts
 var contractTestRunnerPlaywright_exports = {};
 __export(contractTestRunnerPlaywright_exports, {
@@ -13293,6 +13308,7 @@ async function runContractTestsPlaywright(componentName, url) {
   reporter.start(componentName, totalTests);
   const failures = [];
   const passes = [];
+  const skipped = [];
   let browser = null;
   try {
     browser = await import_playwright3.chromium.launch({ headless: true });
@@ -13300,13 +13316,25 @@ async function runContractTestsPlaywright(componentName, url) {
     const page = await context.newPage();
     await page.goto(url, {
       waitUntil: "domcontentloaded",
-      timeout: 6e4
+      timeout: 9e4
     });
     const mainSelector = componentContract.selectors.trigger || componentContract.selectors.input || componentContract.selectors.container;
     if (!mainSelector) {
       throw new Error(`No main selector (trigger, input, or container) found in contract for ${componentName}`);
     }
-    await page.waitForSelector(mainSelector, { timeout: 6e4 });
+    await page.waitForSelector(mainSelector, { timeout: 9e4 });
+    if (componentName === "menu" && componentContract.selectors.trigger) {
+      await page.waitForFunction(
+        (selector) => {
+          const trigger = document.querySelector(selector);
+          return trigger && trigger.getAttribute("data-menu-initialized") === "true";
+        },
+        componentContract.selectors.trigger,
+        { timeout: 6e3 }
+      ).catch(() => {
+        console.warn("Menu initialization signal not detected, continuing with tests...");
+      });
+    }
     async function resolveRelativeTarget(selector, relative) {
       const items = await page.locator(selector).all();
       switch (relative) {
@@ -13392,7 +13420,7 @@ async function runContractTestsPlaywright(componentName, url) {
             if (componentContract.selectors.input) {
               const inputElement = page.locator(componentContract.selectors.input).first();
               await inputElement.clear();
-              await page.waitForTimeout(50);
+              await page.waitForTimeout(100);
             }
           }
         }
@@ -13405,7 +13433,7 @@ async function runContractTestsPlaywright(componentName, url) {
             continue;
           }
           await page.locator(focusSelector).first().focus();
-          await page.waitForTimeout(50);
+          await page.waitForTimeout(100);
         }
         if (act.type === "type" && act.value) {
           const typeSelector = componentContract.selectors[act.target];
@@ -13414,7 +13442,7 @@ async function runContractTestsPlaywright(componentName, url) {
             continue;
           }
           await page.locator(typeSelector).first().fill(act.value);
-          await page.waitForTimeout(50);
+          await page.waitForTimeout(100);
         }
         if (act.type === "click") {
           if (act.target === "document") {
@@ -13431,7 +13459,7 @@ async function runContractTestsPlaywright(componentName, url) {
               continue;
             }
             await relativeElement.click();
-            await page.waitForTimeout(200);
+            await page.waitForTimeout(componentName === "menu" ? 500 : 200);
           } else {
             const actionSelector = componentContract.selectors[act.target];
             if (!actionSelector) {
@@ -13439,7 +13467,7 @@ async function runContractTestsPlaywright(componentName, url) {
               continue;
             }
             await page.locator(actionSelector).first().click();
-            await page.waitForTimeout(200);
+            await page.waitForTimeout(componentName === "menu" ? 500 : 200);
           }
         }
         if (act.type === "keypress" && act.key) {
@@ -13464,7 +13492,7 @@ async function runContractTestsPlaywright(componentName, url) {
           if (act.target === "focusable" && ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Escape"].includes(keyValue)) {
             await page.waitForTimeout(100);
             await page.keyboard.press(keyValue);
-            await page.waitForTimeout(50);
+            await page.waitForTimeout(100);
           } else {
             const keypressSelector = componentContract.selectors[act.target];
             if (!keypressSelector) {
@@ -13493,7 +13521,7 @@ async function runContractTestsPlaywright(componentName, url) {
               continue;
             }
             await relativeElement.hover();
-            await page.waitForTimeout(50);
+            await page.waitForTimeout(100);
           } else {
             const hoverSelector = componentContract.selectors[act.target];
             if (!hoverSelector) {
@@ -13501,7 +13529,7 @@ async function runContractTestsPlaywright(componentName, url) {
               continue;
             }
             await page.locator(hoverSelector).first().hover();
-            await page.waitForTimeout(50);
+            await page.waitForTimeout(100);
           }
         }
         await page.waitForTimeout(100);
@@ -13533,32 +13561,48 @@ async function runContractTestsPlaywright(componentName, url) {
           continue;
         }
         if (assertion.assertion === "toBeVisible") {
-          const isVisible = await target.isVisible();
-          if (isVisible) {
+          try {
+            await (0, test_exports.expect)(target).toBeVisible({ timeout: 3e3 });
             passes.push(`${assertion.target} is visible as expected. Test: "${dynamicTest.description}".`);
-          } else {
-            failures.push(`${assertion.failureMessage}`);
+          } catch {
+            const debugState = await page.evaluate((sel) => {
+              const el = sel ? document.querySelector(sel) : null;
+              if (!el) return "element not found";
+              const styles = window.getComputedStyle(el);
+              return `display:${styles.display}, visibility:${styles.visibility}, opacity:${styles.opacity}`;
+            }, componentContract.selectors[assertion.target] || "");
+            failures.push(`${assertion.failureMessage} (actual: ${debugState})`);
           }
         }
         if (assertion.assertion === "notToBeVisible") {
-          const isVisible = await target.isVisible();
-          if (!isVisible) {
+          try {
+            await (0, test_exports.expect)(target).toBeHidden({ timeout: 5e3 });
             passes.push(`${assertion.target} is not visible as expected. Test: "${dynamicTest.description}".`);
-          } else {
-            failures.push(assertion.failureMessage + ` ${assertion.target} is still visible.`);
+          } catch {
+            const debugState = await page.evaluate((sel) => {
+              const el = sel ? document.querySelector(sel) : null;
+              if (!el) return "element not found";
+              const styles = window.getComputedStyle(el);
+              return `display:${styles.display}, visibility:${styles.visibility}, opacity:${styles.opacity}`;
+            }, componentContract.selectors[assertion.target] || "");
+            failures.push(assertion.failureMessage + ` ${assertion.target} is still visible (actual: ${debugState}).`);
           }
         }
         if (assertion.assertion === "toHaveAttribute" && assertion.attribute && assertion.expectedValue) {
-          const attributeValue = await target.getAttribute(assertion.attribute);
-          if (assertion.expectedValue === "!empty") {
-            if (attributeValue && attributeValue.trim() !== "") {
-              passes.push(`${assertion.target} has non-empty "${assertion.attribute}". Test: "${dynamicTest.description}".`);
+          try {
+            if (assertion.expectedValue === "!empty") {
+              const attributeValue = await target.getAttribute(assertion.attribute);
+              if (attributeValue && attributeValue.trim() !== "") {
+                passes.push(`${assertion.target} has non-empty "${assertion.attribute}". Test: "${dynamicTest.description}".`);
+              } else {
+                failures.push(assertion.failureMessage + ` ${assertion.target} "${assertion.attribute}" should not be empty, found "${attributeValue}".`);
+              }
             } else {
-              failures.push(assertion.failureMessage + ` ${assertion.target} "${assertion.attribute}" should not be empty, found "${attributeValue}".`);
+              await (0, test_exports.expect)(target).toHaveAttribute(assertion.attribute, assertion.expectedValue, { timeout: 3e3 });
+              passes.push(`${assertion.target} has expected "${assertion.attribute}". Test: "${dynamicTest.description}".`);
             }
-          } else if (attributeValue === assertion.expectedValue) {
-            passes.push(`${assertion.target} has expected "${assertion.attribute}". Test: "${dynamicTest.description}".`);
-          } else {
+          } catch {
+            const attributeValue = await target.getAttribute(assertion.attribute);
             failures.push(assertion.failureMessage + ` ${assertion.target} "${assertion.attribute}" should be "${assertion.expectedValue}", found "${attributeValue}".`);
           }
         }
@@ -13583,10 +13627,10 @@ async function runContractTestsPlaywright(componentName, url) {
           }
         }
         if (assertion.assertion === "toHaveFocus") {
-          const hasFocus = await target.evaluate((el) => el === document.activeElement);
-          if (hasFocus) {
+          try {
+            await (0, test_exports.expect)(target).toBeFocused({ timeout: 5e3 });
             passes.push(`${assertion.target} has focus as expected. Test: "${dynamicTest.description}".`);
-          } else {
+          } catch {
             failures.push(`${assertion.failureMessage}`);
           }
         }
@@ -13627,13 +13671,14 @@ async function runContractTestsPlaywright(componentName, url) {
   } finally {
     if (browser) await browser.close();
   }
-  return { passes, failures };
+  return { passes, failures, skipped };
 }
 var import_playwright3, import_fs, import_meta2;
 var init_contractTestRunnerPlaywright = __esm({
   "src/utils/test/contract/contractTestRunnerPlaywright.ts"() {
     "use strict";
     import_playwright3 = require("playwright");
+    init_test();
     import_fs = require("fs");
     init_contract();
     init_ContractReporter();
@@ -13643,15 +13688,49 @@ var init_contractTestRunnerPlaywright = __esm({
 
 // src/utils/test/src/test.ts
 async function testUiComponent(componentName, component, url) {
-  const results = await (0, import_jest_axe.axe)(component);
+  if (!componentName || typeof componentName !== "string") {
+    throw new Error("\u274C testUiComponent requires a valid componentName (string)");
+  }
+  if (!component || !(component instanceof HTMLElement)) {
+    throw new Error("\u274C testUiComponent requires a valid component (HTMLElement)");
+  }
+  if (url && typeof url !== "string") {
+    throw new Error("\u274C testUiComponent url parameter must be a string");
+  }
+  let results;
+  try {
+    results = await (0, import_jest_axe.axe)(component);
+  } catch (error) {
+    throw new Error(
+      `\u274C Axe accessibility scan failed
+Error: ${error instanceof Error ? error.message : String(error)}`
+    );
+  }
   let contract;
-  if (url) {
-    console.log(`\u{1F3AD} Running Playwright E2E tests on ${url}`);
-    const { runContractTestsPlaywright: runContractTestsPlaywright2 } = await Promise.resolve().then(() => (init_contractTestRunnerPlaywright(), contractTestRunnerPlaywright_exports));
-    contract = await runContractTestsPlaywright2(componentName, url);
-  } else {
-    console.log(`\u{1F9EA} Running jsdom tests (limited event handling)`);
-    contract = await runContractTests(componentName, component);
+  try {
+    if (url) {
+      console.log(`\u{1F3AD} Running Playwright E2E tests on ${url}`);
+      try {
+        new URL(url);
+      } catch {
+        throw new Error(
+          `\u274C Invalid URL format: "${url}"
+URL must include protocol (e.g., "http://localhost:5173/test")`
+        );
+      }
+      const { runContractTestsPlaywright: runContractTestsPlaywright2 } = await Promise.resolve().then(() => (init_contractTestRunnerPlaywright(), contractTestRunnerPlaywright_exports));
+      contract = await runContractTestsPlaywright2(componentName, url);
+    } else {
+      console.log(`\u{1F9EA} Running jsdom tests (limited event handling)`);
+      console.log(`Some tests may be skipped or yield false positives/negatives.
+For full coverage, run with a URL to enable Playwright E2E tests.`);
+      contract = await runContractTests(componentName, component);
+    }
+  } catch (error) {
+    if (error instanceof Error) {
+      throw error;
+    }
+    throw new Error(`\u274C Contract test execution failed: ${String(error)}`);
   }
   const result = {
     violations: results.violations,
@@ -13662,10 +13741,11 @@ async function testUiComponent(componentName, component, url) {
     const mode = url ? "Playwright" : "jsdom";
     throw new Error(
       `
-\u274C ${contract.failures.length} assertion${contract.failures.length > 1 ? "s" : ""} failed (${mode} mode)
-\u2705 ${contract.passes.length} assertion${contract.passes.length > 1 ? "s" : ""} passed
+\u274C ${contract.failures.length} accessibility contract test${contract.failures.length > 1 ? "s" : ""} failed (${mode} mode)
+\u2705 ${contract.passes.length} test${contract.passes.length > 1 ? "s" : ""} passed
 
-\u{1F4CB} Review the detailed test report above for specific failures.`
+\u{1F4CB} Review the detailed test report above for specific failures.
+\u{1F4A1} Contract tests validate ARIA attributes and keyboard interactions per W3C APG guidelines.`
     );
   }
   if (results.violations.length > 0) {
@@ -13688,7 +13768,7 @@ ${violationDetails}
   return result;
 }
 var import_jest_axe, runTest;
-var init_test = __esm({
+var init_test2 = __esm({
   "src/utils/test/src/test.ts"() {
     "use strict";
     import_jest_axe = require("jest-axe");
@@ -13721,15 +13801,15 @@ var init_test = __esm({
 });
 
 // src/utils/test/index.ts
-var test_exports = {};
-__export(test_exports, {
+var test_exports2 = {};
+__export(test_exports2, {
   runTest: () => runTest,
   testUiComponent: () => testUiComponent
 });
-var init_test2 = __esm({
+var init_test3 = __esm({
   "src/utils/test/index.ts"() {
     "use strict";
-    init_test();
+    init_test2();
   }
 });
 
@@ -13936,7 +14016,7 @@ program.command("audit").description("Run axe-core powered accessibility audit o
   console.log(import_chalk.default.green("\n\u{1F389} All audits completed."));
 });
 program.command("test").description("Run core a11y accessibility standard tests on UI components").action(async () => {
-  const { runTest: runTest2 } = await Promise.resolve().then(() => (init_test2(), test_exports));
+  const { runTest: runTest2 } = await Promise.resolve().then(() => (init_test3(), test_exports2));
   runTest2();
 });
 program.command("help").description("Display help information").action(() => {

package/bin/cli.js

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-import "./chunk-JSBRDJBE.js";
+import "./chunk-2P3A4VVY.js";
 
 // src/utils/cli/cli.ts
 import { Command } from "commander";
@@ -128,8 +128,8 @@ var program = new Command();
 program.name("aria-ease").description("Run accessibility tests and audits").version("2.2.3");
 program.command("audit").description("Run axe-core powered accessibility audit on webpages").option("-u, --url <url>", "Single URL to audit").option("-f, --format <format>", "Output format for the audit report: json | csv | html | all", "all").option("-o, --out <path>", "Directory to save the audit report", "./accessibility-reports/audit").action(async (opts) => {
   console.log(chalk.cyanBright("\u{1F680} Starting accessibility audit...\n"));
-  const { runAudit } = await import("./audit-XZJXMUPL.js");
-  const { formatResults } = await import("./formatters-U4E5EVPL.js");
+  const { runAudit } = await import("./audit-6A7OW5NJ.js");
+  const { formatResults } = await import("./formatters-FCDHFTPI.js");
   const { config, configPath, errors } = await loadConfig(process.cwd());
   if (configPath) {
     console.log(chalk.green(`\u2705 Loaded config from ${path2.basename(configPath)}
@@ -204,7 +204,7 @@ program.command("audit").description("Run axe-core powered accessibility audit o
   console.log(chalk.green("\n\u{1F389} All audits completed."));
 });
 program.command("test").description("Run core a11y accessibility standard tests on UI components").action(async () => {
-  const { runTest } = await import("./test-PK5MBHIN.js");
+  const { runTest } = await import("./test-D374H2ZS.js");
   runTest();
 });
 program.command("help").description("Display help information").action(() => {