@surea11y/core 1.0.0

package/src/checks/automatic/role-img-alt-present.js

@@ -0,0 +1,206 @@
+'use strict';
+
+/**
+ * @check role-img-text-alternative-present
+ * @atomic true
+ * @summary Accessible elements with role="img" must have an alternative text via aria-label or aria-labelledby
+ * @standard WCAG 2.2
+ * @sc 1.1.1
+ * @applicability
+ *   Applies to elements with role="img" that are exposed to assistive technologies.
+ *   Elements otherwise hidden from the accessibility tree remain applicable
+ *   if they are focusable or referenced by IDREF relationships (per engine eligibility checks).
+ * @expectation
+ *   Each applicable element with role="img" has an accessible text alternative:
+ *    - aria-label with a non-empty value; OR
+ *    - aria-labelledby referencing at least one existing element that contributes non-empty text; OR
+ *    - a non-empty title attribute (last-resort accessible-name source per HTML-AAM,
+ *      also accepted by a widely-used reference engine's equivalent role-img-alt rule).
+ */
+
+const id = 'role-img-text-alternative-present';
+
+const meta = {
+    title: '[role="img"] must have an accessible text alternative',
+    description:
+        'Checks that elements with role="img" provide an accessible text alternative via aria-label, aria-labelledby, or a title attribute.',
+    i18n: {
+        titleKey: 'roleImg_textAlternativePresent_title',
+        descriptionKey: 'roleImg_textAlternativePresent_description'
+    },
+    helpUrl: null,
+    tags: ['wcag2a', 'wcag111', 'nontext', 'images', 'aria', 'atomic', 'automatic'],
+    wcagSc: ['1.1.1'],
+    normativeMappings: [
+        { standard: 'WCAG', version: '2.2', requirement: '1.1.1', title: 'Non-text Content', conformanceLevel: 'A' }
+    ],
+    defaultSeverity: 'serious',
+    category: 'perceivable',
+    type: 'automatic',
+    defaultConfidence: 'high',
+    coverage: {
+        facetsBySc: {
+            '1.1.1': ['role-img-text-alternative-present']
+        }
+    }
+};
+
+function runInPage(ctx) {
+    const { root, helpers, rule } = ctx;
+    const safeRoot = root || document;
+
+    const queryAllSmart = helpers && typeof helpers.queryAllSmart === 'function' ? helpers.queryAllSmart : null;
+    const queryAll = helpers && typeof helpers.queryAll === 'function'
+        ? helpers.queryAll
+        : (sel) => {
+            try { return safeRoot && safeRoot.querySelectorAll ? Array.from(safeRoot.querySelectorAll(sel)) : []; }
+            catch { return []; }
+        };
+
+    const getEligibilityInfo = helpers && typeof helpers.getEligibilityInfo === 'function'
+        ? helpers.getEligibilityInfo
+        : null;
+
+    const trim = (v) => {
+        try { return String(v == null ? '' : v).replace(/\s+/g, ' ').trim(); }
+        catch { return ''; }
+    };
+
+    const imgElements = (() => {
+        // do not consider element "img" because it has its own rule
+        const sel = '[role="img" i]:not(img)';
+        try { return Array.from((queryAllSmart ? queryAllSmart(sel) : queryAll(sel)) || []); }
+        catch { return queryAll(sel); }
+    })();
+
+    if (!imgElements.length) {
+        return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
+    }
+
+    const occurrences = [];
+    let applicableCount = 0;
+
+    const isAccTreeEligible = helpers && typeof helpers.isAccTreeEligible === 'function'
+        ? helpers.isAccTreeEligible
+        : null;
+
+    const getAccessibleNameInfo = helpers && typeof helpers.getAccessibleNameInfo === 'function'
+        ? helpers.getAccessibleNameInfo
+        : null;
+
+    for (const el of imgElements) {
+        if (!el || !el.getAttribute) continue;
+
+        // Applicability: eligible in the acc tree (with helper exceptions).
+        if (isAccTreeEligible) {
+            const elig = (() => {
+                try { return isAccTreeEligible(el, ctx); } catch { return { eligible: true, reasons: [] }; }
+            })();
+            if (elig && elig.eligible === false) continue;
+        }
+
+        applicableCount += 1;
+
+        // Expectation: aria-label OR aria-labelledby. We use helper name-info when available,
+        // but we also validate the source to keep this rule scoped/deterministic.
+
+        const ariaLabelRaw = (() => { try { return el.getAttribute('aria-label'); } catch { return null; } })();
+        const ariaLabel = trim(ariaLabelRaw);
+
+        const ariaLabelledbyRaw = (() => { try { return el.getAttribute('aria-labelledby'); } catch { return null; } })();
+        const ariaLabelledby = trim(ariaLabelledbyRaw);
+
+        const hasAriaLabelAttr = ariaLabelRaw !== null;
+        const hasAriaLabelledbyAttr = ariaLabelledbyRaw !== null;
+
+        const hasValidAriaLabel = hasAriaLabelAttr && ariaLabel.length > 0;
+        const hasValidAriaLabelledbyAttr = hasAriaLabelledbyAttr && ariaLabelledby.length > 0;
+
+        // Last-resort naming mechanism per HTML-AAM (also accepted by
+        // a widely-used reference engine's role-img-alt): a non-empty title attribute.
+        const titleRaw = (() => { try { return el.getAttribute('title'); } catch { return null; } })();
+        const hasValidTitle = titleRaw !== null && trim(titleRaw).length > 0;
+
+        let nameInfo = null;
+
+        // Fast outcomes first (no helper needed)
+        let reasonCode = '';
+        let hasName = false;
+
+        if (!hasAriaLabelAttr && !hasAriaLabelledbyAttr) {
+            if (hasValidTitle) {
+                hasName = true;
+            } else {
+                reasonCode = 'missingTextAlternative';
+            }
+        } else if (hasAriaLabelAttr && !hasValidAriaLabel) {
+            if (hasValidTitle) {
+                hasName = true;
+            } else {
+                reasonCode = 'emptyAriaLabel';
+            }
+        } else if (hasAriaLabelledbyAttr && !hasValidAriaLabelledbyAttr) {
+            if (hasValidTitle) {
+                hasName = true;
+            } else {
+                reasonCode = 'emptyAriaLabelledby';
+            }
+        } else {
+            // Mechanism present + non-empty. Optionally validate resolution via helper.
+            if (getAccessibleNameInfo) {
+                nameInfo = (() => { try { return getAccessibleNameInfo(el, ctx); } catch { return null; } })();
+                const helperSaysHasName = !!(nameInfo && nameInfo.present && trim(nameInfo.value));
+                if (helperSaysHasName) {
+                    hasName = true;
+                } else {
+                    reasonCode = 'nameNotResolved';
+                }
+            } else {
+                // Without helper, accept non-empty aria-label/labelledby as sufficient.
+                hasName = true;
+            }
+        }
+
+        if (hasName) continue;
+
+
+        const eligInfo = getEligibilityInfo ? getEligibilityInfo(el, ctx, { targetSet: 'acc' }) : null;
+
+        const baseOccurrence = {
+            summary: 'Missing text alternative on element with role="img".',
+            hint: 'Provide aria-label or aria-labelledby (referencing non-empty text) to give this image a text alternative.',
+            i18n: {
+                summaryKey: 'roleImg_textAlternativePresent_summary_fail',
+                hintKey: 'roleImg_textAlternativePresent_hint_fail',
+                params: { role: 'img' }
+            },
+            data: {
+                details: {
+                    reasonCode,
+                    ariaLabel: ariaLabelRaw === null ? null : ariaLabel,
+                    ariaLabelledby: ariaLabelledbyRaw === null ? null : ariaLabelledby,
+                    accessibleNameInfo: nameInfo || null
+                },
+                visibilityFilter: eligInfo || { targetSet: 'acc', accEligible: null, reasons: [] }
+            }
+        };
+
+        if (helpers && typeof helpers.reportOccurrence === 'function') {
+            occurrences.push(helpers.reportOccurrence(el, baseOccurrence));
+        } else {
+            occurrences.push({ selector: '', html: '', ...baseOccurrence });
+        }
+    }
+
+    if (applicableCount === 0) {
+        return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
+    }
+
+    if (!occurrences.length) {
+        return { ruleId: rule.ruleId, outcome: 'pass', severity: 'minor', occurrences: [] };
+    }
+
+    return { ruleId: rule.ruleId, outcome: 'fail', severity: rule.defaultSeverity || 'minor', occurrences };
+}
+
+module.exports = { id, meta, runInPage };

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

@@ -0,0 +1,236 @@
+'use strict';
+
+const id = 'searchbox-name-present';
+
+const meta = {
+  title: 'Accessible name is present',
+  description: 'Checks that elements expose a non-empty accessible name.',
+  i18n: {
+    titleKey: 'searchboxNamePresent_title',
+    descriptionKey: 'searchboxNamePresent_description'
+  },
+  helpUrl: null,
+  tags: ["wcag2a", "wcag412", "forms", "atomic", "automatic", "name", "searchbox"],
+  wcagSc: ['4.1.2'],
+  normativeMappings: [
+    { standard: 'WCAG', version: '2.2', requirement: '4.1.2', title: 'Name, Role, Value', conformanceLevel: 'A' }
+  ],
+  defaultSeverity: 'serious',
+  category: 'robust',
+  type: 'automatic',
+  defaultConfidence: 'high',
+  coverage: { facetsBySc: { '4.1.2': ['searchbox-name-present'] } }
+};
+
+function runInPage(ctx) {
+  const { document, root, helpers, rule } = ctx;
+  const getEligibilityInfo = helpers && typeof helpers.getEligibilityInfo === 'function'
+      ? helpers.getEligibilityInfo
+      : null;
+  const safeRoot = root || document;
+
+
+  function normalizeWs(s) {
+    return String(s || '').replace(/\s+/g, ' ').trim();
+  }
+
+  function getAttr(el, name) {
+    try {
+      if (!el || !el.getAttribute) return '';
+      return normalizeWs(el.getAttribute(name));
+    } catch { return ''; }
+  }
+
+  function getConservativeSubtreeText(document, container) {
+    // "Name from content" — recurses into descendants and uses each one's
+    // own accessible name (img alt, aria-label/aria-labelledby, title) when
+    // it has one, not just literal text nodes. See getContentNameInfo's
+    // header comment in src/core/dom-helpers.js for the full rationale
+    // (this replaced a text-node-only TreeWalker that missed the common
+    // "<a><img alt='...'></a>" logo-link / "<button><img alt='...'></button>"
+    // icon-button pattern).
+    if (helpers.getContentNameInfo) {
+      const info = helpers.getContentNameInfo(container, ctx);
+      return info && info.present ? info.value : '';
+    }
+    const t = (container && container.textContent) ? String(container.textContent) : '';
+    return t.replace(/\s+/g, ' ').trim();
+  }
+
+  // A <label> contributes a name via its own aria-label/aria-labelledby
+  // (checked first, same ARIA-over-content precedence any element's
+  // accessible name gives — e.g. <label aria-label="Search"><svg
+  // aria-hidden="true">...</svg></label> names its control "Search" even
+  // though the label's only child content is aria-hidden) or, failing
+  // that, its rendered content (getConservativeSubtreeText).
+  function getLabelText(lab) {
+    if (helpers.getAriaNameInfo) {
+      try {
+        const aria = helpers.getAriaNameInfo(lab, ctx);
+        if (aria && aria.present && aria.value) return normalizeWs(aria.value);
+      } catch {}
+    }
+    const content = getConservativeSubtreeText(document, lab);
+    if (content) return content;
+    // Final fallback per the general accname text-alternative algorithm,
+    // which applies to any element being asked for its name regardless of
+    // why (own aria-label, an aria-labelledby reference, or — here — native
+    // <label for> association): title, when nothing else yields a name.
+    // Purely additive (only fills in a name where there was none before),
+    // so it carries no false-positive risk — see dialog-name-present.js's
+    // identical <iframe>-title-fallback fix for the concrete real-world
+    // trigger this same accname step covers elsewhere.
+    return getAttr(lab, 'title');
+  }
+
+  function resolveAriaLabelledbyText(document, el, maxRefs) {
+    const raw = getAttr(el, 'aria-labelledby');
+    if (!raw) return '';
+    // Delegates to the shared getTextFromIdRefs helper instead of computing
+    // name-from-content of the referenced element — see dialog-name-
+    // present.js's identical fix for the full rationale (an <iframe>
+    // aria-labelledby target's only name source is its title attribute,
+    // which name-from-content alone can never see).
+    if (helpers.getTextFromIdRefs) {
+      try {
+        const r = helpers.getTextFromIdRefs(raw, ctx, { maxRefs: maxRefs || 8 });
+        return normalizeWs(r && r.text);
+      } catch {}
+    }
+    return '';
+  }
+
+  function isEligibleAcc(helpers, el, ctx) {
+    const fn = helpers && typeof helpers.isAccTreeEligible === 'function' ? helpers.isAccTreeEligible : null;
+    if (!fn) return true;
+    try {
+      const r = fn(el, ctx);
+      if (typeof r === 'boolean') return r;
+      return !!(r && r.eligible);
+    } catch {
+      return true;
+    }
+  }
+
+  function buildLabelForMap(doc) {
+    const map = new Map(); // id -> label element (first)
+    try {
+      const labels = doc && doc.getElementsByTagName ? doc.getElementsByTagName('label') : [];
+      for (let i = 0; i < labels.length; i += 1) {
+        const lab = labels[i];
+        if (!lab || !lab.getAttribute) continue;
+        const f = normalizeWs(lab.getAttribute('for'));
+        if (!f) continue;
+        if (!map.has(f)) map.set(f, lab);
+      }
+    } catch {}
+    return map;
+  }
+
+
+  const occurrences = [];
+  let applicableCount = 0;
+
+  const selector = "[role=\"searchbox\"]";
+  const nodes = helpers.queryAllSmart ? helpers.queryAllSmart(selector, safeRoot) : helpers.queryAll(selector, safeRoot);
+
+  // Precompute label[for] map for searchbox elements that are labelable
+  // native form controls (e.g. <input role="searchbox">).
+  const labelForMap = buildLabelForMap(document);
+
+  function getNativeLabelText(el) {
+    try {
+      if ('labels' in el && el.labels && el.labels.length) {
+        const parts = [];
+        const max = Math.min(4, el.labels.length);
+        for (let i = 0; i < max; i += 1) {
+          const lab = el.labels[i];
+          const t = lab ? getLabelText(lab) : '';
+          if (t) parts.push(t);
+        }
+        const joined = normalizeWs(parts.join(' '));
+        if (joined) return joined;
+      }
+    } catch {}
+    try {
+      if (el.closest) {
+        const wrap = el.closest('label');
+        if (wrap) {
+          const t = getLabelText(wrap);
+          if (t) return t;
+        }
+      }
+    } catch {}
+    try {
+      const idAttr = getAttr(el, 'id');
+      if (idAttr && labelForMap.has(idAttr)) {
+        const lab = labelForMap.get(idAttr);
+        const t = lab ? getLabelText(lab) : '';
+        if (t) return t;
+      }
+    } catch {}
+    return '';
+  }
+
+  function hasName(el) {
+    const ariaLabel = getAttr(el, 'aria-label');
+    if (ariaLabel) return { ok: true, method: 'aria-label' };
+
+    const labelled = resolveAriaLabelledbyText(document, el, 8);
+    if (labelled) return { ok: true, method: 'aria-labelledby' };
+
+    const title = getAttr(el, 'title');
+    if (title) return { ok: true, method: 'title' };
+
+    // Native <label> association (e.g. <input role="searchbox">).
+    const lab = getNativeLabelText(el);
+    if (lab) return { ok: true, method: 'label' };
+
+    // role="searchbox" is name-from-author-only per WAI-ARIA: it must NOT
+    // fall back to subtree content.
+    return { ok: false, method: 'none' };
+  }
+
+  for (const el of nodes) {
+    if (!el) continue;
+    if (!isEligibleAcc(helpers, el, ctx)) continue;
+
+    applicableCount += 1;
+
+    const res = hasName(el);
+    if (res.ok) continue;
+
+    const eligInfo = getEligibilityInfo
+        ? (() => { try { return getEligibilityInfo(el, ctx, { targetSet: 'acc' }); } catch { return null; } })()
+        : 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: '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) {
+    return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
+  }
+  if (occurrences.length) {
+    return { ruleId: rule.ruleId, outcome: 'fail', severity: rule.defaultSeverity || 'minor', occurrences };
+  }
+  return { ruleId: rule.ruleId, outcome: 'pass', severity: 'minor', occurrences: [] };
+}
+
+module.exports = { id, meta, runInPage };

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

@@ -0,0 +1,88 @@
+'use strict';
+
+/**
+ * @check server-side-image-map-absent
+ * @atomic true
+ * @summary <img> must not use a server-side image map (ismap)
+ * @standard WCAG 2.2
+ * @sc 2.1.1
+ * @applicability
+ *   Applies to <img> elements that carry an ismap attribute.
+ * @expectation
+ *   The image does not use ismap at all. Server-side image maps depend on
+ *   the browser sending click coordinates to the server, which has no
+ *   keyboard-operable equivalent — there is no way to determine or expose
+ *   individual clickable regions to assistive technology or keyboard
+ *   users. Client-side image maps (<map>/<area>, each with real href/alt)
+ *   are the accessible alternative and are not flagged by this rule.
+ * @implementation-notes
+ * - Matches a widely-used reference engine's server-side-image-map: presence of ismap is itself
+ *   the violation (there is no automatable way to verify a "usable
+ *   alternative" exists elsewhere on the page).
+ */
+
+const id = 'server-side-image-map-absent';
+
+const meta = {
+  title: 'Images must not use a server-side image map',
+  description: 'Checks that <img> elements do not carry the ismap attribute (server-side image maps have no keyboard-operable equivalent).',
+  i18n: {
+    titleKey: 'serverSideImageMapAbsent_title',
+    descriptionKey: 'serverSideImageMapAbsent_description'
+  },
+  helpUrl: null,
+  tags: ['wcag2a', 'wcag211', 'structure', 'atomic', 'automatic', 'keyboard'],
+  wcagSc: ['2.1.1'],
+  normativeMappings: [
+    { standard: 'WCAG', version: '2.2', requirement: '2.1.1', title: 'Keyboard', conformanceLevel: 'A' }
+  ],
+  defaultSeverity: 'serious',
+  category: 'operable',
+  type: 'automatic',
+  defaultConfidence: 'high',
+  coverage: { facetsBySc: { '2.1.1': ['server-side-image-map-absent'] } }
+};
+
+function runInPage(ctx) {
+  const { document, root, helpers, rule } = ctx;
+  const safeRoot = root || document;
+
+  const nodes = helpers.queryAllSmart ? helpers.queryAllSmart('img[ismap]', safeRoot) : helpers.queryAll('img[ismap]', safeRoot);
+
+  const occurrences = [];
+  let applicableCount = 0;
+
+  for (const el of nodes) {
+    if (!el) continue;
+
+    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' }
+      }
+    });
+  }
+
+  if (applicableCount === 0) {
+    return { ruleId: rule.ruleId, outcome: 'notApplicable', severity: 'minor', occurrences: [] };
+  }
+  if (occurrences.length) {
+    return { ruleId: rule.ruleId, outcome: 'fail', severity: rule.defaultSeverity || 'serious', occurrences };
+  }
+  return { ruleId: rule.ruleId, outcome: 'pass', severity: 'minor', occurrences: [] };
+}
+
+module.exports = { id, meta, runInPage };