Merge pull request #2719 from johanrd/fix/aria-unsupported-extend-to-dom-reserved

BUGFIX: template-no-aria-unsupported-elements — source the reserved-element list from aria-query

Author: NullVoxPopuli

lib/rules/template-no-aria-unsupported-elements.js

@@ -1,3 +1,12 @@
+const { dom } = require('aria-query');
+
+// HTML elements that don't support ARIA — sourced from aria-query's dom map,
+// which marks spec-reserved elements with .reserved = true. Matches the authoritative
+// list in the HTML-AAM spec (https://www.w3.org/TR/html-aria/#docconformance).
+const ELEMENTS_WITHOUT_ARIA_SUPPORT = new Set(
+  [...dom].filter(([, def]) => def.reserved).map(([tag]) => tag)
+);
+
 /** @type {import('eslint').Rule.RuleModule} */
 module.exports = {
   meta: {
@@ -24,18 +33,6 @@ module.exports = {
   },
 
   create(context) {
-    // Elements that don't support ARIA
-    const ELEMENTS_WITHOUT_ARIA_SUPPORT = new Set([
-      'meta',
-      'html',
-      'script',
-      'style',
-      'title',
-      'base',
-      'head',
-      'link',
-    ]);
-
     return {
       GlimmerElementNode(node) {
         if (ELEMENTS_WITHOUT_ARIA_SUPPORT.has(node.tag)) {

tests/lib/rules/template-no-aria-unsupported-elements.js

@@ -29,5 +29,36 @@ ruleTester.run('template-no-aria-unsupported-elements', rule, {
       output: null,
       errors: [{ messageId: 'unsupported' }],
     },
+
+    {
+      code: '<template><col role="presentation" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
+    {
+      code: '<template><colgroup aria-label="x" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
+    {
+      code: '<template><noscript aria-hidden="true" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
+    {
+      code: '<template><picture aria-label="x" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
+    {
+      code: '<template><source aria-label="x" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
+    {
+      code: '<template><track aria-label="x" /></template>',
+      output: null,
+      errors: [{ messageId: 'unsupported' }],
+    },
   ],
 });