From 187e19225b9d36c32c13f7469aa974efe429502e Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro.celaya@hypothes.is>
Date: Wed, 8 Nov 2023 10:16:37 +0100
Subject: [PATCH] Add isViolationRelevant optional prop to Scenario for a11y
 tests

---
 src/accessibility.ts | 20 +++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/accessibility.ts b/src/accessibility.ts
index 0dd3ea6..a69db81 100644
--- a/src/accessibility.ts
+++ b/src/accessibility.ts
@@ -1,4 +1,5 @@
 import { run } from 'axe-core';
+import type { Result } from 'axe-core';
 import { ReactWrapper, mount } from 'enzyme';
 import { isValidElement } from 'preact';
 import type { VNode } from 'preact';
@@ -18,6 +19,14 @@ export type Scenario = {
    * component with a `<div />` in that case.
    */
   content: () => VNode | ReactWrapper;
+
+  /**
+   * This callback will be applied to all found accessibility violations,
+   * allowing you to ignore those that are not relevant for your test.
+   * A use case for this is any combination that axe-core considers invalid
+   * because certain screen readers won't play well, but their use is marginal.
+   */
+  isViolationRelevant?: (violation: Result) => boolean;
 };
 
 async function testScenario(elementOrWrapper: VNode | ReactWrapper) {
@@ -66,7 +75,9 @@ export function checkAccessibility(
   scenarios: Scenario | Scenario[],
 ): () => Promise<void> {
   return async () => {
-    for (const { name = 'default', content } of asArray(scenarios)) {
+    for (const { name = 'default', content, isViolationRelevant } of asArray(
+      scenarios,
+    )) {
       if (typeof content !== 'function') {
         throw new Error(
           `"content" key for accessibility scenario "${name}" should be a function but is a ${typeof content}`,
@@ -85,10 +96,13 @@ export function checkAccessibility(
       }
 
       const violations = await testScenario(elementOrWrapper);
-      for (const violation of violations) {
+      const filteredViolations = isViolationRelevant
+        ? violations.filter(isViolationRelevant)
+        : violations;
+      for (const violation of filteredViolations) {
         console.error('axe-core violation', JSON.stringify(violation, null, 2));
       }
-      if (violations.length > 0) {
+      if (filteredViolations.length > 0) {
         throw new Error(`Scenario "${name}" has accessibility violations`);
       }
     }