@html-eslint/eslint-plugin 0.13.1 → 0.14.0

package/lib/rules/no-extra-spacing-attrs.js

@@ -1,10 +1,3 @@
-/**
- * @typedef {import("../types").Rule} Rule
- * @typedef {import("../types").AttrNode} AttrNode
- * @typedef {import("../types").TagNode} TagNode
- * @typedef {import("../types").ElementNode} ElementNode
- */
-
 const { RULE_CATEGORY } = require("../constants");
 
 const MESSAGE_IDS = {
@@ -13,9 +6,6 @@ const MESSAGE_IDS = {
   EXTRA_BEFORE: "unexpectedBefore",
 };
 
-/**
- * @type {Rule}
- */
 module.exports = {
   meta: {
     type: "code",
@@ -35,9 +25,6 @@ module.exports = {
     },
   },
   create(context) {
-    /**
-     * @param {AttrNode[]} attrs
-     */
     function checkExtraSpacesBetweenAttrs(attrs) {
       attrs.forEach((current, index, attrs) => {
         if (index >= attrs.length - 1) {
@@ -63,17 +50,13 @@ module.exports = {
         }
       });
     }
-    /**
-     * @param {TagNode} startTag
-     * @param {AttrNode} lastAttr
-     * @param {boolean} isSelfClosed
-     */
-    function checkExtraSpaceAfter(startTag, lastAttr, isSelfClosed) {
-      if (startTag.loc.end.line !== lastAttr.loc.end.line) {
+
+    function checkExtraSpaceAfter(openEnd, lastAttr, isSelfClosed) {
+      if (openEnd.loc.end.line !== lastAttr.loc.end.line) {
         // skip the attribute on the different line with the start tag
         return;
       }
-      let spacesBetween = startTag.loc.end.column - lastAttr.loc.end.column;
+      let spacesBetween = openEnd.loc.end.column - lastAttr.loc.end.column;
       if (isSelfClosed) {
         spacesBetween--;
       }
@@ -82,7 +65,7 @@ module.exports = {
         context.report({
           loc: {
             start: lastAttr.loc.end,
-            end: startTag.loc.end,
+            end: openEnd.loc.end,
           },
           messageId: MESSAGE_IDS.EXTRA_AFTER,
           fix(fixer) {
@@ -95,19 +78,14 @@ module.exports = {
       }
     }
 
-    /**
-     * @param {ElementNode} node
-     * @param {AttrNode} firstAttr
-     */
     function checkExtraSpaceBefore(node, firstAttr) {
       if (node.loc.start.line !== firstAttr.loc.start.line) {
         // skip the attribute on the different line with the start tag
         return;
       }
-      const nodeLength = node.tagName.length;
-      const spacesBetween =
-        firstAttr.loc.start.column - (node.loc.start.column + nodeLength);
-      if (spacesBetween > 2) {
+
+      const spacesBetween = firstAttr.loc.start.column - node.loc.end.column;
+      if (spacesBetween >= 2) {
         context.report({
           loc: {
             start: node.loc.start,
@@ -116,7 +94,7 @@ module.exports = {
           messageId: MESSAGE_IDS.EXTRA_BEFORE,
           fix(fixer) {
             return fixer.removeRange([
-              node.range[0] + nodeLength + 2,
+              firstAttr.range[0] - spacesBetween + 1,
               firstAttr.range[0],
             ]);
           },
@@ -125,19 +103,22 @@ module.exports = {
     }
 
     return {
-      "*"(node) {
-        if (node.attrs && node.attrs.length > 0) {
-          checkExtraSpaceBefore(node, node.attrs[0]);
+      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
+        if (!node.attributes || node.attributes.length <= 0) {
+          return;
         }
-        if (node.startTag && node.attrs && node.attrs.length > 0) {
-          const isSelfClosed = !node.endTag;
+
+        checkExtraSpaceBefore(node.openStart, node.attributes[0]);
+
+        if (node.openEnd && node.attributes && node.attributes.length > 0) {
+          const selfClosing = node.openEnd.value === "/>";
           checkExtraSpaceAfter(
-            node.startTag,
-            node.attrs[node.attrs.length - 1],
-            isSelfClosed
+            node.openEnd,
+            node.attributes[node.attributes.length - 1],
+            selfClosing
           );
         }
-        checkExtraSpacesBetweenAttrs(node.attrs || []);
+        checkExtraSpacesBetweenAttrs(node.attributes);
       },
     };
   },

package/lib/rules/no-inline-styles.js

@@ -1,7 +1,3 @@
-/**
- * @typedef {import("../types").Rule} Rule
- */
-
 const { RULE_CATEGORY } = require("../constants");
 const { NodeUtils } = require("./utils");
 
@@ -9,9 +5,6 @@ const MESSAGE_IDS = {
   INLINE_STYLE: "unexpectedInlineStyle",
 };
 
-/**
- * @type {Rule}
- */
 module.exports = {
   meta: {
     type: "code",
@@ -31,10 +24,11 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
-        if (NodeUtils.hasAttr(node, "style")) {
+      Tag(node) {
+        const styleAttr = NodeUtils.findAttr(node, "style");
+        if (styleAttr) {
           context.report({
-            node: node.startTag,
+            node: styleAttr,
             messageId: MESSAGE_IDS.INLINE_STYLE,
           });
         }

package/lib/rules/no-multiple-h1.js

@@ -32,8 +32,10 @@ module.exports = {
     const h1s = [];
 
     return {
-      H1(node) {
-        h1s.push(node);
+      Tag(node) {
+        if (node.name === "h1") {
+          h1s.push(node);
+        }
       },
       "Program:exit"() {
         if (h1s.length > 1) {

package/lib/rules/no-non-scalable-viewport.js

@@ -32,14 +32,19 @@ module.exports = {
 
   create(context) {
     return {
-      Meta(node) {
+      Tag(node) {
+        if (node.name !== "meta") {
+          return;
+        }
         const nameAttr = NodeUtils.findAttr(node, "name");
         const contentAttr = NodeUtils.findAttr(node, "content");
         if (
           nameAttr &&
+          nameAttr.value &&
           contentAttr &&
-          nameAttr.value.toLowerCase() === "viewport" &&
-          contentAttr.value.match(/user-scalable\s*=\s*no/i)
+          contentAttr.value &&
+          nameAttr.value.value.toLowerCase() === "viewport" &&
+          contentAttr.value.value.match(/user-scalable\s*=\s*no/i)
         ) {
           context.report({
             node: contentAttr,

package/lib/rules/no-obsolete-tags.js

@@ -1,8 +1,4 @@
-/**
- * @typedef {import("../types").Rule} Rule
- */
-
-const { RULE_CATEGORY, NODE_TYPES } = require("../constants");
+const { RULE_CATEGORY } = require("../constants");
 const { OBSOLETE_TAGS } = require("../constants");
 
 const OBSOLETE_TAGS_SET = new Set(OBSOLETE_TAGS);
@@ -11,9 +7,6 @@ const MESSAGE_IDS = {
   UNEXPECTED: "unexpected",
 };
 
-/**
- * @type {Rule}
- */
 module.exports = {
   meta: {
     type: "code",
@@ -33,16 +26,12 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
-        if (
-          node.type !== NODE_TYPES.PROGRAM &&
-          node.tagName &&
-          OBSOLETE_TAGS_SET.has(node.tagName)
-        ) {
+      Tag(node) {
+        if (OBSOLETE_TAGS_SET.has(node.name)) {
           context.report({
             node,
             data: {
-              tag: node.tagName,
+              tag: node.name,
             },
             messageId: MESSAGE_IDS.UNEXPECTED,
           });

package/lib/rules/no-positive-tabindex.js

@@ -31,9 +31,13 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
+      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
         const tabIndexAttr = NodeUtils.findAttr(node, "tabindex");
-        if (tabIndexAttr && parseInt(tabIndexAttr.value, 10) > 0) {
+        if (
+          tabIndexAttr &&
+          tabIndexAttr.value &&
+          parseInt(tabIndexAttr.value.value, 10) > 0
+        ) {
           context.report({
             node: tabIndexAttr,
             messageId: MESSAGE_IDS.UNEXPECTED,

package/lib/rules/no-restricted-attrs.js

@@ -1,6 +1,5 @@
 /**
  * @typedef {import("../types").Rule} Rule
- * @typedef {import("../types").AnyNode} AnyNode
  * @typedef {{tagPatterns: string[], attrPatterns: string[], message?: string}[]} Options
  */
 
@@ -62,27 +61,22 @@ module.exports = {
     const checkers = options.map((option) => new PatternChecker(option));
 
     return {
-      "*"(node) {
-        const tagName = node.tagName;
-        const startTag = node.startTag;
-        if (!tagName || !startTag) return;
-        if (!node.attrs.length) return;
-
-        node.attrs.forEach((attr) => {
-          if (!attr.name) return;
-
+      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
+        const tagName = node.name;
+        node.attributes.forEach((attr) => {
+          if (!attr.key || !attr.key.value) {
+            return;
+          }
           const matched = checkers.find((checker) =>
-            checker.test(node.tagName, attr.name)
+            checker.test(tagName, attr.key.value)
           );
 
-          if (!matched) return;
-
-          /**
-           * @type {{node: AnyNode, message: string, messageId?: string}}
-           */
+          if (!matched) {
+            return;
+          }
 
           const result = {
-            node: startTag,
+            node: attr,
             message: "",
           };
 
@@ -96,7 +90,7 @@ module.exports = {
 
           context.report({
             ...result,
-            data: { attr: attr.name },
+            data: { attr: attr.key.value },
           });
         });
       },

package/lib/rules/no-skip-heading-levels.js

@@ -33,10 +33,13 @@ module.exports = {
     const headings = [];
 
     return {
-      "H1, H2, H3, H5, H6"(node) {
+      Tag(node) {
+        if (!["h1", "h2", "h3", "h5", "h6"].includes(node.name)) {
+          return;
+        }
         headings.push({
           node,
-          level: parseInt(node.type.replace("H", ""), 10),
+          level: parseInt(node.name.replace("h", ""), 10),
         });
       },
       "Program:exit"() {

package/lib/rules/no-target-blank.js

@@ -39,16 +39,19 @@ module.exports = {
       return /^(?:\w+:|\/\/)/.test(link);
     }
     return {
-      A(node) {
+      Tag(node) {
+        if (node.name !== "a") {
+          return;
+        }
         /* eslint-disable */
         const target = NodeUtils.findAttr(node, "target");
-        if (target && target.value === "_blank") {
+        if (target && target.value && target.value.value === "_blank") {
           const href = NodeUtils.findAttr(node, "href");
-          if (href && isExternalLink(href.value)) {
+          if (href && href.value && isExternalLink(href.value.value)) {
             const rel = NodeUtils.findAttr(node, "rel");
-            if (!rel || !rel.value.includes("noreferrer")) {
+            if (!rel || !rel.value || !rel.value.value.includes("noreferrer")) {
               context.report({
-                node,
+                node: target,
                 messageId: MESSAGE_IDS.MISSING,
               });
             }

package/lib/rules/quotes.js

@@ -1,9 +1,3 @@
-/**
- * @typedef {import("../types").Rule} Rule
- * @typedef {import("../types").Range} Range
- * @typedef {import("../types").AttrNode} AttrNode
- */
-
 const { RULE_CATEGORY } = require("../constants");
 
 const MESSAGE_IDS = {
@@ -18,9 +12,6 @@ const QUOTES_STYLES = {
 
 const QUOTES_CODES = [`"`, `'`];
 
-/**
- * @type {Rule}
- */
 module.exports = {
   meta: {
     type: "code",
@@ -62,66 +53,39 @@ module.exports = {
       return sourceCode.text.slice(range[0], range[1]);
     }
 
-    /**
-     * @param {AttrNode} attr
-     * @returns {Range}
-     */
-    function getValueRange(attr) {
-      const attrCode = getCodeIn(attr.range);
-      const [matched = ""] = attrCode.match(/\S*?\s*=\s*/) || [];
-      return [attr.range[0] + matched.length, attr.range[1]];
-    }
-
-    /**
-     * @param {AttrNode} attr
-     * @returns {[string, string]}
-     */
     function getQuotes(attr) {
-      const [valueStart, valueEnd] = getValueRange(attr);
-      const opening = getCodeIn([valueStart, valueStart + 1]);
-      const closing = getCodeIn([valueEnd - 1, valueEnd]);
-      return [opening, closing];
+      return [attr.startWrapper.value, attr.endWrapper.value];
     }
 
-    /**
-     * @param {AttrNode} attr
-     * @returns {boolean}
-     */
-    function hasEqualSign(attr) {
-      const keyEnd = attr.range[0] + attr.name.length;
-      return getCodeIn([keyEnd, attr.range[1]]).trimStart().startsWith("=");
-    }
-
-    /**
-     * @param {AttrNode} attr
-     */
     function checkQuotes(attr) {
-      const [opening, closing] = getQuotes(attr);
-      if (QUOTES_CODES.includes(opening)) {
-        if (opening === closing && opening !== expectedQuote) {
-          context.report({
-            node: attr,
-            messageId: MESSAGE_IDS.UNEXPECTED,
-            data: {
-              expected: `${SELECTED_STYLE}(${expectedQuote})`,
-              actual:
-                SELECTED_STYLE === QUOTES_STYLES.SINGLE
-                  ? `${QUOTES_STYLES.DOUBLE}(")`
-                  : `${QUOTES_STYLES.SINGLE}(')`,
-            },
-            fix(fixer) {
-              const range = getValueRange(attr);
-              const originCode = getCodeIn(range);
-              const onlyValue = originCode.slice(1, originCode.length - 1);
+      if (!attr.value || attr.value.value.includes(expectedQuote)) {
+        return;
+      }
 
-              return fixer.replaceTextRange(
-                range,
-                `${expectedQuote}${onlyValue}${expectedQuote}`
-              );
-            },
-          });
+      if (attr.startWrapper && attr.endWrapper) {
+        const [opening, closing] = getQuotes(attr);
+        if (QUOTES_CODES.includes(opening)) {
+          if (opening === closing && opening !== expectedQuote) {
+            context.report({
+              node: attr,
+              messageId: MESSAGE_IDS.UNEXPECTED,
+              data: {
+                expected: `${SELECTED_STYLE}(${expectedQuote})`,
+                actual:
+                  SELECTED_STYLE === QUOTES_STYLES.SINGLE
+                    ? `${QUOTES_STYLES.DOUBLE}(")`
+                    : `${QUOTES_STYLES.SINGLE}(')`,
+              },
+              fix(fixer) {
+                return fixer.replaceTextRange(
+                  [attr.startWrapper.range[0], attr.endWrapper.range[1]],
+                  `${expectedQuote}${attr.value.value}${expectedQuote}`
+                );
+              },
+            });
+          }
         }
-      } else if (hasEqualSign(attr)) {
+      } else {
         context.report({
           node: attr,
           messageId: MESSAGE_IDS.MISSING,
@@ -129,10 +93,9 @@ module.exports = {
             expected: `${SELECTED_STYLE}(${expectedQuote})`,
           },
           fix(fixer) {
-            const range = getValueRange(attr);
-            const originCode = getCodeIn(range);
+            const originCode = getCodeIn(attr.value.range);
             return fixer.replaceTextRange(
-              range,
+              attr.value.range,
               `${expectedQuote}${originCode}${expectedQuote}`
             );
           },
@@ -141,8 +104,8 @@ module.exports = {
     }
 
     return {
-      "*"(node) {
-        (node.attrs || []).forEach(checkQuotes);
+      [["Tag", "ScriptTag", "StyleTag"].join(",")](node) {
+        node.attributes.forEach(checkQuotes);
       },
     };
   },

package/lib/rules/require-button-type.js

@@ -36,19 +36,22 @@ module.exports = {
 
   create(context) {
     return {
-      Button(node) {
+      Tag(node) {
+        if (node.name !== "button") {
+          return;
+        }
         const typeAttr = NodeUtils.findAttr(node, "type");
-        if (!typeAttr) {
+        if (!typeAttr || !typeAttr.value) {
           context.report({
-            node: node.startTag || node,
+            node: node.openStart,
             messageId: MESSAGE_IDS.MISSING,
           });
-        } else if (!VALID_BUTTON_TYPES_SET.has(typeAttr.value)) {
+        } else if (!VALID_BUTTON_TYPES_SET.has(typeAttr.value.value)) {
           context.report({
             node: typeAttr,
             messageId: MESSAGE_IDS.INVALID,
             data: {
-              type: typeAttr.value,
+              type: typeAttr.value.value,
             },
           });
         }

package/lib/rules/require-closing-tags.js

@@ -41,36 +41,24 @@ module.exports = {
       [MESSAGE_IDS.MISSING]: "Missing closing tag for {{tag}}.",
       [MESSAGE_IDS.MISSING_SELF]: "Missing self closing tag for {{tag}}",
       [MESSAGE_IDS.UNEXPECTED]: "Unexpected self closing tag for {{tag}}.",
+      [MESSAGE_IDS.HUCKS]: "HUCKS.",
     },
   },
 
   create(context) {
+    let svgStacks = [];
+
     const shouldSelfClose =
       context.options && context.options.length
         ? context.options[0].selfClosing === "always"
         : false;
 
-    const sourceCode = context.getSourceCode();
-    function getCodeIn(range) {
-      return sourceCode.text.slice(range[0], range[1]);
-    }
-
     function checkClosingTag(node) {
-      if (node.startTag && !node.endTag) {
-        if (
-          node.namespaceURI === "http://www.w3.org/2000/svg" ||
-          node.namespaceURI === "http://www.w3.org/1998/Math/MathML"
-        ) {
-          const code = getCodeIn(node.startTag.range);
-          const hasSelfClose = code.endsWith("/>");
-          if (hasSelfClose) {
-            return;
-          }
-        }
+      if (!node.close) {
         context.report({
-          node: node.startTag,
+          node: node,
           data: {
-            tag: node.tagName,
+            tag: node.name,
           },
           messageId: MESSAGE_IDS.MISSING,
         });
@@ -78,50 +66,47 @@ module.exports = {
     }
 
     function checkVoidElement(node) {
-      const startTag = node.startTag;
-      const code = getCodeIn(startTag.range);
-      const hasSelfClose = code.endsWith("/>");
-
+      const hasSelfClose = node.openEnd.value === "/>";
       if (shouldSelfClose && !hasSelfClose) {
         context.report({
-          node: startTag,
+          node: node.openEnd,
           data: {
-            tag: node.tagName,
+            tag: node.name,
           },
           messageId: MESSAGE_IDS.MISSING_SELF,
           fix(fixer) {
-            return fixer.replaceTextRange(
-              [startTag.range[1] - 1, startTag.range[1]],
-              " />"
-            );
+            return fixer.replaceText(node.openEnd, " />");
           },
         });
       }
       if (!shouldSelfClose && hasSelfClose) {
         context.report({
-          node: startTag,
+          node: node.openEnd,
           data: {
-            tag: node.tagName,
+            tag: node.name,
           },
           messageId: MESSAGE_IDS.UNEXPECTED,
           fix(fixer) {
-            return fixer.replaceTextRange(
-              [startTag.range[1] - 2, startTag.range[1]],
-              ">"
-            );
+            return fixer.replaceText(node.openEnd, ">");
           },
         });
       }
     }
 
     return {
-      "*"(node) {
-        if (node.startTag) {
-          if (VOID_ELEMENTS_SET.has(node.tagName)) {
-            checkVoidElement(node);
-          } else {
-            checkClosingTag(node);
-          }
+      Tag(node) {
+        if (node.name === "svg") {
+          svgStacks.push(node);
+        }
+        if (node.selfClosing || VOID_ELEMENTS_SET.has(node.name)) {
+          checkVoidElement(node);
+        } else if (node.openEnd.value !== "/>") {
+          checkClosingTag(node);
+        }
+      },
+      "Tag:exit"(node) {
+        if (node.name === "svg") {
+          svgStacks.push(node);
         }
       },
     };

package/lib/rules/require-doctype.js

@@ -31,7 +31,7 @@ module.exports = {
   create(context) {
     let hasDocType = false;
     return {
-      documentType() {
+      Doctype() {
         hasDocType = true;
       },
       "Program:exit"(node) {

package/lib/rules/require-frame-title.js

@@ -1,7 +1,3 @@
-/**
- * @typedef {import("../types").Rule} Rule
- */
-
 const { RULE_CATEGORY } = require("../constants");
 const { NodeUtils } = require("./utils");
 
@@ -10,9 +6,6 @@ const MESSAGE_IDS = {
   UNEXPECTED: "unexpected",
 };
 
-/**
- * @type {Rule}
- */
 module.exports = {
   meta: {
     type: "code",
@@ -33,15 +26,18 @@ module.exports = {
 
   create(context) {
     return {
-      "Frame, Iframe"(node) {
+      Tag(node) {
+        if (node.name !== "frame" && node.name !== "iframe") {
+          return;
+        }
         const title = NodeUtils.findAttr(node, "title");
         if (!title) {
           context.report({
-            node: node.startTag,
-            data: { frame: `<${node.tagName}>` },
+            node: node.openStart,
+            data: { frame: `<${node.name}>` },
             messageId: MESSAGE_IDS.MISSING,
           });
-        } else if (title.value.trim().length === 0) {
+        } else if (!title.value || title.value.value.trim().length === 0) {
           context.report({
             node: title,
             messageId: MESSAGE_IDS.UNEXPECTED,