@surea11y/core 1.7.0 → 1.8.1

package/src/checks/automatic/css-orientation-lock.js

@@ -20,6 +20,16 @@
  *   regardless of the device's actual orientation, which defeats WCAG
  *   1.3.4's requirement that content not restrict its view to a single
  *   display orientation unless that orientation is essential.
+ *   Such a rotation fails.
+ *
+ *   A second shape is asked about (cantTell): an orientation media block
+ *   that hides the page's content with `display: none` or `visibility:
+ *   hidden`, the usual form of WCAG F100 (content replaced by a "rotate
+ *   your device" message in one orientation). The hidden element counts as
+ *   the page's content when it is `html` or `body`, the `main` landmark, an
+ *   ancestor of it, or, on a page without a main landmark, an element
+ *   holding at least half of the body's text. Whether the orientation is
+ *   essential, and whether the page stays usable, is left to a person.
  * @implementation-notes
  * - The rotation DEGREE is what makes this the exploit signature, not
  *   merely the presence of a `rotate()` function: a small decorative icon
@@ -38,11 +48,16 @@
  *   security model) and are skipped, same class of limitation as any
  *   check that can only see same-origin/inspectable content (compare
  *   `iframe-focusable-content`).
- * - Not per-element: this is a whole-document/whole-stylesheet concern,
- *   so occurrences are reported against `document.documentElement`,
+ * - A rotation lock is not decided per element: this is a
+ *   whole-document/whole-stylesheet concern, so its occurrences are
+ *   reported against `document.documentElement`,
  *   matching the "whole-document checks" precedent documented in
  *   `docs/RULE_AUTHORING.md` §11.2 (e.g. `aria-hidden-body`,
- *   `meta-viewport-zoom-enabled`).
+ *   `meta-viewport-zoom-enabled`). A hidden-content finding is reported
+ *   against the hidden element.
+ * - The rotation lock stays a failure, as in ACT b33eff, which assumes the
+ *   orientation is not essential; a person reviewing an essential lock (a
+ *   piano keyboard, a cheque scan) can set that finding aside.
  */
 
 const id = 'css-orientation-lock';
@@ -50,7 +65,7 @@ const id = 'css-orientation-lock';
 const meta = {
   title: 'CSS must not lock the page to a single orientation',
   description:
-    'Checks that no @media (orientation: portrait|landscape) rule sets a transform: rotate(...) on the page, a known technique for defeating device orientation.',
+    "Checks that no @media (orientation: portrait|landscape) rule sets a transform: rotate(...) on the page, a known technique for defeating device orientation, and asks about any such rule that hides the page's main content.",
   i18n: {
     titleKey: 'cssOrientationLock_title',
     descriptionKey: 'cssOrientationLock_description'
@@ -228,17 +243,50 @@ function runInPage(ctx) {
     return m.includes('orientation') && (m.includes('portrait') || m.includes('landscape'));
   }
 
-  function scanRuleList(rules, mediaText, findings) {
+  function hidesContent(styleDecl) {
+    if (!styleDecl || typeof styleDecl.getPropertyValue !== 'function') return false;
+    const display = trim(styleDecl.getPropertyValue('display')).toLowerCase();
+    const visibility = trim(styleDecl.getPropertyValue('visibility')).toLowerCase();
+    return display === 'none' || visibility === 'hidden' || visibility === 'collapse';
+  }
+
+  function scanRuleList(rules, mediaText, findings, hidings) {
     if (!rules) return;
     for (const r of rules) {
-      if (!r) continue;
-      if (r.type === CSS_STYLE_RULE && isLockingRotation(r.style)) {
+      if (!r || r.type !== CSS_STYLE_RULE) continue;
+      if (isLockingRotation(r.style)) {
         findings.push({ mediaText, selectorText: trim(r.selectorText) });
       }
+      if (r.selectorText && hidesContent(r.style)) {
+        hidings.push({ mediaText, selectorText: trim(r.selectorText) });
+      }
     }
   }
 
+  // Whether an element hidden by an orientation block holds the page's
+  // content: the root, the body, the main landmark or an ancestor of it, or,
+  // with no main landmark, most of the body's text.
+  function textLength(el) {
+    return String((el && el.textContent) || '').replace(/\s+/g, '').length;
+  }
+  let mainEl = null;
+  try {
+    mainEl = document.querySelector('main, [role="main"]');
+  } catch {
+    mainEl = null;
+  }
+  const bodyTextLength = document.body ? textLength(document.body) : 0;
+
+  function holdsPageContent(el) {
+    if (!el || el.nodeType !== 1) return false;
+    const tag = String(el.localName || '').toLowerCase();
+    if (tag === 'html' || tag === 'body') return true;
+    if (mainEl) return el === mainEl || (typeof el.contains === 'function' && el.contains(mainEl));
+    return bodyTextLength > 0 && textLength(el) * 2 >= bodyTextLength;
+  }
+
   const findings = [];
+  const hidings = [];
   let sheetCount = 0;
   let unreadableSheetCount = 0;
 
@@ -261,7 +309,7 @@ function runInPage(ctx) {
         if (!rule2 || rule2.type !== CSS_MEDIA_RULE) continue;
         const mediaText = rule2.media ? rule2.media.mediaText : '';
         if (!isOrientationMedia(mediaText)) continue;
-        scanRuleList(rule2.cssRules, mediaText, findings);
+        scanRuleList(rule2.cssRules, mediaText, findings, hidings);
       }
     }
   } catch {
@@ -270,8 +318,90 @@ function runInPage(ctx) {
 
   const scanTarget = document.documentElement || document.body || null;
 
+  function unreadableSheetsOccurrence(count) {
+    return helpers.reportOccurrence(scanTarget, {
+      summary: `${count} stylesheet(s) could not be read, so whether this page locks its orientation could not be determined.`,
+      hint: 'Cross-origin stylesheets are not inspectable from the page. Check any third-party CSS for an orientation media query containing a rotate() transform, or re-run the scan with those stylesheets served same-origin.',
+      i18n: {
+        summaryKey: 'cssOrientationLock_summary_cantTell_unreadableSheets',
+        hintKey: 'cssOrientationLock_hint_cantTell_unreadableSheets',
+        params: { count: String(count) }
+      },
+      uncertainty: {
+        code: 'not-computable',
+        needed: 'The contents of the stylesheets this scan could not read.',
+        evidence: { unreadableSheetCount: count, reasonCode: 'STYLESHEETS_NOT_READABLE' }
+      },
+      data: {
+        details: {
+          reasonCode: 'STYLESHEETS_NOT_READABLE',
+          unreadableSheetCount: count
+        }
+      }
+    });
+  }
+
+  // Orientation blocks hiding the page's content (F100): one question per
+  // hidden element.
+  const hiddenContent = [];
+  const seenHidden = new Set();
+  for (const h of hidings) {
+    let matched;
+    try {
+      matched = Array.from(document.querySelectorAll(h.selectorText));
+    } catch {
+      matched = [];
+    }
+    for (const el of matched) {
+      if (seenHidden.has(el) || !holdsPageContent(el)) continue;
+      seenHidden.add(el);
+      hiddenContent.push({ el, mediaText: h.mediaText, selectorText: h.selectorText });
+    }
+  }
+  const hiddenContentOccurrences = hiddenContent.map((f) =>
+    helpers.reportOccurrence(f.el, {
+      occurrenceOutcome: 'cantTell',
+      summary: `A "${f.mediaText}" media query hides "${f.selectorText}", which holds the page's main content, so the page may not be usable in that orientation.`,
+      hint: 'Check that the page can be viewed and operated in both portrait and landscape. If this media query replaces the content with a message asking the user to rotate the device, show the content instead, unless one orientation is essential.',
+      i18n: {
+        summaryKey: 'cssOrientationLock_summary_cantTell_hidesContent',
+        hintKey: 'cssOrientationLock_hint_cantTell_hidesContent',
+        params: { mediaText: f.mediaText, selectorText: f.selectorText }
+      },
+      uncertainty: {
+        code: 'judgement-required',
+        needed:
+          'Whether the page stays usable in that orientation, and whether one orientation is essential.',
+        evidence: {
+          mediaText: f.mediaText,
+          selectorText: f.selectorText,
+          reasonCode: 'ORIENTATION_MEDIA_HIDES_CONTENT'
+        }
+      },
+      data: {
+        details: {
+          reasonCode: 'ORIENTATION_MEDIA_HIDES_CONTENT',
+          mediaText: f.mediaText,
+          selectorText: f.selectorText
+        }
+      }
+    })
+  );
+
   // A lock found in a readable sheet is still a lock, so `fail` outranks the
   // uncertainty below.
+  if (!findings.length && hiddenContentOccurrences.length) {
+    const unreadable =
+      unreadableSheetCount > 0 ? [unreadableSheetsOccurrence(unreadableSheetCount)] : [];
+    return {
+      ruleId: rule.ruleId,
+      outcome: 'cantTell',
+      severity: rule.defaultSeverity || 'serious',
+      confidence: 'low',
+      occurrences: hiddenContentOccurrences.concat(unreadable)
+    };
+  }
+
   if (!findings.length) {
     if (unreadableSheetCount > 0) {
       return {
@@ -279,28 +409,7 @@ function runInPage(ctx) {
         outcome: 'cantTell',
         severity: rule.defaultSeverity || 'serious',
         confidence: 'low',
-        occurrences: [
-          helpers.reportOccurrence(scanTarget, {
-            summary: `${unreadableSheetCount} stylesheet(s) could not be read, so whether this page locks its orientation could not be determined.`,
-            hint: 'Cross-origin stylesheets are not inspectable from the page. Check any third-party CSS for an orientation media query containing a rotate() transform, or re-run the scan with those stylesheets served same-origin.',
-            i18n: {
-              summaryKey: 'cssOrientationLock_summary_cantTell_unreadableSheets',
-              hintKey: 'cssOrientationLock_hint_cantTell_unreadableSheets',
-              params: { count: String(unreadableSheetCount) }
-            },
-            uncertainty: {
-              code: 'not-computable',
-              needed: 'The contents of the stylesheets this scan could not read.',
-              evidence: { unreadableSheetCount, reasonCode: 'STYLESHEETS_NOT_READABLE' }
-            },
-            data: {
-              details: {
-                reasonCode: 'STYLESHEETS_NOT_READABLE',
-                unreadableSheetCount
-              }
-            }
-          })
-        ]
+        occurrences: [unreadableSheetsOccurrence(unreadableSheetCount)]
       };
     }
     if (sheetCount === 0) {
@@ -333,6 +442,19 @@ function runInPage(ctx) {
     })
   );
 
+  if (hiddenContentOccurrences.length) {
+    // See helpers.resolveTieredOutcome: the lock fails, and the hidden-content
+    // questions are kept beside it.
+    return {
+      ruleId: rule.ruleId,
+      ...helpers.resolveTieredOutcome(
+        occurrences,
+        hiddenContentOccurrences,
+        rule.defaultSeverity || 'serious'
+      )
+    };
+  }
+
   return {
     ruleId: rule.ruleId,
     outcome: 'fail',

package/src/checks/automatic/definition-list-children-valid.js

@@ -9,16 +9,21 @@
  * @standard WCAG 2.2
  * @sc 1.3.1
  * @applicability
- *   Applies to <dl> elements that have at least one direct element child.
+ *   Applies to <dl> elements that have at least one direct element child or
+ *   non-whitespace text directly inside them.
  * @expectation
  *   Every direct element child is <dt>, <dd>, <script>, <template>, <style>,
  *   or a <div> whose own children are drawn from that same set (a single
  *   level of wrapping div is allowed, matching how authors commonly group
- *   dt/dd pairs). If the flattened set contains any <dt> or <dd> at all, it
- *   must contain BOTH (an unbalanced dt-without-dd or dd-without-dt is
- *   invalid). A flattened set with neither is vacuously fine, not a
- *   violation (see implementation-notes). Any other direct or wrapped child
- *   breaks the description-list semantics assistive technologies rely on.
+ *   dt/dd pairs). Non-whitespace text directly inside the <dl> or a wrapping
+ *   <div> is an invalid child too. If the flattened set contains any <dt> or
+ *   <dd> at all, it must contain BOTH (an unbalanced dt-without-dd or
+ *   dd-without-dt is invalid), and read in order it must be groups of one
+ *   or more <dt> followed by one or more <dd>: a <dd> before the first <dt>
+ *   has no term, and a <dt> after the last <dd> has no definition. A
+ *   flattened set with neither is vacuously fine, not a violation (see
+ *   implementation-notes). Any other direct or wrapped child breaks the
+ *   description-list semantics assistive technologies rely on.
  * @implementation-notes
  * - Only one level of <div> wrapping is flattened, a <div> nested inside
  *   another wrapping <div> is not flattened further and its contents are
@@ -27,6 +32,11 @@
  *   with NEITHER dt nor dd, whether from an empty wrapping <div>, only
  *   <script>/<template>/<style> content, or a childless <dl>, is not flagged; only
  *   an unbalanced dt/dd pairing is a real structural problem.
+ * - The order check reads the flattened dt/dd sequence across wrapping
+ *   <div> boundaries, so a term and its definition split into two sibling
+ *   <div>s still pass: assistive technologies get the same terms and
+ *   definitions. The stricter HTML content model (each <div> holds a whole
+ *   group) is not checked here.
  * - Distinct, atomic decision from dlitem-parent-valid (the
  *   inverse relationship: does a given <dt>/<dd> have a valid parent).
  */
@@ -72,17 +82,29 @@ function runInPage(ctx) {
   const occurrences = [];
   let applicableCount = 0;
 
+  // Non-whitespace text directly inside `parent` (the <dl> or a wrapping
+  // <div>).
+  function hasDirectText(parent) {
+    for (const node of parent.childNodes || []) {
+      if (node && node.nodeType === 3 && /\S/.test(node.nodeValue || '')) return true;
+    }
+    return false;
+  }
+
   for (const el of nodes) {
     if (!el || !el.children) continue;
-    if (!el.children.length) continue;
+    const dlHasText = hasDirectText(el);
+    if (!el.children.length && !dlHasText) continue;
 
     applicableCount += 1;
 
     // Flatten one level of wrapping <div> (common dt/dd grouping pattern).
     const flattened = [];
+    let hasText = dlHasText;
     for (const child of el.children) {
       if (!child || !child.tagName) continue;
       if (child.tagName.toLowerCase() === 'div') {
+        if (hasDirectText(child)) hasText = true;
         for (const grandchild of child.children || []) {
           if (grandchild && grandchild.tagName) flattened.push(grandchild);
         }
@@ -94,50 +116,72 @@ function runInPage(ctx) {
     let hasDt = false;
     let hasDd = false;
     const invalidTags = [];
+    // The dt/dd sequence in document order, for the group-order check.
+    const sequence = [];
     for (const node of flattened) {
       const tag = node.tagName.toLowerCase();
       if (tag === 'dt') {
         hasDt = true;
+        sequence.push(tag);
         continue;
       }
       if (tag === 'dd') {
         hasDd = true;
+        sequence.push(tag);
         continue;
       }
       if (!PASSTHROUGH_TAGS.has(tag)) invalidTags.push(tag);
     }
+    if (hasText) invalidTags.push('#text');
     const dedupedInvalidTags = [...new Set(invalidTags)];
 
+    // Groups of one or more dt then one or more dd: the sequence starts
+    // with a dt and ends with a dd.
+    const badOrder =
+      hasDt && hasDd && (sequence[0] !== 'dt' || sequence[sequence.length - 1] !== 'dd');
+
     // The dt/dd pairing is only required "when not empty", a <dl> with
     // NEITHER dt nor dd (whether childless after flattening, only
     // passthrough script/template/style content, or an empty wrapping div)
     // is vacuously fine, not a violation. Only an UNBALANCED pairing (dt
-    // present without any dd, or vice versa) is a real structural problem.
+    // present without any dd, or vice versa) or a misordered one is a
+    // real structural problem.
     const reasonCode = invalidTags.length
       ? 'DL_INVALID_CHILD'
       : (hasDt || hasDd) && !(hasDt && hasDd)
         ? 'DL_NO_DT_DD'
-        : null;
+        : badOrder
+          ? 'DL_DT_DD_ORDER'
+          : null;
     if (!reasonCode) continue;
 
-    const summary = invalidTags.length
-      ? 'This description list contains a direct or wrapped child that is not part of a dt/dd group.'
-      : 'This description list has no <dt>/<dd> term-definition group.';
-    const hint = invalidTags.length
-      ? 'Only use <dt>/<dd> (optionally wrapped in one <div>), <script>, <template>, or <style> inside <dl>.'
-      : 'Add at least one <dt>/<dd> pair inside this <dl>.';
+    const TEXT = {
+      DL_INVALID_CHILD: {
+        summary:
+          'This description list contains a direct or wrapped child that is not part of a dt/dd group.',
+        hint: 'Only use <dt>/<dd> (optionally wrapped in one <div>), <script>, <template>, or <style> inside <dl>.',
+        key: 'invalidChild'
+      },
+      DL_NO_DT_DD: {
+        summary: 'This description list has no <dt>/<dd> term-definition group.',
+        hint: 'Add at least one <dt>/<dd> pair inside this <dl>.',
+        key: 'noDtDd'
+      },
+      DL_DT_DD_ORDER: {
+        summary:
+          'In this description list, a <dd> comes before any <dt>, or the last <dt> has no <dd> after it.',
+        hint: 'Order each group as one or more <dt> followed by one or more <dd>.',
+        key: 'order'
+      }
+    }[reasonCode];
 
     occurrences.push(
       helpers.reportOccurrence(el, {
-        summary,
-        hint,
+        summary: TEXT.summary,
+        hint: TEXT.hint,
         i18n: {
-          summaryKey: invalidTags.length
-            ? 'definitionListChildrenValid_summary_fail_invalidChild'
-            : 'definitionListChildrenValid_summary_fail_noDtDd',
-          hintKey: invalidTags.length
-            ? 'definitionListChildrenValid_hint_fail_invalidChild'
-            : 'definitionListChildrenValid_hint_fail_noDtDd',
+          summaryKey: `definitionListChildrenValid_summary_fail_${TEXT.key}`,
+          hintKey: `definitionListChildrenValid_hint_fail_${TEXT.key}`,
           params: { invalidChildren: dedupedInvalidTags.join(', ') }
         },
         data: {

package/src/checks/automatic/deprecated-elements-not-used.js

@@ -5,34 +5,36 @@
 /**
  * @check deprecated-elements-not-used
  * @atomic true
- * @summary Obsolete non-stoppable elements must not be used
+ * @summary Scrolling <marquee> content needs a way to pause, stop, or hide it
  * @standard WCAG 2.2
  * @sc 2.2.2
  * @applicability
- *   Applies to any <blink> or <marquee> element present in scope. These are
- *   obsolete, non-standard HTML elements whose defining behavior (blinking
- *   or auto-scrolling text) has no built-in user mechanism to pause, stop,
- *   or hide it.
+ *   Applies to any scan scope; whether it contains a <marquee> element is
+ *   always an answerable question. <marquee> is an obsolete, non-standard
+ *   HTML element that browsers still render as auto-scrolling text, with no
+ *   built-in user mechanism to pause, stop, or hide it.
  * @expectation
- *   Neither element is present. Since their movement can never be paused,
- *   stopped, or hidden by the user, presence is itself the violation. This
- *   rule has no partial-pass case (it reports only when the element is
- *   found).
+ *   Each <marquee> is reported as cantTell: the scrolling itself is certain,
+ *   but a page can offer its own pause or stop control (a button calling the
+ *   element's stop() method, for example), and then failure F16 does not
+ *   apply. Whether such a control exists is for a person to check. A scope
+ *   with no <marquee> passes; there is no separate not-applicable case.
  * @implementation-notes
- * - Not rule-gated on isAccTreeEligible: presence in markup is itself the
- *   violation, independent of visibility (moving/blinking content inside a
- *   hidden ancestor could still become visible later without a code
- *   change, so hiding it today does not remove the underlying defect).
- *   Engine-level hidden-subtree filtering still applies unless
- *   engineOptions.includeHiddenElements is true.
+ * - <blink> is not reported. No current browser makes it blink: it renders
+ *   as an unknown inline element, so it holds no blinking content for 2.2.2
+ *   to govern.
+ * - Not rule-gated on isAccTreeEligible: presence in markup is what the rule
+ *   asks about, independent of visibility. Engine-level hidden-subtree
+ *   filtering still applies unless engineOptions.includeHiddenElements is
+ *   true.
  */
 
 const id = 'deprecated-elements-not-used';
 
 const meta = {
-  title: 'Obsolete non-stoppable elements (<blink>, <marquee>) must not be used',
+  title: 'Scrolling <marquee> content must be possible to pause, stop, or hide',
   description:
-    'Checks that deprecated, non-standard HTML elements whose blinking/scrolling content cannot be paused, stopped, or hidden by the user (<blink>, <marquee>) are not present.',
+    'Asks, for each obsolete <marquee> element, whether the page offers a way to pause, stop, or hide its auto-scrolling content, since the element itself has none.',
   i18n: {
     titleKey: 'deprecatedElements_title',
     descriptionKey: 'deprecatedElements_description'
@@ -60,47 +62,50 @@ function runInPage(ctx) {
   const { helpers, rule } = ctx;
 
   const nodes = helpers.queryAllSmart
-    ? helpers.queryAllSmart('blink, marquee')
-    : helpers.queryAll('blink, marquee');
+    ? helpers.queryAllSmart('marquee')
+    : helpers.queryAll('marquee');
 
   const occurrences = [];
-  let applicableCount = 0;
 
   for (const el of nodes) {
     if (!el || !el.tagName) continue;
 
-    applicableCount += 1;
-
     const tag = el.tagName.toLowerCase();
 
     occurrences.push(
       helpers.reportOccurrence(el, {
-        summary: 'This element’s content cannot be paused, stopped, or hidden by the user.',
-        hint: 'Remove this element; use static content, or an animation with a user-facing pause/stop control, instead.',
+        summary:
+          'This <marquee> scrolls its content, and the element itself gives the user no way to pause, stop, or hide it.',
+        hint: 'Check that the page offers a control that pauses, stops, or hides this content. Better: replace it with static content, or with an animation that has a pause/stop control.',
+        occurrenceOutcome: 'cantTell',
         i18n: {
-          summaryKey: 'deprecatedElements_summary_fail',
-          hintKey: 'deprecatedElements_hint_fail',
+          summaryKey: 'deprecatedElements_summary_cantTell',
+          hintKey: 'deprecatedElements_hint_cantTell',
           params: { element: tag }
         },
+        uncertainty: {
+          code: 'runtime-dependent',
+          needed:
+            'Whether the page provides a control that pauses, stops, or hides the scrolling content.',
+          evidence: { element: tag }
+        },
         data: {
-          details: { reasonCode: 'DEPRECATED_NON_STOPPABLE_ELEMENT', element: tag }
+          details: { reasonCode: 'MARQUEE_PAUSE_MECHANISM_UNKNOWN', element: tag }
         }
       })
     );
   }
 
-  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
-    };
+  // No <marquee> in scope is itself the passing case (see @expectation above).
+  if (!occurrences.length) {
+    return { ruleId: rule.ruleId, outcome: 'pass', severity: 'minor', occurrences: [] };
   }
-  return { ruleId: rule.ruleId, outcome: 'pass', severity: 'minor', occurrences: [] };
+  return {
+    ruleId: rule.ruleId,
+    outcome: 'cantTell',
+    severity: rule.defaultSeverity || 'serious',
+    occurrences
+  };
 }
 
 module.exports = { id, meta, runInPage };

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

@@ -5,14 +5,16 @@
 /**
  * @check dialog-name-present
  * @atomic true
- * @summary Elements with role="dialog"/"alertdialog" must have an accessible name
+ * @summary Dialogs (role="dialog"/"alertdialog" or a native <dialog>) must have an accessible name
  * @standard WCAG 2.2
  * @sc 4.1.2
  * @applicability
- *   Applies to elements carrying role="dialog" or role="alertdialog" (the
- *   attribute must name one of those roles alone, not a fallback list) that
- *   are included in the accessibility tree. A native <dialog> without an
- *   explicit role is out of scope.
+ *   Applies to elements included in the accessibility tree whose role is
+ *   dialog or alertdialog: an element whose role attribute resolves to one
+ *   of those roles (the first token that names a concrete ARIA role wins,
+ *   so role="alertdialog dialog" is an alertdialog), and a native <dialog>
+ *   whose role attribute is absent or names no concrete role (its implicit
+ *   role is dialog). A closed <dialog> is hidden and so not in scope.
  * @expectation
  *   The element has a non-empty accessible name from aria-label, from an
  *   aria-labelledby that resolves to non-empty text, or from title. Both
@@ -25,7 +27,7 @@ const id = 'dialog-name-present';
 const meta = {
   title: 'Dialogs have an accessible name',
   description:
-    'Checks that elements with role="dialog" or role="alertdialog" expose a non-empty accessible name.',
+    'Checks that dialogs (elements with role="dialog" or role="alertdialog", and native <dialog> elements) expose a non-empty accessible name.',
   i18n: {
     titleKey: 'dialogNamePresent_title',
     descriptionKey: 'dialogNamePresent_description'
@@ -115,7 +117,8 @@ function runInPage(ctx) {
   const occurrences = [];
   let applicableCount = 0;
 
-  const selector = '[role="dialog"],[role="alertdialog"]';
+  // Filtered below by the resolved role.
+  const selector = 'dialog,[role]';
   const nodes = helpers.queryAllSmart
     ? helpers.queryAllSmart(selector)
     : helpers.queryAll(selector);
@@ -137,12 +140,28 @@ function runInPage(ctx) {
     return { ok: false, method: 'none' };
   }
 
+  // The role the browser uses: the first token of the role attribute that
+  // names a concrete ARIA role, else the element's implicit role (dialog for
+  // a native <dialog>; the others are not in scope here).
+  const aria = helpers && helpers.aria;
+  function resolveRole(el) {
+    const tokens = getAttr(el, 'role').toLowerCase().split(' ').filter(Boolean);
+    for (const t of tokens) {
+      const concrete =
+        aria && typeof aria.isValidConcreteRole === 'function'
+          ? aria.isValidConcreteRole(t)
+          : t === 'dialog' || t === 'alertdialog';
+      if (concrete) return t;
+    }
+    return String(el.tagName || '').toLowerCase() === 'dialog' ? 'dialog' : '';
+  }
+
   for (const el of nodes) {
     if (!el) continue;
-    if (!isEligibleAcc(helpers, el, ctx)) continue;
 
-    const role = getAttr(el, 'role').toLowerCase();
+    const role = resolveRole(el);
     if (role !== 'dialog' && role !== 'alertdialog') continue;
+    if (!isEligibleAcc(helpers, el, ctx)) continue;
 
     applicableCount += 1;
 

package/src/checks/automatic/duplicate-id.js

@@ -14,7 +14,8 @@
  *   element renders or not, which is why ACT 3ea0c8 evaluates hidden
  *   elements too.
  * @expectation
- *   No other element in the same tree carries the same id value. Ids are
+ *   No other element in the same tree carries the same id value, compared
+ *   exactly as written (id="a " and id="a" are different ids). Ids are
  *   scoped per document tree and per shadow tree, so the same id inside
  *   two different shadow roots is not a duplicate.
  * @implementation-notes
@@ -126,7 +127,10 @@ function runInPage(ctx) {
 
   for (const el of all) {
     if (!el || el.nodeType !== 1 || !el.getAttribute) continue;
-    const value = String(el.getAttribute('id') || '').trim();
+    // Compared as written: "a " and "a" are different ids in the DOM, and
+    // getElementById does not trim. Whitespace inside an id is a separate
+    // validity error, not a duplicate.
+    const value = String(el.getAttribute('id') || '');
     if (!value) continue;
 
     applicableCount += 1;

package/src/checks/automatic/identical-iframes-same-purpose.js

@@ -20,10 +20,10 @@
  *   describes one resource, so two frames answering to it must embed the
  *   same one.
  * @implementation-notes
- * - Distinct from iframe-title-unique, which asks the stricter question of
- *   whether the title ATTRIBUTE repeats at all, and answers it from static
- *   markup. This rule keys on the computed accessible name and judges the
- *   resource behind it.
+ * - Frames are grouped by the computed accessible name, not the title
+ *   attribute, so a title that aria-label or aria-labelledby overrides does
+ *   not count. It replaces iframe-title-unique, deprecated in 1.8.0, which
+ *   grouped them by the title attribute.
  * - src values are compared as resolved absolute URLs with the fragment
  *   removed and a trailing slash normalised away, so a directory written
  *   both with and without one is a single resource.