fix(template-no-aria-hidden-on-focusable): align with ARIA 1.2 aria-hidden default

Per WAI-ARIA 1.2 §6.6 + aria-hidden value table, a missing or empty-string
aria-hidden resolves to default `undefined` — NOT `true`. Valueless
`<button aria-hidden>` and empty `<button aria-hidden="">` are therefore
NOT spec-hidden; they do not create a focus-trap anti-pattern and the
rule should not flag them.

The prior behavior inherited jsx-a11y's convention (jsx-ast-utils
coerces valueless JSX attrs to boolean true) and vue-a11y's
"anything-not-literal-false" shortcut. Both are peer-plugin conventions,
not normative ARIA interpretations. Matching ember-cli#2717's spec-first
resolution.

Also corrects the rule-doc comment: the claim attributed to WAI-ARIA 1.2
("Authors SHOULD NOT use aria-hidden='true' on any element that has
focus or may receive focus") is not in the WAI-ARIA spec. The spec only
says authors MAY "with caution" use aria-hidden. The rule's concern
(keyboard trap) comes from community/axe guidance, which this comment
now accurately attributes.

Net: flagged values are now `aria-hidden="true"` (ASCII case-insensitive),
`aria-hidden={{true}}`, and `aria-hidden={{"true"}}`. Valueless, empty,
`false`, and `{{false}}` are all accepted.

Author: johanrd

lib/rules/template-no-aria-hidden-on-focusable.js

@@ -15,25 +15,25 @@ function getTextAttrValue(node, name) {
   return undefined;
 }
 
-function isAriaHiddenTruthy(node) {
-  const attr = findAttr(node, 'aria-hidden');
-  if (!attr) {
+// Per WAI-ARIA 1.2 §6.6 + aria-hidden value table, a missing or empty-string
+// aria-hidden resolves to the default `undefined` — NOT `true`. So only an
+// explicit `"true"` (ASCII case-insensitive per HTML enumerated-attribute
+// rules) hides the element. Mustache boolean-literal `{{true}}` and
+// string-literal `{{"true"}}` also qualify.
+function isAriaHiddenTrue(node) {
+  const value = findAttr(node, 'aria-hidden')?.value;
+  if (!value) {
     return false;
   }
-  const value = attr.value;
-  // Valueless or empty-string → truthy boolean attr. Matches jsx-a11y/vue-a11y.
-  if (!value || (value.type === 'GlimmerTextNode' && value.chars === '')) {
-    return true;
-  }
   if (value.type === 'GlimmerTextNode') {
-    return value.chars === 'true';
+    return value.chars.toLowerCase() === 'true';
   }
   if (value.type === 'GlimmerMustacheStatement' && value.path) {
     if (value.path.type === 'GlimmerBooleanLiteral') {
       return value.path.value === true;
     }
     if (value.path.type === 'GlimmerStringLiteral') {
-      return value.path.value === 'true';
+      return value.path.value.toLowerCase() === 'true';
     }
   }
   return false;
@@ -62,11 +62,14 @@ function isFocusable(node) {
   return isNativeInteractive(node, getTextAttrValue);
 }
 
-// Per WAI-ARIA 1.2 §aria-hidden: "Authors SHOULD NOT use aria-hidden='true' on
-// any element that has focus or may receive focus". A focusable descendant of
-// an aria-hidden ancestor can still receive focus (aria-hidden does not remove
-// elements from the tab order), so the ancestor hides AT-visible content that
-// remains keyboard-reachable — a keyboard trap.
+// A focusable descendant of an aria-hidden="true" ancestor can still receive
+// focus (aria-hidden does not remove elements from the tab order), so the
+// ancestor hides AT-visible content that remains keyboard-reachable — a
+// keyboard trap. This rule targets the anti-pattern flagged by axe's
+// `aria-hidden-focus` check and by jsx-a11y's `no-aria-hidden-on-focusable`;
+// the WAI-ARIA 1.2 spec itself only says authors MAY "with caution" use
+// aria-hidden, so the rule rests on community a11y guidance, not a
+// normative WAI-ARIA MUST-NOT.
 function hasFocusableDescendant(node) {
   const children = node.children;
   if (!children || children.length === 0) {
@@ -115,7 +118,7 @@ module.exports = {
   create(context) {
     return {
       GlimmerElementNode(node) {
-        if (!isAriaHiddenTruthy(node)) {
+        if (!isAriaHiddenTrue(node)) {
           return;
         }
         if (isFocusable(node)) {

tests/lib/rules/template-no-aria-hidden-on-focusable.js

@@ -23,6 +23,12 @@ ruleTester.run('template-no-aria-hidden-on-focusable', rule, {
     // aria-hidden="false" — explicit opt-out. Not flagged.
     '<template><button aria-hidden="false">Click me</button></template>',
 
+    // Valueless / empty aria-hidden resolves to default `undefined` per
+    // WAI-ARIA 1.2 §6.6 — not hidden, not flagged even on focusable hosts.
+    '<template><button aria-hidden>Click me</button></template>',
+    '<template><button aria-hidden="">Click me</button></template>',
+    '<template><button aria-hidden={{false}}>Click me</button></template>',
+
     // <input type="hidden"> isn't focusable, so aria-hidden on it is fine.
     '<template><input type="hidden" aria-hidden="true" /></template>',
 
@@ -95,19 +101,14 @@ ruleTester.run('template-no-aria-hidden-on-focusable', rule, {
       errors: [{ messageId: 'noAriaHiddenOnFocusable' }],
     },
 
-    // Boolean / valueless / mustache-boolean aria-hidden — all truthy.
+    // Mustache-boolean + case-variant aria-hidden = true — truthy per spec.
     {
-      code: '<template><button aria-hidden></button></template>',
-      output: null,
-      errors: [{ messageId: 'noAriaHiddenOnFocusable' }],
-    },
-    {
-      code: '<template><button aria-hidden=""></button></template>',
+      code: '<template><button aria-hidden={{true}}></button></template>',
       output: null,
       errors: [{ messageId: 'noAriaHiddenOnFocusable' }],
     },
     {
-      code: '<template><button aria-hidden={{true}}></button></template>',
+      code: '<template><button aria-hidden="TRUE"></button></template>',
       output: null,
       errors: [{ messageId: 'noAriaHiddenOnFocusable' }],
     },