refactor: migrate to is-native-element util + normalize input[type] + doc grammar (Copilot review)

Author: johanrd

docs/rules/template-click-events-have-key-events.md

@@ -2,7 +2,7 @@
 
 <!-- end auto-generated rule header -->
 
-Enforce a clickable non-interactive element has at least one keyboard event listener.
+Enforce that a clickable non-interactive element has at least one keyboard event listener.
 
 When a `{{on "click" …}}` modifier is attached to a non-interactive DOM element (e.g. `<div>`, `<span>`, `<a>` without `href`), keyboard-only users can't reach the handler through the keyboard path alone. Adding `{{on "keydown" …}}`, `{{on "keyup" …}}`, or `{{on "keypress" …}}` — along with appropriate `role`/`tabindex` to make the element focusable — restores keyboard parity.
 

lib/rules/template-click-events-have-key-events.js

@@ -1,5 +1,5 @@
 const { dom } = require('aria-query');
-const { isComponentInvocation } = require('../utils/is-component-invocation');
+const { isNativeElement } = require('../utils/is-native-element');
 const { isHtmlInteractiveContent } = require('../utils/html-interactive-content');
 
 const KEYBOARD_EVENT_NAMES = new Set(['keydown', 'keyup', 'keypress']);
@@ -113,14 +113,16 @@ module.exports = {
   },
 
   create(context) {
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
     return {
       GlimmerElementNode(node) {
         if (!node.tag) {
           return;
         }
 
-        // Skip component invocations (PascalCase, named-arg, this-path, dot-path, named-block).
-        if (isComponentInvocation(node)) {
+        // Skip component invocations (PascalCase, named-arg, this-path, dot-path, named-block)
+        // and scope-shadowed tag names.
+        if (!isNativeElement(node, sourceCode)) {
           return;
         }
 

lib/utils/html-interactive-content.js

@@ -63,7 +63,7 @@ function isHtmlInteractiveContent(node, getTextAttrValue, options = {}) {
   // input — interactive unless type="hidden"
   if (tag === 'input') {
     const type = getTextAttrValue(node, 'type');
-    return type !== 'hidden';
+    return type === undefined || type === null || type.trim().toLowerCase() !== 'hidden';
   }
 
   // a — interactive only when href is present

lib/utils/is-component-invocation.js

@@ -53,6 +53,18 @@ describe('isHtmlInteractiveContent', () => {
         isHtmlInteractiveContent(makeNode('input', { type: 'hidden' }), getTextAttrValue)
       ).toBe(false);
     });
+
+    it('is NOT interactive when type="HIDDEN" (case-insensitive)', () => {
+      expect(
+        isHtmlInteractiveContent(makeNode('input', { type: 'HIDDEN' }), getTextAttrValue)
+      ).toBe(false);
+    });
+
+    it('is NOT interactive when type=" hidden " (whitespace-trimmed)', () => {
+      expect(
+        isHtmlInteractiveContent(makeNode('input', { type: ' hidden ' }), getTextAttrValue)
+      ).toBe(false);
+    });
   });
 
   describe('<a>', () => {