@surea11y/core 1.4.1 → 1.5.0

package/src/checks/manual/empty-heading-manual.js

@@ -148,8 +148,6 @@ function runInPage(ctx) {
     const name = getAccessibleNameText(el);
     if (name) continue;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
     const eligInfo = helpers.getEligibilityInfo
       ? (() => {
           try {
@@ -160,21 +158,21 @@ function runInPage(ctx) {
         })()
       : null;
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This heading has no accessible name.',
-      hint: 'Add text content (or aria-label/aria-labelledby) to this heading, or remove it if it is not needed.',
-      i18n: {
-        summaryKey: 'emptyHeading_summary_cantTell',
-        hintKey: 'emptyHeading_hint_cantTell',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'HEADING_EMPTY' },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This heading has no accessible name.',
+        hint: 'Add text content (or aria-label/aria-labelledby) to this heading, or remove it if it is not needed.',
+        i18n: {
+          summaryKey: 'emptyHeading_summary_cantTell',
+          hintKey: 'emptyHeading_hint_cantTell',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'HEADING_EMPTY' },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/manual/empty-table-header-manual.js

@@ -141,43 +141,40 @@ function runInPage(ctx) {
 
     if (getVisibleText(el)) continue;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
     const ariaName = getAriaOnlyName(el);
     if (ariaName) {
-      occurrences.push({
-        selector: stableSelector,
-        html,
-        summary:
-          'This table header cell has no visible text — its only accessible name comes from aria-label/aria-labelledby, which real screen-reader/browser combinations (e.g. NVDA+Firefox, iOS VoiceOver+Safari) are known to ignore on <th> elements.',
-        hint: 'Add visible text content to this header cell (in addition to, or instead of, aria-label/aria-labelledby) — visible text is the only naming mechanism confirmed to work across tested screen readers.',
+      occurrences.push(
+        helpers.reportOccurrence(el, {
+          summary:
+            'This table header cell has no visible text — its only accessible name comes from aria-label/aria-labelledby, which real screen-reader/browser combinations (e.g. NVDA+Firefox, iOS VoiceOver+Safari) are known to ignore on <th> elements.',
+          hint: 'Add visible text content to this header cell (in addition to, or instead of, aria-label/aria-labelledby) — visible text is the only naming mechanism confirmed to work across tested screen readers.',
+          i18n: {
+            summaryKey: 'emptyTableHeader_summary_cantTell_ariaOnly',
+            hintKey: 'emptyTableHeader_hint_cantTell_ariaOnly',
+            params: {}
+          },
+          data: {
+            details: { reasonCode: 'TABLE_HEADER_NAME_NOT_VISIBLE_TEXT', ariaName }
+          }
+        })
+      );
+      continue;
+    }
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This table header cell has no accessible name.',
+        hint: 'Add text content (or aria-label/aria-labelledby) to this header cell, or remove it if it is not needed.',
         i18n: {
-          summaryKey: 'emptyTableHeader_summary_cantTell_ariaOnly',
-          hintKey: 'emptyTableHeader_hint_cantTell_ariaOnly',
+          summaryKey: 'emptyTableHeader_summary_cantTell',
+          hintKey: 'emptyTableHeader_hint_cantTell',
           params: {}
         },
         data: {
-          details: { reasonCode: 'TABLE_HEADER_NAME_NOT_VISIBLE_TEXT', ariaName }
+          details: { reasonCode: 'TABLE_HEADER_EMPTY' }
         }
-      });
-      continue;
-    }
-
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: 'This table header cell has no accessible name.',
-      hint: 'Add text content (or aria-label/aria-labelledby) to this header cell, or remove it if it is not needed.',
-      i18n: {
-        summaryKey: 'emptyTableHeader_summary_cantTell',
-        hintKey: 'emptyTableHeader_hint_cantTell',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'TABLE_HEADER_EMPTY' }
-      }
-    });
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/manual/form-control-programmatic-label-quality-manual.js

@@ -185,20 +185,13 @@ function runInPage(ctx) {
 
     const reasonCode =
       method === 'title' ? 'label_from_title_primary' : 'label_from_placeholder_primary';
-    const methodLabel =
-      method === 'title'
-        ? 'title'
-        : method === 'placeholder'
-          ? 'placeholder'
-          : 'title or placeholder';
-
     const baseOccurrence = {
-      summary: 'Form control’s primary label is derived from title or placeholder.',
+      summary: `Form control’s primary label is derived from ${method}.`,
       hint: 'Prefer a persistent <label> or aria-labelledby. Avoid relying on placeholder/title as the primary label.',
       i18n: {
         summaryKey: 'formControl_programmaticLabelQuality_summary_cantTell',
         hintKey: 'formControl_programmaticLabelQuality_hint_cantTell',
-        params: { element: (el.tagName || '').toLowerCase(), method, methodLabel }
+        params: { element: (el.tagName || '').toLowerCase(), method }
       },
       data: {
         visibilityFilter: vf || { targetSet: 'acc', accEligible: null, reasons: [] },

package/src/checks/manual/heading-order-manual.js

@@ -125,29 +125,24 @@ function runInPage(ctx) {
     const { el, level } = headings[i];
 
     if (level > highestSoFar + 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 heading jumps from level ${highestSoFar} to level ${level}, skipping a level.`,
-        hint: 'Use consecutive heading levels (do not skip a level when going deeper) so the document outline stays predictable.',
-        i18n: {
-          summaryKey: 'headingOrder_summary_cantTell',
-          hintKey: 'headingOrder_hint_cantTell',
-          params: { fromLevel: String(highestSoFar), toLevel: String(level) }
-        },
-        data: {
-          details: {
-            reasonCode: 'HEADING_ORDER_SKIPPED_LEVEL',
-            fromLevel: highestSoFar,
-            toLevel: level
+      occurrences.push(
+        helpers.reportOccurrence(el, {
+          summary: `This heading jumps from level ${highestSoFar} to level ${level}, skipping a level.`,
+          hint: 'Use consecutive heading levels (do not skip a level when going deeper) so the document outline stays predictable.',
+          i18n: {
+            summaryKey: 'headingOrder_summary_cantTell',
+            hintKey: 'headingOrder_hint_cantTell',
+            params: { fromLevel: String(highestSoFar), toLevel: String(level) }
+          },
+          data: {
+            details: {
+              reasonCode: 'HEADING_ORDER_SKIPPED_LEVEL',
+              fromLevel: highestSoFar,
+              toLevel: level
+            }
           }
-        }
-      });
+        })
+      );
     }
 
     if (level > highestSoFar) highestSoFar = level;

package/src/checks/manual/image-redundant-alt-manual.js

@@ -111,23 +111,20 @@ function runInPage(ctx) {
 
     if (otherText.toLowerCase() !== alt.toLowerCase()) 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 image's alt text duplicates other visible text right next to it.",
-      hint: 'Make the alt text empty (alt="") if the image is purely decorative alongside the text, or remove the redundant duplication.',
-      i18n: {
-        summaryKey: 'imageRedundantAlt_summary_cantTell',
-        hintKey: 'imageRedundantAlt_hint_cantTell',
-        params: { alt }
-      },
-      data: {
-        details: { reasonCode: 'IMAGE_ALT_REDUNDANT', alt }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: "This image's alt text duplicates other visible text right next to it.",
+        hint: 'Make the alt text empty (alt="") if the image is purely decorative alongside the text, or remove the redundant duplication.',
+        i18n: {
+          summaryKey: 'imageRedundantAlt_summary_cantTell',
+          hintKey: 'imageRedundantAlt_hint_cantTell',
+          params: { alt }
+        },
+        data: {
+          details: { reasonCode: 'IMAGE_ALT_REDUNDANT', alt }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/manual/label-title-only-manual.js

@@ -94,23 +94,21 @@ function runInPage(ctx) {
     if (!nameInfo || nameInfo.mechanism !== 'title') continue;
 
     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 form control relies on the title attribute as its only label.',
-      hint: 'Add a visible <label> (or aria-label/aria-labelledby) in addition to, or instead of, the title attribute.',
-      i18n: {
-        summaryKey: 'labelTitleOnly_summary_cantTell',
-        hintKey: 'labelTitleOnly_hint_cantTell',
-        params: { element: tag }
-      },
-      data: {
-        details: { reasonCode: 'LABEL_TITLE_ONLY', element: tag }
-      }
-    });
+
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This form control relies on the title attribute as its only label.',
+        hint: 'Add a visible <label> (or aria-label/aria-labelledby) in addition to, or instead of, the title attribute.',
+        i18n: {
+          summaryKey: 'labelTitleOnly_summary_cantTell',
+          hintKey: 'labelTitleOnly_hint_cantTell',
+          params: { element: tag }
+        },
+        data: {
+          details: { reasonCode: 'LABEL_TITLE_ONLY', element: tag }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/manual/landmark-banner-is-top-level-manual.js

@@ -209,23 +209,20 @@ function runInPage(ctx) {
   for (const el of banners) {
     if (!hasLandmarkAncestor(el)) 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 banner landmark is nested inside another landmark region.',
-      hint: 'Move the banner landmark (header/role="banner") so it is not contained by another landmark; a banner should be a top-level region of the page.',
-      i18n: {
-        summaryKey: 'landmarkBannerIsTopLevel_summary_cantTell',
-        hintKey: 'landmarkBannerIsTopLevel_hint_cantTell',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'LANDMARK_BANNER_NOT_TOP_LEVEL' }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This banner landmark is nested inside another landmark region.',
+        hint: 'Move the banner landmark (header/role="banner") so it is not contained by another landmark; a banner should be a top-level region of the page.',
+        i18n: {
+          summaryKey: 'landmarkBannerIsTopLevel_summary_cantTell',
+          hintKey: 'landmarkBannerIsTopLevel_hint_cantTell',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'LANDMARK_BANNER_NOT_TOP_LEVEL' }
+        }
+      })
+    );
   }
 
   if (occurrences.length) {

package/src/checks/manual/landmark-contentinfo-is-top-level-manual.js

@@ -202,23 +202,20 @@ function runInPage(ctx) {
   for (const el of contentinfos) {
     if (!hasLandmarkAncestor(el)) 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 contentinfo landmark is nested inside another landmark region.',
-      hint: 'Move the contentinfo landmark (footer/role="contentinfo") so it is not contained by another landmark; contentinfo should be a top-level region of the page.',
-      i18n: {
-        summaryKey: 'landmarkContentinfoIsTopLevel_summary_cantTell',
-        hintKey: 'landmarkContentinfoIsTopLevel_hint_cantTell',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'LANDMARK_CONTENTINFO_NOT_TOP_LEVEL' }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This contentinfo landmark is nested inside another landmark region.',
+        hint: 'Move the contentinfo landmark (footer/role="contentinfo") so it is not contained by another landmark; contentinfo should be a top-level region of the page.',
+        i18n: {
+          summaryKey: 'landmarkContentinfoIsTopLevel_summary_cantTell',
+          hintKey: 'landmarkContentinfoIsTopLevel_hint_cantTell',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'LANDMARK_CONTENTINFO_NOT_TOP_LEVEL' }
+        }
+      })
+    );
   }
 
   if (occurrences.length) {

package/src/checks/manual/landmark-main-is-top-level-manual.js

@@ -192,23 +192,20 @@ function runInPage(ctx) {
   for (const el of mains) {
     if (!hasLandmarkAncestor(el)) 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 main landmark is nested inside another landmark region.',
-      hint: 'Move the main landmark (<main>/role="main") so it is not contained by another landmark; main should be a top-level region of the page.',
-      i18n: {
-        summaryKey: 'landmarkMainIsTopLevel_summary_cantTell',
-        hintKey: 'landmarkMainIsTopLevel_hint_cantTell',
-        params: {}
-      },
-      data: {
-        details: { reasonCode: 'LANDMARK_MAIN_NOT_TOP_LEVEL' }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This main landmark is nested inside another landmark region.',
+        hint: 'Move the main landmark (<main>/role="main") so it is not contained by another landmark; main should be a top-level region of the page.',
+        i18n: {
+          summaryKey: 'landmarkMainIsTopLevel_summary_cantTell',
+          hintKey: 'landmarkMainIsTopLevel_hint_cantTell',
+          params: {}
+        },
+        data: {
+          details: { reasonCode: 'LANDMARK_MAIN_NOT_TOP_LEVEL' }
+        }
+      })
+    );
   }
 
   if (occurrences.length) {

package/src/checks/manual/landmark-no-duplicate-banner-manual.js

@@ -171,12 +171,7 @@ function runInPage(ctx) {
   }
 
   const occurrences = banners.map((el) => {
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    return {
-      selector: stableSelector,
-      html,
+    return helpers.reportOccurrence(el, {
       summary: 'This page has more than one banner landmark.',
       hint: 'Keep only one banner landmark (header/role="banner") per page.',
       i18n: {
@@ -187,7 +182,7 @@ function runInPage(ctx) {
       data: {
         details: { reasonCode: 'LANDMARK_DUPLICATE_BANNER', count: banners.length }
       }
-    };
+    });
   });
 
   return {

package/src/checks/manual/landmark-no-duplicate-contentinfo-manual.js

@@ -163,12 +163,7 @@ function runInPage(ctx) {
   }
 
   const occurrences = contentinfos.map((el) => {
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    return {
-      selector: stableSelector,
-      html,
+    return helpers.reportOccurrence(el, {
       summary: 'This page has more than one contentinfo landmark.',
       hint: 'Keep only one contentinfo landmark (footer/role="contentinfo") per page.',
       i18n: {
@@ -179,7 +174,7 @@ function runInPage(ctx) {
       data: {
         details: { reasonCode: 'LANDMARK_DUPLICATE_CONTENTINFO', count: contentinfos.length }
       }
-    };
+    });
   });
 
   return {

package/src/checks/manual/landmark-no-duplicate-main-manual.js

@@ -108,12 +108,7 @@ function runInPage(ctx) {
   }
 
   const occurrences = mains.map((el) => {
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
-
-    return {
-      selector: stableSelector,
-      html,
+    return helpers.reportOccurrence(el, {
       summary: 'This page has more than one main landmark.',
       hint: 'Keep only one main landmark (<main>/role="main") per page.',
       i18n: {
@@ -124,7 +119,7 @@ function runInPage(ctx) {
       data: {
         details: { reasonCode: 'LANDMARK_DUPLICATE_MAIN', count: mains.length }
       }
-    };
+    });
   });
 
   return {

package/src/checks/manual/landmark-one-main-manual.js

@@ -123,19 +123,12 @@ function runInPage(ctx) {
     return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
   }
 
-  const stableSelector = helpers.buildSelector ? helpers.buildSelector(body) : 'body';
-  const html = helpers.getOuterHtmlSnippet
-    ? helpers.getOuterHtmlSnippet(body)
-    : (body.outerHTML || '').slice(0, 200);
-
   return {
     ruleId: rule.ruleId,
     outcome: 'cantTell',
     severity: rule.defaultSeverity || 'minor',
     occurrences: [
-      {
-        selector: stableSelector,
-        html,
+      helpers.reportOccurrence(body, {
         summary: 'This page has no main landmark.',
         hint: 'Add a main landmark (<main> or role="main") around the page\'s primary content.',
         i18n: {
@@ -146,7 +139,7 @@ function runInPage(ctx) {
         data: {
           details: { reasonCode: 'LANDMARK_MAIN_MISSING' }
         }
-      }
+      })
     ]
   };
 }

package/src/checks/manual/landmark-unique-manual.js

@@ -219,34 +219,29 @@ function runInPage(ctx) {
       if (group.length <= 1) continue;
 
       for (const { el } of group) {
-        const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-        const html = helpers.getOuterHtmlSnippet
-          ? helpers.getOuterHtmlSnippet(el)
-          : el.outerHTML || '';
-
-        occurrences.push({
-          selector: stableSelector,
-          html,
-          summary: normalizedName
-            ? `This ${role} landmark shares its accessible name with another ${role} landmark.`
-            : `This ${role} landmark has no accessible name, and more than one unnamed ${role} landmark exists on this page.`,
-          hint: `Give each ${role} landmark a distinct name via aria-label or aria-labelledby.`,
-          i18n: {
-            summaryKey: normalizedName
-              ? 'landmarkUnique_summary_cantTell_duplicateName'
-              : 'landmarkUnique_summary_cantTell_bothUnnamed',
-            hintKey: 'landmarkUnique_hint_cantTell',
-            params: { role }
-          },
-          data: {
-            details: {
-              reasonCode: 'LANDMARK_NOT_UNIQUE',
-              role,
-              name: normalizedName,
-              groupSize: group.length
+        occurrences.push(
+          helpers.reportOccurrence(el, {
+            summary: normalizedName
+              ? `This ${role} landmark shares its accessible name with another ${role} landmark.`
+              : `This ${role} landmark has no accessible name, and more than one unnamed ${role} landmark exists on this page.`,
+            hint: `Give each ${role} landmark a distinct name via aria-label or aria-labelledby.`,
+            i18n: {
+              summaryKey: normalizedName
+                ? 'landmarkUnique_summary_cantTell_duplicateName'
+                : 'landmarkUnique_summary_cantTell_bothUnnamed',
+              hintKey: 'landmarkUnique_hint_cantTell',
+              params: { role }
+            },
+            data: {
+              details: {
+                reasonCode: 'LANDMARK_NOT_UNIQUE',
+                role,
+                name: normalizedName,
+                groupSize: group.length
+              }
             }
-          }
-        });
+          })
+        );
       }
     }
   }

package/src/checks/manual/link-name-quality-manual.js

@@ -133,27 +133,25 @@ function runInPage(ctx) {
 
     if (!GENERIC_LINK_TEXT.has(normalized)) continue;
 
-    const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
     const eligInfo = helpers.getEligibilityInfo
       ? helpers.getEligibilityInfo(el, ctx, { targetSet: 'acc' })
       : null;
 
-    occurrences.push({
-      selector: stableSelector,
-      html,
-      summary: `This link's accessible name ("${rawName.trim()}") is a generic, non-descriptive phrase.`,
-      hint: 'Make the link text itself describe its destination/purpose (e.g. "Download the 2026 pricing guide" instead of "Download"), or confirm the surrounding context already makes the purpose clear.',
-      i18n: {
-        summaryKey: 'linkNameQuality_summary_cantTell',
-        hintKey: 'linkNameQuality_hint_cantTell',
-        params: { name: rawName.trim() }
-      },
-      data: {
-        details: { reasonCode: 'GENERIC_LINK_TEXT', normalizedName: normalized },
-        visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: `This link's accessible name ("${rawName.trim()}") is a generic, non-descriptive phrase.`,
+        hint: 'Make the link text itself describe its destination/purpose (e.g. "Download the 2026 pricing guide" instead of "Download"), or confirm the surrounding context already makes the purpose clear.',
+        i18n: {
+          summaryKey: 'linkNameQuality_summary_cantTell',
+          hintKey: 'linkNameQuality_hint_cantTell',
+          params: { name: rawName.trim() }
+        },
+        data: {
+          details: { reasonCode: 'GENERIC_LINK_TEXT', normalizedName: normalized },
+          visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {

package/src/checks/manual/meta-viewport-large-manual.js

@@ -104,23 +104,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 zoom below the 500% best-practice target.',
-      hint: 'Remove user-scalable=no and raise maximum-scale to at least 5 (500%) if possible.',
-      i18n: {
-        summaryKey: 'metaViewportLarge_summary_cantTell',
-        hintKey: 'metaViewportLarge_hint_cantTell',
-        params: { reasons: reasons.join(', ') }
-      },
-      data: {
-        details: { reasonCode: 'VIEWPORT_ZOOM_BELOW_500', reasons }
-      }
-    });
+    occurrences.push(
+      helpers.reportOccurrence(el, {
+        summary: 'This viewport meta tag restricts zoom below the 500% best-practice target.',
+        hint: 'Remove user-scalable=no and raise maximum-scale to at least 5 (500%) if possible.',
+        i18n: {
+          summaryKey: 'metaViewportLarge_summary_cantTell',
+          hintKey: 'metaViewportLarge_hint_cantTell',
+          params: { reasons: reasons.join(', ') }
+        },
+        data: {
+          details: { reasonCode: 'VIEWPORT_ZOOM_BELOW_500', reasons }
+        }
+      })
+    );
   }
 
   if (applicableCount === 0) {