Skip non-HTML elements

Signed-off-by: Sebastian Malton <[email protected]>
jsx-eslint · Nov 1, 2021 · 11764b5 · 11764b5
1 parent 7974f7d
commit 11764b5
Show file tree

Hide file tree

Showing 2 changed files with 811 additions and 645 deletions.
diff --git a/lib/rules/no-invalid-html-attribute.js b/lib/rules/no-invalid-html-attribute.js
@@ -47,6 +47,155 @@ const rel = new Map([
 ]);
 VALID_VALUES.set('rel', rel);
 
+/**
+ * The set of all possible HTML elements. Used for skipping custom types
+ * @type {Set<string>}
+ */
+const HTML_ELEMENTS = new Set([
+  'html',
+  'base',
+  'head',
+  'link',
+  'meta',
+  'style',
+  'title',
+  'body',
+  'address',
+  'article',
+  'aside',
+  'footer',
+  'header',
+  'h1',
+  'h2',
+  'h3',
+  'h4',
+  'h5',
+  'h6',
+  'main',
+  'nav',
+  'section',
+  'blockquote',
+  'dd',
+  'div',
+  'dl',
+  'dt',
+  'figcaption',
+  'figure',
+  'hr',
+  'li',
+  'ol',
+  'p',
+  'pre',
+  'ul',
+  'a',
+  'abbr',
+  'b',
+  'bdi',
+  'bdo',
+  'br',
+  'cite',
+  'code',
+  'data',
+  'dfn',
+  'em',
+  'i',
+  'kbd',
+  'mark',
+  'q',
+  'rp',
+  'rt',
+  'ruby',
+  's',
+  'samp',
+  'small',
+  'span',
+  'strong',
+  'sub',
+  'sup',
+  'time',
+  'u',
+  'var',
+  'wbr',
+  'area',
+  'audio',
+  'img',
+  'map',
+  'track',
+  'video',
+  'embed',
+  'iframe',
+  'object',
+  'param',
+  'picture',
+  'portal',
+  'source',
+  'svg',
+  'math',
+  'canvas',
+  'noscript',
+  'script',
+  'del',
+  'ins',
+  'caption',
+  'col',
+  'colgroup',
+  'table',
+  'tbody',
+  'td',
+  'tfoot',
+  'th',
+  'thead',
+  'tr',
+  'button',
+  'datalist',
+  'fieldset',
+  'form',
+  'input',
+  'label',
+  'legend',
+  'meter',
+  'optgroup',
+  'option',
+  'output',
+  'progress',
+  'select',
+  'textarea',
+  'details',
+  'dialog',
+  'menu',
+  'summary',
+  'slot',
+  'template',
+  'acronym',
+  'applet',
+  'basefont',
+  'bgsound',
+  'big',
+  'blink',
+  'center',
+  'content',
+  'dir',
+  'font',
+  'frame',
+  'frameset',
+  'hgroup',
+  'image',
+  'keygen',
+  'marquee',
+  'menuitem',
+  'nobr',
+  'noembed',
+  'noframes',
+  'plaintext',
+  'rb',
+  'rtc',
+  'shadow',
+  'spacer',
+  'strike',
+  'tt',
+  'xmp'
+]);
+
 /**
 * Map between attributes and set of tags that the attribute is valid on
 * @type {Map<string, Set<string>>}
@@ -205,14 +354,14 @@ function checkPropValidValue(context, node, value, attribute) {
     return context.report({
       node: value,
       message: `${value.raw} is never a valid "${attribute}" attribute value.`
-    })
+    });
   }
 
   if (!validTagSet.has(node.arguments[0].value)) {
     return context.report({
       node: value,
       message: `${value.raw} is not a valid value of "${attribute}" for a ${node.arguments[0].raw} element`
-    })
+    });
   }
 }
 
@@ -223,23 +372,20 @@ function checkPropValidValue(context, node, value, attribute) {
  * @param {string} attribute
  */
 function checkCreateProps(context, node, attribute) {
-  if (node.arguments[0].type !== 'Literal') {
-    return; // can only check literals
-  }
-
   const propsArg = node.arguments[1];
 
-  if (!propsArg || propsArg.type !== 'ObjectExpression'
-  ) {
+  if (!propsArg || propsArg.type !== 'ObjectExpression') {
     return; // can't check variables, computed, or shorthands
   }
 
   for (const prop of propsArg.properties) {
     if (prop.key.type !== 'Identifier') {
+      // eslint-disable-next-line no-continue
       continue; // cannot check computed keys
     }
 
     if (prop.key.name !== attribute) {
+      // eslint-disable-next-line no-continue
       continue; // ignore not this attribute
     }
 
@@ -254,6 +400,7 @@ function checkCreateProps(context, node, attribute) {
         message: `The "${attribute}" attribute only has meaning on the tags: ${tagNames}`
       });
 
+      // eslint-disable-next-line no-continue
       continue;
     }
 
@@ -263,10 +410,12 @@ function checkCreateProps(context, node, attribute) {
         message: `The "${attribute}" attribute cannot be a method.`
       });
 
+      // eslint-disable-next-line no-continue
       continue;
     }
 
     if (prop.shorthand || prop.computed) {
+      // eslint-disable-next-line no-continue
       continue; // cannot check these
     }
 
@@ -275,6 +424,7 @@ function checkCreateProps(context, node, attribute) {
         checkPropValidValue(context, node, value, attribute);
       }
 
+      // eslint-disable-next-line no-continue
       continue;
     }
 
@@ -309,6 +459,11 @@ module.exports = {
           return;
         }
 
+        // ignore non-HTML elements
+        if (!HTML_ELEMENTS.has(node.parent.name.name)) {
+          return;
+        }
+
         checkAttribute(context, node);
       },
 
@@ -317,6 +472,17 @@ module.exports = {
           return;
         }
 
+        const elemNameArg = node.arguments[0];
+
+        if (!elemNameArg || elemNameArg.type !== 'Literal') {
+          return; // can only check literals
+        }
+
+        // ignore non-HTML elements
+        if (!HTML_ELEMENTS.has(elemNameArg.value)) {
+          return;
+        }
+
         const attributes = new Set(context.options[0] || DEFAULT_ATTRIBUTES);
 
         for (const attribute of attributes) {