@surea11y/core 1.4.1 → 1.5.0

package/src/checks/automatic/menuitem-name-present.js

@@ -150,24 +150,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This menu item has no accessible name.',
-      hint: 'Provide visible text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
-      i18n: {
-        summaryKey: 'menuitemNamePresent_summary_fail',
-        hintKey: 'menuitemNamePresent_hint_fail',
-        params: { role }
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: role, methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This menu item has no accessible name.',
+        hint: 'Provide visible text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
+        i18n: {
+          summaryKey: 'menuitemNamePresent_summary_fail',
+          hintKey: 'menuitemNamePresent_hint_fail',
+          params: { role }
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: role, methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/meta-refresh-no-exceptions.js

@@ -126,24 +126,21 @@ function runInPage(ctx) {
 
     applicableCount += 1;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary:
-        'This page uses a meta refresh, which is an automatic context change not initiated by the user.',
-      hint: 'Remove the meta refresh; trigger the redirect/refresh only in response to a user action instead.',
-      i18n: {
-        summaryKey: 'metaRefreshNoExceptions_summary_fail',
-        hintKey: 'metaRefreshNoExceptions_hint_fail',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'META_REFRESH_PRESENT' }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary:
+          'This page uses a meta refresh, which is an automatic context change not initiated by the user.',
+        hint: 'Remove the meta refresh; trigger the redirect/refresh only in response to a user action instead.',
+        i18n: {
+          summaryKey: 'metaRefreshNoExceptions_summary_fail',
+          hintKey: 'metaRefreshNoExceptions_hint_fail',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'META_REFRESH_PRESENT' }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/meta-refresh-timing-absent.js

@@ -121,23 +121,20 @@ function runInPage(ctx) {
     if (!(delay > 0)) continue;
     if (delay > EXEMPT_DELAY_SECONDS) continue; // WCAG 2.2.1 Exception 3 (>20 hours)
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This page refreshes itself automatically after a delay.',
-      hint: 'Remove the timed meta refresh, or provide a way for users to turn it off, extend it, or pause it before it triggers.',
-      i18n: {
-        summaryKey: 'metaRefreshTimingAbsent_summary_fail',
-        hintKey: 'metaRefreshTimingAbsent_hint_fail',
-        params: { delay: String(delay) }
-      },
-      data: {
-        details: { reasonCode: 'META_REFRESH_DELAYED', delay }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This page refreshes itself automatically after a delay.',
+        hint: 'Remove the timed meta refresh, or provide a way for users to turn it off, extend it, or pause it before it triggers.',
+        i18n: {
+          summaryKey: 'metaRefreshTimingAbsent_summary_fail',
+          hintKey: 'metaRefreshTimingAbsent_hint_fail',
+          params: { delay: String(delay) }
+        },
+        data: {
+          details: { reasonCode: 'META_REFRESH_DELAYED', delay }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/meta-viewport-zoom-enabled.js

@@ -131,23 +131,20 @@ function runInPage(ctx) {
 
     if (!reasons.length) continue;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This viewport meta tag restricts the user’s ability to zoom.',
-      hint: 'Remove user-scalable=no and any maximum-scale below 2 from the viewport meta content.',
-      i18n: {
-        summaryKey: 'metaViewportZoomEnabled_summary_fail',
-        hintKey: 'metaViewportZoomEnabled_hint_fail',
-        params: { reasons: reasons.join(', ') }
-      },
-      data: {
-        details: { reasonCode: 'VIEWPORT_ZOOM_RESTRICTED', reasons }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This viewport meta tag restricts the user’s ability to zoom.',
+        hint: 'Remove user-scalable=no and any maximum-scale below 2 from the viewport meta content.',
+        i18n: {
+          summaryKey: 'metaViewportZoomEnabled_summary_fail',
+          hintKey: 'metaViewportZoomEnabled_hint_fail',
+          params: { reasons: reasons.join(', ') }
+        },
+        data: {
+          details: { reasonCode: 'VIEWPORT_ZOOM_RESTRICTED', reasons }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/meter-name-present.js

@@ -133,24 +133,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This meter has no accessible name.',
-      hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this meter's accessible name.",
-      i18n: {
-        summaryKey: 'meterNamePresent_summary_fail',
-        hintKey: 'meterNamePresent_hint_fail',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'meter', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This meter has no accessible name.',
+        hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this meter's accessible name.",
+        i18n: {
+          summaryKey: 'meterNamePresent_summary_fail',
+          hintKey: 'meterNamePresent_hint_fail',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: 'meter', methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/nested-interactive-controls-absent.js

@@ -267,27 +267,25 @@ function runInPage(ctx) {
     const dedupedNestedTags = [...new Set(nestedTags)];
 
     const tag = el.tagName.toLowerCase();
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This interactive control contains one or more other interactive controls.',
-      hint: 'Move the nested interactive control(s) outside this element; nested interactive controls are not reliably operable via assistive technology.',
-      i18n: {
-        summaryKey: 'nestedInteractiveControlsAbsent_summary_fail',
-        hintKey: 'nestedInteractiveControlsAbsent_hint_fail',
-        params: { element: tag, nestedElements: dedupedNestedTags.join(', ') }
-      },
-      data: {
-        details: {
-          reasonCode: 'NESTED_INTERACTIVE_CONTROL',
-          element: tag,
-          nestedElements: nestedTags
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This interactive control contains one or more other interactive controls.',
+        hint: 'Move the nested interactive control(s) outside this element; nested interactive controls are not reliably operable via assistive technology.',
+        i18n: {
+          summaryKey: 'nestedInteractiveControlsAbsent_summary_fail',
+          hintKey: 'nestedInteractiveControlsAbsent_hint_fail',
+          params: { element: tag, nestedElements: dedupedNestedTags.join(', ') }
+        },
+        data: {
+          details: {
+            reasonCode: 'NESTED_INTERACTIVE_CONTROL',
+            element: tag,
+            nestedElements: nestedTags
+          }
         }
-      }
-    });
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/option-name-present.js

@@ -145,24 +145,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This element has no accessible name.',
-      hint: 'Provide aria-label or aria-labelledby (preferred), or provide visible text that is not hidden from assistive technologies.',
-      i18n: {
-        summaryKey: 'optionNamePresent_summary_fail',
-        hintKey: 'optionNamePresent_hint_fail',
-        params: { controlType: 'option' }
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'option', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This element has no accessible name.',
+        hint: 'Provide aria-label or aria-labelledby (preferred), or provide visible text that is not hidden from assistive technologies.',
+        i18n: {
+          summaryKey: 'optionNamePresent_summary_fail',
+          hintKey: 'optionNamePresent_hint_fail',
+          params: { controlType: 'option' }
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: 'option', methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/progressbar-name-present.js

@@ -135,28 +135,26 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This progress bar has no accessible name.',
-      hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this progress bar's accessible name.",
-      i18n: {
-        summaryKey: 'progressbarNamePresent_summary_fail',
-        hintKey: 'progressbarNamePresent_hint_fail',
-        params: {}
-      },
-      data: {
-        details: {
-          reasonCode: 'name_missing',
-          controlType: 'progressbar',
-          methodTried: res.method
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This progress bar has no accessible name.',
+        hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this progress bar's accessible name.",
+        i18n: {
+          summaryKey: 'progressbarNamePresent_summary_fail',
+          hintKey: 'progressbarNamePresent_hint_fail',
+          params: {}
         },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+        data: {
+          details: {
+            reasonCode: 'name_missing',
+            controlType: 'progressbar',
+            methodTried: res.method
+          },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/searchbox-name-present.js

@@ -227,24 +227,26 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This element has no accessible name.',
-      hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this searchbox's accessible name.",
-      i18n: {
-        summaryKey: 'searchboxNamePresent_summary_fail',
-        hintKey: 'searchboxNamePresent_hint_fail',
-        params: { controlType: 'searchbox' }
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'searchbox', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This element has no accessible name.',
+        hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this searchbox's accessible name.",
+        i18n: {
+          summaryKey: 'searchboxNamePresent_summary_fail',
+          hintKey: 'searchboxNamePresent_hint_fail',
+          params: { controlType: 'searchbox' }
+        },
+        data: {
+          details: {
+            reasonCode: 'name_missing',
+            controlType: 'searchbox',
+            methodTried: res.method
+          },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/server-side-image-map-absent.js

@@ -66,24 +66,21 @@ function runInPage(ctx) {
 
     applicableCount += 1;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary:
-        'This image uses a server-side image map, which has no keyboard-operable equivalent.',
-      hint: 'Replace the server-side image map (ismap) with a client-side image map (<map>/<area>) or separate accessible links/buttons.',
-      i18n: {
-        summaryKey: 'serverSideImageMapAbsent_summary_fail',
-        hintKey: 'serverSideImageMapAbsent_hint_fail',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'SERVER_SIDE_IMAGE_MAP' }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary:
+          'This image uses a server-side image map, which has no keyboard-operable equivalent.',
+        hint: 'Replace the server-side image map (ismap) with a client-side image map (<map>/<area>) or separate accessible links/buttons.',
+        i18n: {
+          summaryKey: 'serverSideImageMapAbsent_summary_fail',
+          hintKey: 'serverSideImageMapAbsent_hint_fail',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'SERVER_SIDE_IMAGE_MAP' }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/slider-name-present.js

@@ -242,24 +242,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This slider has no accessible name.',
-      hint: 'Provide a label, aria-label, or aria-labelledby so assistive technologies can identify the slider.',
-      i18n: {
-        summaryKey: 'sliderNamePresent_summary_fail',
-        hintKey: 'sliderNamePresent_hint_fail',
-        params: { kind }
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: kind, methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This slider has no accessible name.',
+        hint: 'Provide a label, aria-label, or aria-labelledby so assistive technologies can identify the slider.',
+        i18n: {
+          summaryKey: 'sliderNamePresent_summary_fail',
+          hintKey: 'sliderNamePresent_hint_fail',
+          params: { kind }
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: kind, methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/spinbutton-name-present.js

@@ -227,24 +227,26 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This element has no accessible name.',
-      hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this spinbutton's accessible name.",
-      i18n: {
-        summaryKey: 'spinbuttonNamePresent_summary_fail',
-        hintKey: 'spinbuttonNamePresent_hint_fail',
-        params: { controlType: 'spinbutton' }
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'spinbutton', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This element has no accessible name.',
+        hint: "Provide aria-label, aria-labelledby, or a title attribute — visible text content is not exposed as this spinbutton's accessible name.",
+        i18n: {
+          summaryKey: 'spinbuttonNamePresent_summary_fail',
+          hintKey: 'spinbuttonNamePresent_hint_fail',
+          params: { controlType: 'spinbutton' }
+        },
+        data: {
+          details: {
+            reasonCode: 'name_missing',
+            controlType: 'spinbutton',
+            methodTried: res.method
+          },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/summary-name-present.js

@@ -144,24 +144,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This summary has no accessible name.',
-      hint: 'Provide summary text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
-      i18n: {
-        summaryKey: 'summaryNamePresent_summary_fail',
-        hintKey: 'summaryNamePresent_hint_fail',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'summary', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This summary has no accessible name.',
+        hint: 'Provide summary text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
+        i18n: {
+          summaryKey: 'summaryNamePresent_summary_fail',
+          hintKey: 'summaryNamePresent_hint_fail',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: 'summary', methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/tab-name-present.js

@@ -148,24 +148,22 @@ function runInPage(ctx) {
           }
         })()
       : null;
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This tab has no accessible name.',
-      hint: 'Provide tab text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
-      i18n: {
-        summaryKey: 'tabNamePresent_summary_fail',
-        hintKey: 'tabNamePresent_hint_fail',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'name_missing', controlType: 'tab', methodTried: res.method },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This tab has no accessible name.',
+        hint: 'Provide tab text that is not hidden from assistive technologies, or provide aria-label or aria-labelledby.',
+        i18n: {
+          summaryKey: 'tabNamePresent_summary_fail',
+          hintKey: 'tabNamePresent_hint_fail',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'name_missing', controlType: 'tab', methodTried: res.method },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/automatic/table-headers-attr-valid.js

@@ -104,23 +104,21 @@ function runInPage(ctx) {
     const dedupedInvalidIds = [...new Set(invalid.map((i) => i.id))];
 
     const tag = el.tagName.toLowerCase();
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This cell’s headers attribute references one or more invalid header cells.',
-      hint: 'Update the headers attribute so every id refers to a <th> element within the same table.',
-      i18n: {
-        summaryKey: 'tableHeadersAttrValid_summary_fail',
-        hintKey: 'tableHeadersAttrValid_hint_fail',
-        params: { element: tag, invalidIds: dedupedInvalidIds.join(', ') }
-      },
-      data: {
-        details: { reasonCode: 'TABLE_HEADERS_ATTR_INVALID', element: tag, invalid }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This cell’s headers attribute references one or more invalid header cells.',
+        hint: 'Update the headers attribute so every id refers to a <th> element within the same table.',
+        i18n: {
+          summaryKey: 'tableHeadersAttrValid_summary_fail',
+          hintKey: 'tableHeadersAttrValid_hint_fail',
+          params: { element: tag, invalidIds: dedupedInvalidIds.join(', ') }
+        },
+        data: {
+          details: { reasonCode: 'TABLE_HEADERS_ATTR_INVALID', element: tag, invalid }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {