@markuplint/rules 5.4.0 → 5.6.0

package/lib/placeholder-label-option/index.js

@@ -1,4 +1,5 @@
 import { createRule } from '@markuplint/ml-core';
+import { getSelectDisplaySize } from '@markuplint/ml-spec';
 import { decodeEntities } from '@markuplint/shared';
 import meta from './meta.js';
 /**
@@ -17,7 +18,7 @@ import meta from './meta.js';
 export default createRule({
     meta: meta,
     verify({ document, report, t }) {
-        for (const select of document.querySelectorAll('select')) {
+        for (const select of document.deepQuerySelectorAll('select')) {
             if (!needPlaceholderLabelOption(select)) {
                 continue;
             }
@@ -88,17 +89,10 @@ select) {
     return value === '' || value === null;
 }
 /**
- * The display size of a `<select>`.
- *
- * > The display size of a select element is the result of applying the rules for parsing non-negative integers to the
- * > value of the element's size attribute, if it has one and parsing it is successful. If applying those rules to the
- * > attribute's value is not successful, or if the size attribute is absent, then the element's display size is 4 if
- * > the element's multiple content attribute is present, and 1 otherwise.
+ * The display size of a `<select>`, as {@link getSelectDisplaySize} defines it.
  *
  * `null` when the size is given by an expression (`:size="n"`, `size={n}`): it
  * is not known until the template runs, so the rule must not assume it is 1.
- *
- * @see https://html.spec.whatwg.org/multipage/form-elements.html#concept-select-size
  */
 function displaySize(
 // eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
@@ -107,23 +101,7 @@ select) {
     if (size?.isDynamicValue) {
         return null;
     }
-    return parseNonNegativeInteger(size?.value ?? null) ?? (select.hasAttribute('multiple') ? 4 : 1);
-}
-/**
- * The rules for parsing non-negative integers: leading ASCII whitespace is
- * skipped, an optional `+` or `-` is read, then the leading run of ASCII
- * digits; whatever follows the digits is ignored (`"3abc"` is 3, `"01"` is 1).
- * No digits, or a negative number, is an error. `-0` is not less than zero.
- *
- * @see https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#rules-for-parsing-non-negative-integers
- */
-function parseNonNegativeInteger(text) {
-    const match = /^[\t\n\f\r ]*([+-]?)(\d+)/.exec(text ?? '');
-    if (!match) {
-        return null;
-    }
-    const value = Number(match[2]);
-    return match[1] === '-' && value !== 0 ? null : value;
+    return getSelectDisplaySize(size?.value ?? null, select.hasAttribute('multiple'));
 }
 /**
  * The first option of a select's list of options, and whether an optgroup lies

package/lib/progress-value-bounds/index.js

@@ -45,8 +45,8 @@ export default createRule({
             if (valueNum <= maxValue)
                 return;
             const message = maxAttr
-                ? t('The value of the "{0}" attribute must be less than or equal to {1}', 'value', t('the value of the "{0}" attribute', 'max'))
-                : t('The value of the "{0}" attribute must be less than or equal to {1}', 'value', t('{0} when the "{1}" attribute is absent', 'one', 'max'));
+                ? t('The value of the "{0*}" attribute must be less than or equal to {1}', 'value', t('the value of the "{0*}" attribute', 'max'))
+                : t('The value of the "{0*}" attribute must be less than or equal to {1}', 'value', t('{0} when the "{1*}" attribute is absent', 'one', 'max'));
             report({
                 scope: valueAttr,
                 line: valueAttr.valueNode?.startLine,

package/lib/require-accessible-name/index.js

@@ -10,7 +10,7 @@ export default createRule({
     async verify({ document, report, t }) {
         await document.walkOn('Element', el => {
             const ariaVersion = el.rule.options?.ariaVersion ?? document.ruleCommonSettings?.ariaVersion ?? ARIA_RECOMMENDED_VERSION;
-            if (accnameMayBeMutable(el, document)) {
+            if (accnameMayBeMutable(el)) {
                 return;
             }
             if (!isExposed(el, document.specs, ariaVersion)) {
@@ -29,7 +29,7 @@ export default createRule({
                 return;
             }
             // The static scan cannot decide whether the unknown content is the name.
-            if (accnameMayComeFromUnknownContent(el, document)) {
+            if (accnameMayComeFromUnknownContent(el)) {
                 return;
             }
             report({ scope: el, message: t('Require {0}', 'accessible name') });

package/lib/require-adjacent-popover/index.js

@@ -1,5 +1,6 @@
 import { createRule } from '@markuplint/ml-core';
 import { ARIA_RECOMMENDED_VERSION, mayBeFocusable } from '@markuplint/ml-spec';
+import { getElementByIdInTree } from '../helpers.js';
 import meta from './meta.js';
 /**
  * Command values from the Invoker Commands API that relate to popover behavior.
@@ -11,7 +12,8 @@ export default createRule({
     defaultSeverity: 'warning',
     verify({ document, report, t }) {
         const ariaVersion = document.ruleCommonSettings?.ariaVersion ?? ARIA_RECOMMENDED_VERSION;
-        const triggers = document.querySelectorAll('[popovertarget], [commandfor]');
+        // The target is looked for in the tree of the trigger, so the triggers of every tree are checked
+        const triggers = document.deepQuerySelectorAll('[popovertarget], [commandfor]');
         Triggers: for (const trigger of triggers) {
             let targetId = null;
             const popovertarget = trigger.getAttribute('popovertarget');
@@ -27,7 +29,7 @@ export default createRule({
             if (!targetId) {
                 continue;
             }
-            const target = document.getElementById(targetId);
+            const target = getElementByIdInTree(trigger, targetId, trigger.getAttributeNode(popovertarget ? 'popovertarget' : 'commandfor')?.isExpressionValue);
             if (!target) {
                 continue;
             }

package/lib/require-ancestor/index.d.ts

@@ -1,2 +1,38 @@
-declare const _default: Readonly<import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, undefined>>;
+import type { RuleConfigValue } from '@markuplint/ml-core';
+/**
+ * Looks for the ancestor that the content model asks for (`descendantOf`) in the tree of the
+ * element, as the DOM does: the climb stops at the top of the content of a `template` element, and
+ * does not go on to the tree that holds the `template`.
+ *
+ * What the rule decides for an element whose climb ends there depends on where the content is placed:
+ *
+ * - The content of an ordinary `template` element is placed where the markup does not tell
+ *   (a script clones it into the document), so the rule does not decide and reports nothing,
+ *   whether or not a matching ancestor stands outside of the `template`.
+ * - The content of a declarative shadow root is placed in its host, and it is a tree of its own:
+ *   an ancestor outside of the shadow root is not an ancestor of the element, so it is reported.
+ *
+ * A `template` of a template engine that renders its children in place of it (Vue's `<template v-if>`,
+ * or the `template` of a framework whose spec puts the children in the element itself) is not an HTML
+ * `template` element, and the climb goes through it as through any other element.
+ *
+ * A component whose output is not known (`MLElement#isUnresolvedComponent`: no pretender stands for
+ * it) may render the ancestor, so an element with such a component above it, up to the top of its
+ * tree, is not reported: the rule does not decide what the file does not tell. A pretender that
+ * says what the component renders is read as that element, and a web component is the element
+ * that it is written as. What renders its children in place is not one even where the parser sees it
+ * as a component: a fragment (Vue's `slot` is one to its parser) and a `template` with a directive
+ * ({@link isUnknownOutput}).
+ *
+ * When the content model says the ancestor is required only of an element with a parent node
+ * (`descendantOfWithParentNode`, as the `area` element's is), an element that has no parent node in
+ * the file ({@link hasParentNode}) is not reported:
+ *
+ * > An area element with a parent node must have a map element ancestor.
+ *
+ * @see https://dom.spec.whatwg.org/#parent-element
+ * @see https://html.spec.whatwg.org/multipage/scripting.html#the-template-element
+ * @see https://html.spec.whatwg.org/multipage/image-maps.html#the-area-element
+ */
+declare const _default: Readonly<import("@markuplint/ml-core").RuleSeed<RuleConfigValue, undefined>>;
 export default _default;

package/lib/require-ancestor/index.js

@@ -1,29 +1,102 @@
 import { createRule } from '@markuplint/ml-core';
+import { getSpecByTagName, isShadowRoot } from '@markuplint/ml-spec';
+import { isRenderedAway, isUnknownOutput } from '../helpers.js';
 import meta from './meta.js';
+/**
+ * Looks for the ancestor that the content model asks for (`descendantOf`) in the tree of the
+ * element, as the DOM does: the climb stops at the top of the content of a `template` element, and
+ * does not go on to the tree that holds the `template`.
+ *
+ * What the rule decides for an element whose climb ends there depends on where the content is placed:
+ *
+ * - The content of an ordinary `template` element is placed where the markup does not tell
+ *   (a script clones it into the document), so the rule does not decide and reports nothing,
+ *   whether or not a matching ancestor stands outside of the `template`.
+ * - The content of a declarative shadow root is placed in its host, and it is a tree of its own:
+ *   an ancestor outside of the shadow root is not an ancestor of the element, so it is reported.
+ *
+ * A `template` of a template engine that renders its children in place of it (Vue's `<template v-if>`,
+ * or the `template` of a framework whose spec puts the children in the element itself) is not an HTML
+ * `template` element, and the climb goes through it as through any other element.
+ *
+ * A component whose output is not known (`MLElement#isUnresolvedComponent`: no pretender stands for
+ * it) may render the ancestor, so an element with such a component above it, up to the top of its
+ * tree, is not reported: the rule does not decide what the file does not tell. A pretender that
+ * says what the component renders is read as that element, and a web component is the element
+ * that it is written as. What renders its children in place is not one even where the parser sees it
+ * as a component: a fragment (Vue's `slot` is one to its parser) and a `template` with a directive
+ * ({@link isUnknownOutput}).
+ *
+ * When the content model says the ancestor is required only of an element with a parent node
+ * (`descendantOfWithParentNode`, as the `area` element's is), an element that has no parent node in
+ * the file ({@link hasParentNode}) is not reported:
+ *
+ * > An area element with a parent node must have a map element ancestor.
+ *
+ * @see https://dom.spec.whatwg.org/#parent-element
+ * @see https://html.spec.whatwg.org/multipage/scripting.html#the-template-element
+ * @see https://html.spec.whatwg.org/multipage/image-maps.html#the-area-element
+ */
 export default createRule({
     meta: meta,
     async verify({ document, report, t }) {
         await document.walkOn('Element', el => {
-            const elSpec = document.specs.specs.find(s => s.name === el.localName);
-            const descendantOf = elSpec?.contentModel?.descendantOf;
+            const contentModel = getSpecByTagName(document.specs.specs, el.localName, el.namespaceURI)?.contentModel;
+            const descendantOf = contentModel?.descendantOf;
             if (!descendantOf) {
                 return;
             }
-            let ancestor = el.parentElement;
+            let ancestor = el.treeParentElement;
             let found = false;
             while (ancestor) {
                 if (ancestor.matches(descendantOf)) {
                     found = true;
                     break;
                 }
-                ancestor = ancestor.parentElement;
+                // What the component renders is not known, so the ancestor may be among it. The climb does not
+                // leave the tree of the element (`treeParentElement`), so a component outside a declarative shadow
+                // root is not reached
+                if (isUnknownOutput(ancestor)) {
+                    return;
+                }
+                ancestor = ancestor.treeParentElement;
+            }
+            if (found || (contentModel.descendantOfWithParentNode && !hasParentNode(el))) {
+                return;
             }
-            if (!found) {
-                report({
-                    scope: el,
-                    message: t('{0} must appear as a descendant of {1}', t('the "{0}" {1}', el.localName, 'element'), t('the "{0}" {1}', descendantOf, 'element')),
-                });
+            const root = el.getRootNode();
+            if (root.is(root.DOCUMENT_FRAGMENT_NODE) && !isShadowRoot(root)) {
+                return;
             }
+            report({
+                scope: el,
+                message: t('{0} must appear as a descendant of {1}', t('the "{0*}" {1}', el.localName, 'element'), t('the "{0*}" {1}', descendantOf, 'element')),
+            });
         });
     },
 });
+/**
+ * Whether the element has a parent node, as far as the file tells. In a whole document every element
+ * has one. An element at the top of a file that is a fragment of a document (a partial, a component)
+ * has none: where it is inserted is not known from the markup. What is rendered away between the
+ * element and the top of the file is not a parent node: a block of a template language, which
+ * `parentNode` (and so `parentElement`) walks through, and a fragment of JSX or a `template` with
+ * a directive ({@link isRenderedAway}).
+ *
+ * @template T - The rule configuration value type
+ * @template O - The rule options type
+ * @param el - An element
+ * @returns `false` if the element is at the top of a fragment document
+ */
+function hasParentNode(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+el) {
+    if (!el.isInFragmentDocument()) {
+        return true;
+    }
+    let parent = el.parentElement;
+    while (parent && isRenderedAway(parent)) {
+        parent = parent.parentElement;
+    }
+    return parent !== null;
+}

package/lib/require-ancestor/meta.d.ts

@@ -1,4 +1,9 @@
 declare const _default: {
     readonly category: "structure";
+    readonly specConformance: {
+        readonly sources: readonly ["html"];
+        readonly level: "must";
+        readonly cites: readonly ["https://html.spec.whatwg.org/multipage/image-maps.html#the-area-element"];
+    };
 };
 export default _default;

package/lib/require-ancestor/meta.js

@@ -1,3 +1,8 @@
 export default {
     category: 'structure',
+    specConformance: {
+        sources: ['html'],
+        level: 'must',
+        cites: ['https://html.spec.whatwg.org/multipage/image-maps.html#the-area-element'],
+    },
 };

package/lib/require-attr/index.js

@@ -1,5 +1,6 @@
 import { createRule, getAttrSpecs } from '@markuplint/ml-core';
 import { attrMatches, match } from '../helpers.js';
+import { noTranslate } from '../no-translate.js';
 import meta from './meta.js';
 export default createRule({
     meta: meta,
@@ -107,7 +108,9 @@ export default createRule({
                 if (spec.values.length > 0 && value) {
                     const matched = spec.values.some(pattern => match(value, pattern));
                     if (!matched) {
-                        const expects = spec.values.length === 1 ? t(spec.values) : t('either {0}', t(spec.values));
+                        const expects = spec.values.length === 1
+                            ? t(spec.values.map(noTranslate))
+                            : t('either {0}', t(spec.values.map(noTranslate)));
                         const message = t('{0} expects {1}', t('the "{0*}" {1}', spec.name, 'attribute'), expects);
                         const attrToken = el.getAttributeToken(spec.name);
                         const valueToken = attrToken[0]?.valueNode;

package/lib/require-datetime/index.js

@@ -8,8 +8,9 @@ export default createRule({
         langs: undefined,
     },
     verify({ document, report, t }) {
-        for (const time of document.querySelectorAll('time:not([datetime])')) {
-            if (time.hasMutableChildren()) {
+        for (const time of document.deepQuerySelectorAll('time:not([datetime])')) {
+            // The text of the element is the text of its descendants, which a component may render
+            if (time.hasMutableChildren() || [...time.querySelectorAll('*')].some(el => el.isUnresolvedComponent())) {
                 continue;
             }
             const content = time.textContent.trim();

package/lib/require-dialog-autofocus/index.js

@@ -1,4 +1,5 @@
 import { createRule } from '@markuplint/ml-core';
+import { getElementByIdInTree } from '../helpers.js';
 import meta from './meta.js';
 /**
  * Without `autofocus`, the browser's dialog focusing steps fall back to the
@@ -14,8 +15,9 @@ export default createRule({
     defaultSeverity: 'warning',
     meta: meta,
     verify({ document, report, t }) {
-        const triggers = document.querySelectorAll('button[command][commandfor]');
-        const reportedDialogIds = new Set();
+        // The dialog is looked for in the tree of the trigger, so the triggers of every tree are checked
+        const triggers = document.deepQuerySelectorAll('button[command][commandfor]');
+        const reportedDialogs = new Set();
         for (const trigger of triggers) {
             const command = trigger.getAttribute('command');
             if (!command || command.toLowerCase() !== 'show-modal') {
@@ -25,11 +27,11 @@ export default createRule({
             if (!targetId) {
                 continue;
             }
-            if (reportedDialogIds.has(targetId)) {
+            const target = getElementByIdInTree(trigger, targetId, trigger.getAttributeNode('commandfor')?.isExpressionValue);
+            if (!target) {
                 continue;
             }
-            const target = document.getElementById(targetId);
-            if (!target) {
+            if (reportedDialogs.has(target)) {
                 continue;
             }
             if (target.localName !== 'dialog') {
@@ -42,7 +44,7 @@ export default createRule({
             if (autofocusDescendants.length > 0) {
                 continue;
             }
-            reportedDialogIds.add(targetId);
+            reportedDialogs.add(target);
             report({
                 scope: target,
                 message: t('The "{0*}" element referenced by a "{1*}" command requires an element with the "{2*}" attribute', 'dialog', 'show-modal', 'autofocus'),

package/lib/require-element/index.js

@@ -1,4 +1,5 @@
 import { createRule } from '@markuplint/ml-core';
+import { mayRenderUnknownChildren } from '../helpers.js';
 import meta from './meta.js';
 export default createRule({
     meta: meta,
@@ -8,7 +9,10 @@ export default createRule({
         ignoreOmittedElements: true,
     },
     async verify({ document, report, t }) {
-        const hasMutableContent = document.nodeList.some(n => n.is(n.ELEMENT_NODE) && n.hasMutableChildren());
+        // The element that a global rule asks for may be anywhere, so what any component, block or
+        // descendant renders may be it
+        const hasMutableContent = document.rule.options.ignoreHasMutableContents &&
+            document.nodeList.some(n => n.is(n.ELEMENT_NODE) && (n.hasMutableChildren() || n.isUnresolvedComponent()));
         if (!hasMutableContent) {
             for (const query of document.rule.value) {
                 const matched = document.querySelectorAll(query);
@@ -30,7 +34,9 @@ export default createRule({
             if (el.rule.value === document.rule.value) {
                 return;
             }
-            if (el.rule.options.ignoreHasMutableContents && el.hasMutableChildren()) {
+            // What a descendant renders is not a child of the element that has to have the required one
+            if (el.rule.options.ignoreHasMutableContents &&
+                [...el.getPureChildNodes()].some(child => mayRenderUnknownChildren(child))) {
                 return;
             }
             for (const query of el.rule.value) {

package/lib/require-h1/index.js

@@ -14,20 +14,16 @@ export default createRule({
     defaultOptions: {
         'in-document-fragment': false,
     },
-    async verify({ document, report, t }) {
-        const h1Stack = [];
+    verify({ document, report, t }) {
         if (document.nodeList.length === 0) {
             return;
         }
         if (!document.rule.options['in-document-fragment'] && document.isFragment) {
             return;
         }
-        await document.walkOn('Element', node => {
-            if (node.nodeName.toLowerCase() === 'h1') {
-                h1Stack.push(node);
-            }
-        });
-        if (h1Stack.length === 0) {
+        // The h1 of the document is required: what is in the content of a `template` element or in a
+        // declarative shadow root is a tree of its own, and where it is inserted is not known from the markup
+        if (!document.querySelector('h1')) {
             const message = t('Require {0}', t('the "{0*}" {1}', 'h1', 'element'));
             report({
                 message,

package/lib/require-landmark-label/index.js

@@ -1,5 +1,5 @@
 import { createRule } from '@markuplint/ml-core';
-import { computeLandmarkRoles } from '../landmark-roles/roles.js';
+import { computeLandmarkRolesOfEachTree } from '../landmark-roles/roles.js';
 import meta from './meta.js';
 /**
  * Split from the former `landmark-roles` rule (#3989): when a document has
@@ -17,22 +17,24 @@ export default createRule({
         if (document.isFragment) {
             return;
         }
-        const roles = computeLandmarkRoles(document);
-        for (const role of Object.keys(roles)) {
-            const roleEls = roles[role];
-            const duplicated = 1 < roleEls.length;
-            if (!duplicated) {
-                continue;
-            }
-            for (const el of roleEls) {
-                if (el.rule.disabled) {
+        // Landmarks are counted by tree: the content of a `template` element is a tree of its own
+        for (const roles of computeLandmarkRolesOfEachTree(document)) {
+            for (const role of Object.keys(roles)) {
+                const roleEls = roles[role];
+                const duplicated = 1 < roleEls.length;
+                if (!duplicated) {
                     continue;
                 }
-                if (!hasLabel(el)) {
-                    report({
-                        scope: el,
-                        message: t('Require {0}', t('unique {0}', 'accessible name')),
-                    });
+                for (const el of roleEls) {
+                    if (el.rule.disabled) {
+                        continue;
+                    }
+                    if (!hasLabel(el)) {
+                        report({
+                            scope: el,
+                            message: t('Require {0}', t('unique {0}', 'accessible name')),
+                        });
+                    }
                 }
             }
         }

package/lib/role-supports-aria-prop/index.js

@@ -2,7 +2,7 @@ import { createRule, getComputedRole, ariaSpecs, getSpec } from '@markuplint/ml-
 import { ARIA_RECOMMENDED_VERSION } from '@markuplint/ml-spec';
 import { checkingRoleSupportsAriaProp } from '../wai-aria/checkings/role-supports-aria-prop.js';
 import { defaultOptions } from '../wai-aria/default-options.js';
-import { isAriaAttr } from '../helpers.js';
+import { getAriaAttrs } from '../helpers.js';
 import meta from './meta.js';
 /**
  * Split from the former `wai-aria-disallowed-props` rule (#3989): the
@@ -21,7 +21,7 @@ export default createRule({
                 return;
             if (elSpec && !elSpec.globalAttrs['#ARIAAttrs'])
                 return;
-            const propAttrs = el.attributes.filter(attr => isAriaAttr(attr));
+            const propAttrs = getAriaAttrs(el);
             if (propAttrs.length === 0)
                 return;
             const ariaVersion = el.rule.options?.version ?? document.ruleCommonSettings?.ariaVersion ?? ARIA_RECOMMENDED_VERSION;

package/lib/sizes-auto-requires-lazy-loading/index.d.ts

@@ -9,8 +9,10 @@
  * `auto` (`allowsAutoSizes`), not `loading="lazy"` alone.
  *
  * Gated on `srcset` being present, matching the source rule this was split
- * from: `sizes="auto"` has nothing to auto-size without candidates to choose
- * from.
+ * from. An `<img>` without `srcset` is left to the `@markuplint/html-spec`
+ * data of its `sizes`: the condition allows it only on a lazily loaded image
+ * (`no-disallowed-attr`) and the type only as the value `auto`
+ * (`no-invalid-attr-value`).
  */
 declare const _default: Readonly<import("@markuplint/ml-core").RuleSeed<boolean, undefined>>;
 export default _default;

package/lib/sizes-auto-requires-lazy-loading/index.js

@@ -13,8 +13,10 @@ import meta from './meta.js';
  * `auto` (`allowsAutoSizes`), not `loading="lazy"` alone.
  *
  * Gated on `srcset` being present, matching the source rule this was split
- * from: `sizes="auto"` has nothing to auto-size without candidates to choose
- * from.
+ * from. An `<img>` without `srcset` is left to the `@markuplint/html-spec`
+ * data of its `sizes`: the condition allows it only on a lazily loaded image
+ * (`no-disallowed-attr`) and the type only as the value `auto`
+ * (`no-invalid-attr-value`).
  */
 export default createRule({
     meta,

package/lib/usemap-references-map/index.js

@@ -1,4 +1,5 @@
 import { createRule } from '@markuplint/ml-core';
+import { getDOMValue, querySelectorAllInTree } from '../helpers.js';
 import meta from './meta.js';
 /**
  * Require the `usemap` attribute on an `<img>` element to be a valid
@@ -27,18 +28,26 @@ export default createRule({
                 return;
             if (usemapAttr.isDynamicValue)
                 return;
-            const value = usemapAttr.value;
+            // The character references are resolved on both sides, as the DOM has the strings
+            const value = getDOMValue(usemapAttr) ?? usemapAttr.value;
             if (!value.startsWith('#') || value.length <= 1)
                 return;
             const targetName = value.slice(1);
-            const target = [...document.querySelectorAll('map')].find(candidate => candidate.getAttribute('name') === targetName);
+            const target = querySelectorAllInTree(el, 'map').find(candidate => {
+                const name = candidate.getAttributeNode('name');
+                if (!name) {
+                    return false;
+                }
+                // A name that is not known until it is rendered may be the one that the reference means
+                return name.isDynamicValue || getDOMValue(name) === targetName;
+            });
             if (!target) {
                 report({
                     scope: usemapAttr,
                     line: usemapAttr.valueNode?.startLine,
                     col: usemapAttr.valueNode?.startCol,
                     raw: usemapAttr.valueNode?.raw,
-                    message: t('The "{0}" attribute of the "{1}" element must be a valid hash-name reference to a "{2}" element', 'usemap', 'img', 'map'),
+                    message: t('The "{0*}" attribute of the "{1*}" element must be a valid hash-name reference to a "{2*}" element', 'usemap', 'img', 'map'),
                 });
             }
         });

package/lib/valid-speculation-rules/index.js

@@ -216,7 +216,7 @@ function validateUrls(urls, label, reportAt, t) {
  * Validate a document-rule `where` predicate. A predicate object must contain
  * exactly one of `and` / `or` / `not` / `href_matches` / `selector_matches`.
  *
- * @see https://wicg.github.io/nav-speculation/speculation-rules.html#document-rule-predicates
+ * @see https://html.spec.whatwg.org/multipage/speculative-loading.html#parse-a-document-rule-predicate
  */
 function validatePredicate(predicate, label, reportAt, t) {
     if (!isPlainObject(predicate)) {

package/lib/wai-aria/checkings/contradictory-aria-prop.js

@@ -50,7 +50,7 @@ export const checkingContradictoryAriaProp = ({ attr, propSpecs, attrSpecs }) =>
             }
             return {
                 scope: attr,
-                message: t('{0} contradicts {1}', t('the "{0*}" {1}', attr.name, `ARIA ${propSpec.type}`), t('the current "{0}" {1}', equivalentHtmlAttr.htmlAttrName, 'attribute')),
+                message: t('{0} contradicts {1}', t('the "{0*}" {1}', attr.name, `ARIA ${propSpec.type}`), t('the current "{0*}" {1}', equivalentHtmlAttr.htmlAttrName, 'attribute')),
             };
         }
         else if (value === 'true' &&
@@ -58,7 +58,7 @@ export const checkingContradictoryAriaProp = ({ attr, propSpecs, attrSpecs }) =>
             htmlAttrSpec?.type === 'Boolean') {
             return {
                 scope: attr,
-                message: t('{0} contradicts {1}', t('the "{0*}" {1}', attr.name, `ARIA ${propSpec.type}`), t('the implicit "{0}" {1}', equivalentHtmlAttr.htmlAttrName, 'attribute')),
+                message: t('{0} contradicts {1}', t('the "{0*}" {1}', attr.name, `ARIA ${propSpec.type}`), t('the implicit "{0*}" {1}', equivalentHtmlAttr.htmlAttrName, 'attribute')),
             };
         }
     }

package/lib/wai-aria/checkings/interaction-in-hidden.js

@@ -1,4 +1,4 @@
-import { mayBeFocusable } from '@markuplint/ml-spec';
+import { getComposedParentElement, mayBeFocusable } from '@markuplint/ml-spec';
 /**
  * Checks whether a focusable interactive element is inside an `aria-hidden=true` subtree.
  *
@@ -38,6 +38,10 @@ export const checkingInteractionInHidden = ({ el }) => t => {
 /**
  * Traverses the element's ancestor chain to find the closest element with `aria-hidden="true"`.
  *
+ * The chain is the one the accessibility tree is built from ({@link getComposedParentElement}): it ends at the
+ * top of the content of an ordinary `template` element, which is not rendered and whose placement is not known,
+ * and it goes on from a declarative shadow root to its host.
+ *
  * @param el - The element to start searching from (inclusive).
  * @returns The `aria-hidden` attribute node if found, or `null` if no ancestor is hidden.
  */
@@ -50,7 +54,7 @@ el) {
         if (ariaHidden?.value === 'true') {
             return ariaHidden;
         }
-        current = current.parentElement;
+        current = getComposedParentElement(current);
     }
     return null;
 }