@surea11y/core 1.2.0 → 1.3.0

package/src/checks/manual/region-manual.js

@@ -6,8 +6,10 @@
  * @summary Page content should be contained within a landmark region
  * @standard Best Practices (a widely-used reference engine's classification; no formal WCAG Success Criterion — see ROADMAP.md Tier 1b)
  * @applicability
- *   Applies to direct children of <body> that carry visible text content
- *   and are not themselves a landmark.
+ *   Applies to any element under <body> that directly carries visible text
+ *   (or other own content — see @implementation-notes) and is not itself a
+ *   landmark, live region, dialog, button, <svg>, <iframe>/<frame>, or a
+ *   resolvable skip-link.
  * @expectation
  *   Every top-level piece of page content lives inside a landmark region
  *   (main, navigation, banner, contentinfo, complementary, region, form,
@@ -18,19 +20,62 @@
  *   `type: 'manual'` rule; see landmark-banner-is-top-level's
  *   header comment for the shared rationale/precedent and the landmark-
  *   detection model.
- * - Deliberately scoped to DIRECT children of <body> only (not a full
- *   recursive scan of every text node on the page) — a widely-used
- *   reference engine's own region rule is known to be noisy in practice when applied
- *   unconditionally; checking only the top level keeps false positives
- *   low while still catching the common case (a page section authored
- *   entirely outside any landmark).
+ * - Recursive tree walk, not a direct-<body>-children-only scan (that was
+ *   this check's original scope, replaced 2026-08-01). The direct-children
+ *   scope was originally chosen to keep this check quiet, but it turned out
+ *   to be nearly inert on the single most common real-world page shape: a
+ *   modern framework's single root mount div
+ *   (`<body><div id="root">...everything...</div></body>`, confirmed
+ *   present as the ONLY direct <body> child on 37 of ~90 pages in a
+ *   real-world corpus). On that shape, the old scan had at most one
+ *   candidate for the entire page and either missed every real gap inside
+ *   it or collapsed the whole page into one undifferentiated report.
+ * - Algorithm, using this engine's own (already more spec-correct in
+ *   places — see hasLandmarkScopingAncestor's header comment) helpers:
+ *     1. Depth-first walk from <body>'s children.
+ *     2. At each node: if it's ineligible for the accessibility tree
+ *        (helpers.isAccTreeEligible), OR is itself a "stopper" (landmark,
+ *        live region, dialog, button, <svg>, <iframe>/<frame>, or a
+ *        resolvable skip-link), mark it and every ancestor up to <body> as
+ *        "has a stopper" and don't recurse further into it (an <iframe>/
+ *        <frame> is additionally reported as its own occurrence — its
+ *        content is opaque to this engine, so from the outer page's
+ *        perspective it IS unplaced content).
+ *     3. Otherwise, if the node has OWN content (a direct child text node,
+ *        being an inherently visual element, or an aria-label) — checked
+ *        non-recursively, so a plain wrapper <div> with only nested
+ *        children never short-circuits the walk into its descendants —
+ *        collect it as a candidate and stop recursing into it.
+ *     4. Otherwise recurse into its element children.
+ *   Each collected candidate is then walked back UP through parents while
+ *   the parent has no "stopper" marker and isn't <body> itself, collapsing
+ *   contiguous unplaced content into one occurrence per real gap instead
+ *   of reporting every individual text-bearing leaf — this is what keeps
+ *   the walk from being noisy on ordinary pages that mix landmarked and
+ *   stray content, not the old direct-children-only restriction.
+ * - "Stopper" exemptions (button, dialog, <svg>, resolvable skip-links)
+ *   are a deliberate scope choice, not an oversight: these
+ *   are extremely common real-world patterns (floating action buttons,
+ *   modal dialogs, decorative/icon SVGs, "skip to content" links) that
+ *   aren't the kind of "content organization" gap this rule exists to
+ *   catch, and flagging them would reintroduce the false-positive noise
+ *   the original narrow scope was trying to avoid.
+ * - The "own content" check for aria-label deliberately does NOT resolve
+ *   aria-labelledby — a known, narrow scope gap (an element named only via aria-labelledby, with no
+ *   own text/aria-label, and no other content anywhere in its subtree,
+ *   could be silently skipped) accepted to avoid a full accessible-name
+ *   computation (recursive itself) inside an already-recursive structural
+ *   walk.
+ * - Bounded by a node-visit budget (see MAX_VISITED_NODES) as a defensive
+ *   guard against pathological pages, matching the existing pattern used
+ *   by getContentNameInfo's maxContentNodes in src/core/dom-helpers.js.
  */
 
 const id = 'region';
 
 const meta = {
   title: 'Page content should be inside a landmark region',
-  description: 'Checks that direct children of <body> with visible text content are contained within a landmark region.',
+  description: 'Checks that content under <body> is contained within a landmark region.',
   i18n: {
     titleKey: 'region_title',
     descriptionKey: 'region_description'
@@ -63,7 +108,13 @@ function runInPage(ctx) {
   }
 
   function normalizeWs(s) {
-    return String(s || '').replace(/\s+/g, ' ').trim();
+    return String(s || '')
+      .replace(/\s+/g, ' ')
+      .trim();
+  }
+
+  function lower(s) {
+    return String(s || '').toLowerCase();
   }
 
   // Delegates to the shared helpers.getLandmarkNameInfo (aria-label -> aria-labelledby, via the
@@ -84,7 +135,7 @@ function runInPage(ctx) {
   function getExplicitRoleToken(el) {
     const raw = normalizeWs(el.getAttribute && el.getAttribute('role'));
     if (!raw) return '';
-    return raw.split(/\s+/)[0].toLowerCase();
+    return lower(raw.split(/\s+/)[0]);
   }
 
   // Delegates to the shared helpers.hasLandmarkScopingAncestor for the
@@ -104,7 +155,7 @@ function runInPage(ctx) {
   }
 
   function getImplicitLandmarkRole(el) {
-    const tag = el.tagName ? el.tagName.toLowerCase() : '';
+    const tag = el.tagName ? lower(el.tagName) : '';
     if (tag === 'header') return hasSectioningAncestor(el, true) ? '' : 'banner';
     if (tag === 'footer') return hasSectioningAncestor(el, true) ? '' : 'contentinfo';
     if (tag === 'main') return 'main';
@@ -123,7 +174,16 @@ function runInPage(ctx) {
     return '';
   }
 
-  const LANDMARK_ROLES = new Set(['banner', 'contentinfo', 'main', 'navigation', 'complementary', 'region', 'form', 'search']);
+  const LANDMARK_ROLES = new Set([
+    'banner',
+    'contentinfo',
+    'main',
+    'navigation',
+    'complementary',
+    'region',
+    'form',
+    'search'
+  ]);
 
   function isLandmark(el) {
     if (!el || !el.getAttribute) return false;
@@ -134,48 +194,179 @@ function runInPage(ctx) {
 
   const SKIP_TAGS = new Set(['script', 'style', 'template', 'noscript', 'link', 'meta', 'title']);
 
-  function isIneligible(el) {
-    if (el.getAttribute && el.getAttribute('aria-hidden') === 'true') return true;
-    if (el.hasAttribute && el.hasAttribute('hidden')) return true;
+  // Roles/attributes that make an element its own self-contained
+  // announced area — not literally a WAI-ARIA landmark, but not "content
+  // that needs a landmark" either. Same live-region role list a widely-used
+  // reference engine's own region rule stops recursion at.
+  const LIVE_REGION_ROLES = new Set(['alert', 'status', 'log', 'marquee', 'timer']);
+
+  function isAriaLive(el) {
+    const v = lower(normalizeWs(el.getAttribute && el.getAttribute('aria-live')));
+    return v === 'polite' || v === 'assertive';
+  }
+
+  function isDialogLike(el) {
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (tag === 'dialog') return true;
+    const role = getExplicitRoleToken(el);
+    return role === 'dialog' || role === 'alertdialog';
+  }
+
+  function isButtonLike(el) {
+    const role = getExplicitRoleToken(el);
+    if (role) return role === 'button';
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (tag === 'button' || tag === 'summary') return true;
+    if (tag === 'input') {
+      const type = lower(normalizeWs(el.getAttribute && el.getAttribute('type')));
+      return type === 'button' || type === 'submit' || type === 'reset' || type === 'image';
+    }
     return false;
   }
 
-  function getConservativeSubtreeText(container) {
-    const SHOW_TEXT = 4;
+  // A "skip to content" link is deliberately placed outside the main
+  // content flow at the very top of the page — exempting it (when its
+  // fragment actually resolves to a real target, not a dead "#"
+  // placeholder) avoids flagging a helpful, common accessibility pattern
+  // as the very thing this rule is meant to catch.
+  function isResolvableSkipLink(el) {
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (tag !== 'a') return false;
+    const href = el.getAttribute && el.getAttribute('href');
+    if (!href || href.charAt(0) !== '#' || href.length < 2) return false;
     try {
-      const walker = document.createTreeWalker(container, SHOW_TEXT, null);
-      const parts = [];
-      let n = walker.nextNode();
-      while (n) {
-        const raw = normalizeWs(n.nodeValue || '');
-        if (raw) parts.push(raw);
-        n = walker.nextNode();
-      }
-      return normalizeWs(parts.join(' '));
+      return !!(document.getElementById && document.getElementById(href.slice(1)));
     } catch {
-      return normalizeWs(container.textContent);
+      return false;
     }
   }
 
-  const occurrences = [];
-  let applicableCount = 0;
+  function isStopper(el) {
+    if (isLandmark(el)) return true;
+    if (isAriaLive(el)) return true;
+    const role = getExplicitRoleToken(el);
+    if (role && LIVE_REGION_ROLES.has(role)) return true;
+    if (isDialogLike(el)) return true;
+    if (isButtonLike(el)) return true;
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (tag === 'svg' || tag === 'iframe' || tag === 'frame') return true;
+    if (isResolvableSkipLink(el)) return true;
+    return false;
+  }
+
+  const VISUAL_CONTENT_TAGS = new Set(['img', 'video', 'audio', 'canvas', 'object', 'embed']);
 
-  for (const el of body.children || []) {
-    if (!el || !el.tagName) continue;
-    const tag = el.tagName.toLowerCase();
-    if (SKIP_TAGS.has(tag)) continue;
-    if (isIneligible(el)) continue;
-    if (isLandmark(el)) continue;
+  // Non-recursive "does THIS element, on its own, carry content" check —
+  // deliberately mirrors only the direct-content half of getContentNameInfo/
+  // a widely-used reference engine's own has-content check, not a full
+  // name-from-content recursion: the whole point is to keep recursing
+  // through plain wrapper elements (a framework's root mount <div> included)
+  // until reaching the actual content-bearing node, rather than a coarse
+  // ancestor swallowing everything beneath it into one report.
+  function hasOwnContent(el) {
+    const kids = el.childNodes || [];
+    for (let i = 0; i < kids.length; i++) {
+      const k = kids[i];
+      if (k.nodeType === 3 && normalizeWs(k.nodeValue)) return true;
+    }
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (VISUAL_CONTENT_TAGS.has(tag)) return true;
+    if (
+      tag === 'input' &&
+      lower(normalizeWs(el.getAttribute && el.getAttribute('type'))) !== 'hidden'
+    )
+      return true;
+    if (normalizeWs(el.getAttribute && el.getAttribute('aria-label'))) return true;
+    return false;
+  }
 
-    const text = getConservativeSubtreeText(el);
-    if (!text) continue;
+  // Defensive guard against pathological pages (mirrors the maxContentNodes
+  // pattern in src/core/dom-helpers.js's getContentNameInfo) -- a full-body
+  // structural walk visits more nodes than a single element's name
+  // computation, hence the larger budget.
+  const MAX_VISITED_NODES = 20000;
+  let visited = 0;
+  let truncated = false;
 
-    applicableCount += 1;
+  const leaves = [];
+  const stopperFlagged = new WeakSet();
 
+  function markFlaggedUpToBody(el) {
+    let cur = el;
+    while (cur) {
+      if (stopperFlagged.has(cur)) break; // everything above is already marked
+      stopperFlagged.add(cur);
+      if (cur === body) break;
+      cur = cur.parentElement;
+    }
+  }
+
+  function walk(el) {
+    if (truncated || !el || el.nodeType !== 1) return;
+    visited += 1;
+    if (visited > MAX_VISITED_NODES) {
+      truncated = true;
+      return;
+    }
+
+    const tag = el.tagName ? lower(el.tagName) : '';
+    if (SKIP_TAGS.has(tag)) return;
+
+    const eligRes = helpers.isAccTreeEligible ? helpers.isAccTreeEligible(el) : { eligible: true };
+    if (!(eligRes && eligRes.eligible)) {
+      markFlaggedUpToBody(el);
+      return;
+    }
+
+    if (isStopper(el)) {
+      markFlaggedUpToBody(el);
+      if (tag === 'iframe' || tag === 'frame') leaves.push(el);
+      return;
+    }
+
+    if (hasOwnContent(el)) {
+      leaves.push(el);
+      return;
+    }
+
+    const kids = el.children || [];
+    for (let i = 0; i < kids.length; i++) {
+      walk(kids[i]);
+      if (truncated) return;
+    }
+  }
+
+  for (const child of body.children || []) walk(child);
+
+  // Collapse each candidate leaf upward through parents that have no OTHER
+  // stopper anywhere in their subtree, so contiguous unplaced content
+  // merges into ONE occurrence per real gap instead of one per text node --
+  // this collapsing, not the old direct-children-only scope, is what keeps
+  // ordinary pages (landmarked content mixed with a little stray content)
+  // from producing noisy, one-per-leaf reports.
+  const collapsed = [];
+  const seen = new Set();
+  for (const leaf of leaves) {
+    let cur = leaf;
+    while (
+      cur.parentElement &&
+      cur.parentElement !== body &&
+      !stopperFlagged.has(cur.parentElement)
+    ) {
+      cur = cur.parentElement;
+    }
+    if (!seen.has(cur)) {
+      seen.add(cur);
+      collapsed.push(cur);
+    }
+  }
+
+  const occurrences = collapsed.map((el) => {
+    const tag = el.tagName ? lower(el.tagName) : '';
     const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : (el.outerHTML || '');
+    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
-    occurrences.push({
+    return {
       selector: stableSelector,
       html,
       summary: 'This content is not contained within a landmark region.',
@@ -188,16 +379,18 @@ function runInPage(ctx) {
       data: {
         details: { reasonCode: 'CONTENT_OUTSIDE_LANDMARK', element: tag }
       }
-    });
-  }
+    };
+  });
 
-  if (applicableCount === 0) {
+  if (occurrences.length === 0) {
     return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
   }
-  if (occurrences.length) {
-    return { ruleId: rule.ruleId, outcome: 'cantTell', severity: rule.defaultSeverity || 'minor', occurrences };
-  }
-  return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
+  return {
+    ruleId: rule.ruleId,
+    outcome: 'cantTell',
+    severity: rule.defaultSeverity || 'minor',
+    occurrences
+  };
 }
 
 module.exports = { id, meta, runInPage, applicability };

package/src/checks/manual/scope-attr-valid-manual.js

@@ -43,7 +43,9 @@ function runInPage(ctx) {
 
   const VALID_SCOPES = new Set(['row', 'col', 'rowgroup', 'colgroup']);
 
-  const nodes = helpers.queryAllSmart ? helpers.queryAllSmart('[scope]') : helpers.queryAll('[scope]');
+  const nodes = helpers.queryAllSmart
+    ? helpers.queryAllSmart('[scope]')
+    : helpers.queryAll('[scope]');
 
   const occurrences = [];
   let applicableCount = 0;
@@ -58,7 +60,7 @@ function runInPage(ctx) {
     if (VALID_SCOPES.has(raw.toLowerCase())) continue;
 
     const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : (el.outerHTML || '');
+    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
     occurrences.push({
       selector: stableSelector,
@@ -80,7 +82,12 @@ function runInPage(ctx) {
     return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
   }
   if (occurrences.length) {
-    return { ruleId: rule.ruleId, outcome: 'cantTell', severity: rule.defaultSeverity || 'minor', occurrences };
+    return {
+      ruleId: rule.ruleId,
+      outcome: 'cantTell',
+      severity: rule.defaultSeverity || 'minor',
+      occurrences
+    };
   }
   return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
 }

package/src/checks/manual/scrollable-region-focusable-manual.js

@@ -48,8 +48,20 @@ const meta = {
   tags: ['wcag2a', 'wcag2aaa', 'wcag211', 'wcag213', 'structure', 'atomic', 'manual'],
   wcagSc: ['2.1.1', '2.1.3'],
   normativeMappings: [
-    { standard: 'WCAG', version: '2.2', requirement: '2.1.1', title: 'Keyboard', conformanceLevel: 'A' },
-    { standard: 'WCAG', version: '2.2', requirement: '2.1.3', title: 'Keyboard (No Exception)', conformanceLevel: 'AAA' }
+    {
+      standard: 'WCAG',
+      version: '2.2',
+      requirement: '2.1.1',
+      title: 'Keyboard',
+      conformanceLevel: 'A'
+    },
+    {
+      standard: 'WCAG',
+      version: '2.2',
+      requirement: '2.1.3',
+      title: 'Keyboard (No Exception)',
+      conformanceLevel: 'AAA'
+    }
   ],
   defaultSeverity: 'moderate',
   category: 'operable',
@@ -64,7 +76,7 @@ const meta = {
 };
 
 function runInPage(ctx) {
-  const { document, helpers, rule } = ctx;
+  const { helpers, rule } = ctx;
 
   function safeComputedStyle(el) {
     try {
@@ -73,7 +85,8 @@ function runInPage(ctx) {
         const cs = helpers.computedStyle(el);
         if (cs) return cs;
       }
-      const view = (el.ownerDocument && el.ownerDocument.defaultView) ? el.ownerDocument.defaultView : null;
+      const view =
+        el.ownerDocument && el.ownerDocument.defaultView ? el.ownerDocument.defaultView : null;
       if (view && typeof view.getComputedStyle === 'function') return view.getComputedStyle(el);
     } catch {}
     return null;
@@ -81,8 +94,12 @@ function runInPage(ctx) {
 
   function isScrollableOverflow(cs) {
     if (!cs) return false;
-    const x = String(cs.overflowX || '').trim().toLowerCase();
-    const y = String(cs.overflowY || '').trim().toLowerCase();
+    const x = String(cs.overflowX || '')
+      .trim()
+      .toLowerCase();
+    const y = String(cs.overflowY || '')
+      .trim()
+      .toLowerCase();
     return x === 'auto' || x === 'scroll' || y === 'auto' || y === 'scroll';
   }
 
@@ -108,8 +125,11 @@ function runInPage(ctx) {
     }
   }
 
-  const CANDIDATE_SELECTOR = 'div, section, article, aside, main, nav, pre, table, blockquote, ul, ol, textarea';
-  const nodes = helpers.queryAllSmart ? helpers.queryAllSmart(CANDIDATE_SELECTOR) : helpers.queryAll(CANDIDATE_SELECTOR);
+  const CANDIDATE_SELECTOR =
+    'div, section, article, aside, main, nav, pre, table, blockquote, ul, ol, textarea';
+  const nodes = helpers.queryAllSmart
+    ? helpers.queryAllSmart(CANDIDATE_SELECTOR)
+    : helpers.queryAll(CANDIDATE_SELECTOR);
 
   const occurrences = [];
   let applicableCount = 0;
@@ -127,12 +147,13 @@ function runInPage(ctx) {
 
     const tag = (el.tagName || '').toLowerCase();
     const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : (el.outerHTML || '');
+    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
     const baseOccurrence = {
       selector: stableSelector,
       html,
-      summary: 'This element declares overflow:auto/scroll, has no focusable descendant, and is not itself keyboard-focusable.',
+      summary:
+        'This element declares overflow:auto/scroll, has no focusable descendant, and is not itself keyboard-focusable.',
       hint: 'If this region’s content actually overflows, add tabindex="0" (and a suitable label) so keyboard users can focus it and scroll with the arrow keys.',
       i18n: {
         summaryKey: 'scrollableRegionFocusable_summary_cantTell',
@@ -156,7 +177,12 @@ function runInPage(ctx) {
   }
 
   if (occurrences.length) {
-    return { ruleId: rule.ruleId, outcome: 'cantTell', severity: rule.defaultSeverity || 'moderate', occurrences };
+    return {
+      ruleId: rule.ruleId,
+      outcome: 'cantTell',
+      severity: rule.defaultSeverity || 'moderate',
+      occurrences
+    };
   }
 
   // Manual rules may only emit cantTell/notApplicable (never pass/fail):

package/src/checks/manual/skip-link-manual.js

@@ -37,7 +37,8 @@ const id = 'skip-link';
 
 const meta = {
   title: 'Skip link must have a resolvable, usable target',
-  description: 'Checks that a "skip to ..." link\'s href fragment resolves to a real, currently usable element in the document.',
+  description:
+    'Checks that a "skip to ..." link\'s href fragment resolves to a real, currently usable element in the document.',
   i18n: {
     titleKey: 'skipLink_title',
     descriptionKey: 'skipLink_description'
@@ -57,7 +58,9 @@ function runInPage(ctx) {
   const { document, helpers, rule } = ctx;
 
   function normalizeWs(s) {
-    return String(s || '').replace(/\s+/g, ' ').trim();
+    return String(s || '')
+      .replace(/\s+/g, ' ')
+      .trim();
   }
 
   function getAccessibleNameText(el) {
@@ -105,7 +108,9 @@ function runInPage(ctx) {
 
   const geometrySupported = hasReliableGeometrySupport();
 
-  const nodes = helpers.queryAllSmart ? helpers.queryAllSmart('a[href]') : helpers.queryAll('a[href]');
+  const nodes = helpers.queryAllSmart
+    ? helpers.queryAllSmart('a[href]')
+    : helpers.queryAll('a[href]');
 
   const occurrences = [];
   let applicableCount = 0;
@@ -147,18 +152,29 @@ function runInPage(ctx) {
       const accEligibility = toEligibility(
         helpers.getEligibilityInfo
           ? helpers.getEligibilityInfo(target, ctx, { targetSet: 'acc' })
-          : (helpers.isAccTreeEligible ? helpers.isAccTreeEligible(target, ctx) : { eligible: true, reasons: [] })
+          : helpers.isAccTreeEligible
+            ? helpers.isAccTreeEligible(target, ctx)
+            : { eligible: true, reasons: [] }
       );
 
       let geometryEligibility = null;
       let geometryReasonCode = null;
       if (geometrySupported && helpers.isDomVisibleEligible) {
         geometryEligibility = toEligibility(
-          helpers.isDomVisibleEligible(target, ctx, { visibilityMode: 'styleAndGeometry', ignoreOpacity: true })
+          helpers.isDomVisibleEligible(target, ctx, {
+            visibilityMode: 'styleAndGeometry',
+            ignoreOpacity: true
+          })
         );
-        if (!geometryEligibility.eligible && geometryEligibility.reasons.includes('noClientRects')) {
+        if (
+          !geometryEligibility.eligible &&
+          geometryEligibility.reasons.includes('noClientRects')
+        ) {
           geometryReasonCode = 'NO_CLIENT_RECTS';
-        } else if (!geometryEligibility.eligible && geometryEligibility.reasons.includes('zeroArea')) {
+        } else if (
+          !geometryEligibility.eligible &&
+          geometryEligibility.reasons.includes('zeroArea')
+        ) {
           geometryReasonCode = 'ZERO_AREA_TARGET';
         }
       }
@@ -168,7 +184,9 @@ function runInPage(ctx) {
       if (!unusableByAcc && !unusableByGeometry) continue;
 
       const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-      const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : (el.outerHTML || '');
+      const html = helpers.getOuterHtmlSnippet
+        ? helpers.getOuterHtmlSnippet(el)
+        : el.outerHTML || '';
 
       occurrences.push({
         selector: stableSelector,
@@ -202,13 +220,13 @@ function runInPage(ctx) {
     }
 
     const stableSelector = helpers.buildSelector ? helpers.buildSelector(el) : 'html';
-    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : (el.outerHTML || '');
+    const html = helpers.getOuterHtmlSnippet ? helpers.getOuterHtmlSnippet(el) : el.outerHTML || '';
 
     occurrences.push({
       selector: stableSelector,
       html,
-      summary: 'This skip link\'s target does not exist.',
-      hint: 'Point the skip link\'s href at an id that exists in the document, or add the missing target element.',
+      summary: "This skip link's target does not exist.",
+      hint: "Point the skip link's href at an id that exists in the document, or add the missing target element.",
       i18n: {
         summaryKey: 'skipLink_summary_cantTell',
         hintKey: 'skipLink_hint_cantTell',
@@ -224,7 +242,12 @@ function runInPage(ctx) {
     return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
   }
   if (occurrences.length) {
-    return { ruleId: rule.ruleId, outcome: 'cantTell', severity: rule.defaultSeverity || 'minor', occurrences };
+    return {
+      ruleId: rule.ruleId,
+      outcome: 'cantTell',
+      severity: rule.defaultSeverity || 'minor',
+      occurrences
+    };
   }
   return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
 }