fix: use classifyAttribute for tabindex + disabled (rows d3, d6, t6, t7)

Author: johanrd

lib/rules/template-no-role-presentation-on-focusable.js

@@ -16,6 +16,7 @@
 'use strict';
 
 const { isNativeElement } = require('../utils/is-native-element');
+const { classifyAttribute } = require('../utils/glimmer-attr-presence');
 
 function findAttr(node, name) {
   return node.attributes?.find((a) => a.name === name);
@@ -102,7 +103,11 @@ function isDisabledFormControl(node, tag) {
   if (!DISABLEABLE_TAGS.has(tag)) {
     return false;
   }
-  return Boolean(findAttr(node, 'disabled'));
+  // Per docs/glimmer-attribute-behavior.md (rows d3, d6), bare-mustache
+  // `disabled={{false}}` / `{{null}}` / `{{undefined}}` cause Glimmer to
+  // omit the attribute at runtime — the control is NOT disabled. Use
+  // classifyAttribute so runtime-rendered presence drives the answer.
+  return classifyAttribute(findAttr(node, 'disabled')).presence === 'present';
 }
 
 // Narrow rule-local "keyboard-focusable" check. Intentionally distinct from
@@ -123,7 +128,9 @@ function isKeyboardFocusable(node) {
 
   // Any tabindex (including "-1") makes the element at least programmatically
   // focusable — still in scope for the semantic-conflict this rule targets.
-  if (findAttr(node, 'tabindex')) {
+  // Use classifyAttribute so bare `{{false}}` / `{{null}}` / `{{undefined}}`
+  // (rows t6, t7) — which Glimmer omits — are not treated as having tabindex.
+  if (classifyAttribute(findAttr(node, 'tabindex')).presence === 'present') {
     return true;
   }
 

tests/lib/rules/template-no-role-presentation-on-focusable.js

@@ -67,6 +67,10 @@ ruleTester.run('template-no-role-presentation-on-focusable', rule, {
     // Disabled form controls are not keyboard-focusable (HTML §4.10.18.5).
     '<template><button disabled role="presentation">Click</button></template>',
     '<template><input type="text" disabled role="presentation" /></template>',
+    // Bare-mustache falsy on tabindex (rows t6, t7) — Glimmer omits at runtime,
+    // element isn't focusable from tabindex, so role="presentation" is fine.
+    '<template><div tabindex={{false}} role="presentation"></div></template>',
+    '<template><div tabindex={{null}} role="none"></div></template>',
 
     // Non-focusable wrapper with role="presentation" around a focusable child —
     // the rule only checks the element that carries the role, not its subtree.
@@ -84,6 +88,18 @@ ruleTester.run('template-no-role-presentation-on-focusable', rule, {
       output: null,
       errors: [{ messageId: 'invalidPresentation' }],
     },
+    // Bare-mustache falsy on disabled (rows d3, d6) — Glimmer omits the
+    // attribute, button stays focusable, role="presentation" is invalid.
+    {
+      code: '<template><button disabled={{false}} role="presentation">Click</button></template>',
+      output: null,
+      errors: [{ messageId: 'invalidPresentation' }],
+    },
+    {
+      code: '<template><button disabled={{null}} role="presentation">Click</button></template>',
+      output: null,
+      errors: [{ messageId: 'invalidPresentation' }],
+    },
     {
       code: '<template><button role="none">Click</button></template>',
       output: null,