@html-eslint/eslint-plugin 0.28.0-alpha.0 → 0.28.0

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

@@ -15,6 +15,7 @@
 
 const { RULE_CATEGORY } = require("../constants");
 const { getLocBetween } = require("./utils/node");
+const { createVisitors } = require("./utils/visitors");
 
 const MESSAGE_IDS = {
   EXTRA_BETWEEN: "unexpectedBetween",
@@ -182,125 +183,128 @@ module.exports = {
         }
       }
     }
+    /**
+     * @param {TagNode | StyleTagNode | ScriptTagNode} node
+     * @returns
+     */
+    function check(node) {
+      if (!node.attributes) {
+        return;
+      }
 
-    return {
-      /**
-       * @param {TagNode | StyleTagNode | ScriptTagNode} node
-       * @returns
-       */
-      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
-        if (!node.attributes) {
-          return;
-        }
-
-        if (node.attributes.length) {
-          checkExtraSpaceBefore(node.openStart, node.attributes[0]);
+      if (node.attributes.length) {
+        checkExtraSpaceBefore(node.openStart, node.attributes[0]);
 
-          for (const attr of node.attributes) {
-            if (attr.startWrapper && attr.value) {
-              if (
-                disallowInAssignment &&
-                attr.startWrapper.loc.start.column - attr.key.loc.end.column > 1
-              ) {
-                const start = attr.key.range[1];
-                const end = attr.startWrapper.range[0];
-                context.report({
-                  node: attr,
-                  messageId: MESSAGE_IDS.EXTRA_IN_ASSIGNMENT,
-                  fix(fixer) {
-                    return fixer.replaceTextRange([start, end], `=`);
-                  },
-                });
-              }
+        for (const attr of node.attributes) {
+          if (attr.startWrapper && attr.value) {
+            if (
+              disallowInAssignment &&
+              attr.startWrapper.loc.start.column - attr.key.loc.end.column > 1
+            ) {
+              const start = attr.key.range[1];
+              const end = attr.startWrapper.range[0];
+              context.report({
+                node: attr,
+                messageId: MESSAGE_IDS.EXTRA_IN_ASSIGNMENT,
+                fix(fixer) {
+                  return fixer.replaceTextRange([start, end], `=`);
+                },
+              });
             }
           }
         }
+      }
 
-        if (node.openEnd) {
-          checkExtraSpacesBetweenAttrs(node.attributes);
+      if (node.openEnd) {
+        checkExtraSpacesBetweenAttrs(node.attributes);
 
-          const lastAttr = node.attributes[node.attributes.length - 1];
-          const nodeBeforeEnd =
-            node.attributes.length === 0 ? node.openStart : lastAttr;
+        const lastAttr = node.attributes[node.attributes.length - 1];
+        const nodeBeforeEnd =
+          node.attributes.length === 0 ? node.openStart : lastAttr;
 
-          if (nodeBeforeEnd.loc.end.line !== node.openEnd.loc.start.line) {
-            return;
-          }
+        if (nodeBeforeEnd.loc.end.line !== node.openEnd.loc.start.line) {
+          return;
+        }
 
-          const isSelfClosing = node.openEnd.value === "/>";
+        const isSelfClosing = node.openEnd.value === "/>";
 
-          const spacesBetween =
-            node.openEnd.loc.start.column - nodeBeforeEnd.loc.end.column;
-          const locBetween = getLocBetween(nodeBeforeEnd, node.openEnd);
+        const spacesBetween =
+          node.openEnd.loc.start.column - nodeBeforeEnd.loc.end.column;
+        const locBetween = getLocBetween(nodeBeforeEnd, node.openEnd);
 
-          if (isSelfClosing && enforceBeforeSelfClose) {
-            if (spacesBetween < 1) {
-              context.report({
-                loc: locBetween,
-                messageId: MESSAGE_IDS.MISSING_BEFORE_SELF_CLOSE,
-                fix(fixer) {
-                  return fixer.insertTextAfter(nodeBeforeEnd, " ");
-                },
-              });
-            } else if (spacesBetween === 1) {
-              if (
-                disallowTabs &&
-                sourceCode[node.openEnd.range[0] - 1] === `\t`
-              ) {
-                context.report({
-                  loc: node.openEnd.loc,
-                  messageId: MESSAGE_IDS.EXTRA_TAB_BEFORE_SELF_CLOSE,
-                  fix(fixer) {
-                    return fixer.replaceTextRange(
-                      [node.openEnd.range[0] - 1, node.openEnd.range[0]],
-                      ` `
-                    );
-                  },
-                });
-              }
-            } else {
+        if (isSelfClosing && enforceBeforeSelfClose) {
+          if (spacesBetween < 1) {
+            context.report({
+              loc: locBetween,
+              messageId: MESSAGE_IDS.MISSING_BEFORE_SELF_CLOSE,
+              fix(fixer) {
+                return fixer.insertTextAfter(nodeBeforeEnd, " ");
+              },
+            });
+          } else if (spacesBetween === 1) {
+            if (
+              disallowTabs &&
+              sourceCode[node.openEnd.range[0] - 1] === `\t`
+            ) {
               context.report({
-                loc: locBetween,
-                messageId: MESSAGE_IDS.EXTRA_BEFORE_SELF_CLOSE,
+                loc: node.openEnd.loc,
+                messageId: MESSAGE_IDS.EXTRA_TAB_BEFORE_SELF_CLOSE,
                 fix(fixer) {
-                  return fixer.removeRange([
-                    nodeBeforeEnd.range[1] + 1,
-                    node.openEnd.range[0],
-                  ]);
+                  return fixer.replaceTextRange(
+                    [node.openEnd.range[0] - 1, node.openEnd.range[0]],
+                    ` `
+                  );
                 },
               });
             }
-
-            return;
+          } else {
+            context.report({
+              loc: locBetween,
+              messageId: MESSAGE_IDS.EXTRA_BEFORE_SELF_CLOSE,
+              fix(fixer) {
+                return fixer.removeRange([
+                  nodeBeforeEnd.range[1] + 1,
+                  node.openEnd.range[0],
+                ]);
+              },
+            });
           }
 
-          if (spacesBetween > 0) {
-            if (node.attributes.length > 0) {
-              context.report({
-                loc: locBetween,
-                messageId: MESSAGE_IDS.EXTRA_AFTER,
-                fix(fixer) {
-                  return fixer.removeRange([
-                    lastAttr.range[1],
-                    node.openEnd.range[0],
-                  ]);
-                },
-              });
-            } else {
-              context.report({
-                loc: locBetween,
-                messageId: MESSAGE_IDS.EXTRA_BEFORE_CLOSE,
-                fix(fixer) {
-                  return fixer.removeRange([
-                    node.openStart.range[1],
-                    node.openEnd.range[0],
-                  ]);
-                },
-              });
-            }
+          return;
+        }
+
+        if (spacesBetween > 0) {
+          if (node.attributes.length > 0) {
+            context.report({
+              loc: locBetween,
+              messageId: MESSAGE_IDS.EXTRA_AFTER,
+              fix(fixer) {
+                return fixer.removeRange([
+                  lastAttr.range[1],
+                  node.openEnd.range[0],
+                ]);
+              },
+            });
+          } else {
+            context.report({
+              loc: locBetween,
+              messageId: MESSAGE_IDS.EXTRA_BEFORE_CLOSE,
+              fix(fixer) {
+                return fixer.removeRange([
+                  node.openStart.range[1],
+                  node.openEnd.range[0],
+                ]);
+              },
+            });
           }
         }
-      },
-    };
+      }
+    }
+
+    return createVisitors(context, {
+      Tag: check,
+      StyleTag: check,
+      ScriptTag: check,
+    });
   },
 };

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

@@ -1,12 +1,18 @@
 /**
  * @typedef { import("../types").RuleModule } RuleModule
- * @typedef { import("../types").ProgramNode } ProgramNode
  * @typedef { import("es-html-parser").CommentContentNode } CommentContentNode
+ * @typedef { import("es-html-parser").TagNode } TagNode
+ * @typedef { import("es-html-parser").CommentNode } CommentNode
  * @typedef { import("../types").ContentNode } ContentNode
- * @typedef { import("../types").TextNode } TextNode
+ * @typedef { import("es-html-parser").TextNode } TextNode
+ * @typedef { import("../types").LineNode } LineNode
+ * @typedef { import("../types").Range } Range
  */
 
 const { RULE_CATEGORY } = require("../constants");
+const { isTag, isOverlapWithTemplates } = require("./utils/node");
+const { getSourceCode } = require("./utils/source-code");
+const { createVisitors } = require("./utils/visitors");
 
 const MESSAGE_IDS = {
   UNEXPECTED: "unexpected",
@@ -48,39 +54,36 @@ module.exports = {
 
   create(context) {
     const options = context.options[0] || {};
+    /**
+     * @type {string[]}
+     */
     const skipTags = options.skip || [];
-    const sourceCode = context.getSourceCode();
+    const sourceCode = getSourceCode(context);
+    /**
+     * @type {TagNode[]}
+     */
+    const tagStack = [];
 
     /**
-     * @param {Array<ContentNode>} siblings
+     * @param {CommentNode | TextNode} node
+     * @returns {boolean}
      */
-    function checkSiblings(siblings) {
-      for (
-        let length = siblings.length, index = 0;
-        index < length;
-        index += 1
+    function hasSkipTagOnParent(node) {
+      // @ts-ignore
+      const parent = node.parent;
+      if (
+        parent &&
+        // @ts-ignore
+        isTag(parent) &&
+        skipTags.some((skipTag) => skipTag === parent.name)
       ) {
-        const node = siblings[index];
-
-        if (node.type === `Tag` && skipTags.includes(node.name) === false) {
-          checkSiblings(node.children);
-        } else if (node.type === `Text`) {
-          stripConsecutiveSpaces(node);
-        } else if (node.type === `Comment`) {
-          stripConsecutiveSpaces(node.value);
-        }
+        return true;
       }
+      return false;
     }
 
-    return {
-      Program(node) {
-        // @ts-ignore
-        checkSiblings(node.body);
-      },
-    };
-
     /**
-     * @param {TextNode | CommentContentNode} node
+     * @param {CommentContentNode | TextNode} node
      */
     function stripConsecutiveSpaces(node) {
       const text = node.value;
@@ -97,6 +100,15 @@ module.exports = {
         const indexStart = node.range[0] + matcher.lastIndex - space.length;
         const indexEnd = indexStart + space.length;
 
+        const hasOverlap = isOverlapWithTemplates(node.templates, [
+          indexStart,
+          indexEnd,
+        ]);
+
+        if (hasOverlap) {
+          return;
+        }
+
         context.report({
           node: node,
           loc: {
@@ -113,5 +125,33 @@ module.exports = {
         });
       }
     }
+
+    return createVisitors(context, {
+      Comment(node) {
+        if (hasSkipTagOnParent(node)) {
+          return;
+        }
+        stripConsecutiveSpaces(node.value);
+      },
+      Text(node) {
+        if (hasSkipTagOnParent(node)) {
+          return;
+        }
+        stripConsecutiveSpaces(node);
+      },
+      Tag(node) {
+        tagStack.push(node);
+        if (
+          skipTags.some((skipTag) =>
+            tagStack.some((tag) => tag.name === skipTag)
+          )
+        ) {
+          return;
+        }
+      },
+      "Tag:exit"() {
+        tagStack.pop();
+      },
+    });
   },
 };

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

@@ -5,12 +5,7 @@
 
 const { RULE_CATEGORY } = require("../constants");
 const { findAttr } = require("./utils/node");
-const { parse } = require("@html-eslint/template-parser");
-const {
-  shouldCheckTaggedTemplateExpression,
-  shouldCheckTemplateLiteral,
-} = require("./utils/settings");
-const { getSourceCode } = require("./utils/source-code");
+const { createVisitors } = require("./utils/visitors");
 const MESSAGE_IDS = {
   INLINE_STYLE: "unexpectedInlineStyle",
 };
@@ -36,10 +31,7 @@ module.exports = {
   },
 
   create(context) {
-    /**
-     * @type {RuleListener}
-     */
-    const visitors = {
+    return createVisitors(context, {
       Tag(node) {
         const styleAttr = findAttr(node, "style");
         if (styleAttr) {
@@ -49,20 +41,6 @@ module.exports = {
           });
         }
       },
-    };
-
-    return {
-      ...visitors,
-      TaggedTemplateExpression(node) {
-        if (shouldCheckTaggedTemplateExpression(node, context)) {
-          parse(node.quasi, getSourceCode(context), visitors);
-        }
-      },
-      TemplateLiteral(node) {
-        if (shouldCheckTemplateLiteral(node, context)) {
-          parse(node, getSourceCode(context), visitors);
-        }
-      },
-    };
+    });
   },
 };

package/lib/rules/no-multiple-empty-lines.js

@@ -1,9 +1,23 @@
 /**
  * @typedef { import("../types").RuleModule } RuleModule
- * @typedef { import("../types").ProgramNode } ProgramNode
+ * @typedef { import("es-html-parser").DocumentNode } DocumentNode
+ * @typedef { import("es-html-parser").AnyToken } AnyToken
+ * @typedef { import("es-html-parser").CommentContentNode } CommentContentNode
+ * @typedef { import("es-html-parser").TextNode } TextNode
  */
 
+const { parse } = require("@html-eslint/template-parser");
 const { RULE_CATEGORY } = require("../constants");
+const {
+  shouldCheckTaggedTemplateExpression,
+  shouldCheckTemplateLiteral,
+} = require("./utils/settings");
+const { getSourceCode } = require("./utils/source-code");
+const {
+  codeToLines,
+  isRangesOverlap,
+  getTemplateTokens,
+} = require("./utils/node");
 
 const MESSAGE_IDS = {
   UNEXPECTED: "unexpected",
@@ -42,52 +56,90 @@ module.exports = {
   },
 
   create(context) {
-    const sourceCode = context.getSourceCode();
-    const lines = sourceCode.lines;
     const max = context.options.length ? context.options[0].max : 2;
-    return {
-      /**
-       * @param {ProgramNode} node
-       */
-      "Program:exit"(node) {
-        /** @type {number[]} */
-        const nonEmptyLineNumbers = [];
+    const sourceCode = getSourceCode(context);
 
-        lines.forEach((line, index) => {
-          if (line.trim().length > 0) {
-            nonEmptyLineNumbers.push(index + 1);
-          }
-        });
+    /**
+     * @param {string[]} lines
+     * @param {number} lineOffset
+     * @param {((CommentContentNode | TextNode)['templates'][number])[]} tokens
+     */
+    function check(lines, lineOffset, tokens) {
+      /** @type {number[]} */
+      const nonEmptyLineNumbers = [];
 
-        nonEmptyLineNumbers.forEach((current, index, arr) => {
-          const before = arr[index - 1];
-          if (typeof before === "number") {
-            if (current - before - 1 > max) {
-              context.report({
-                node,
-                loc: {
-                  start: { line: before, column: 0 },
-                  end: { line: current, column: 0 },
-                },
-                messageId: MESSAGE_IDS.UNEXPECTED,
-                data: {
-                  max,
-                },
-                fix(fixer) {
-                  const start = sourceCode.getIndexFromLoc({
-                    line: before + 1,
-                    column: 0,
-                  });
-                  const end = sourceCode.getIndexFromLoc({
-                    line: current - max,
-                    column: 0,
-                  });
-                  return fixer.removeRange([start, end]);
-                },
-              });
+      lines.forEach((line, index) => {
+        if (line.trim().length > 0) {
+          nonEmptyLineNumbers.push(index + lineOffset);
+        }
+      });
+
+      nonEmptyLineNumbers.forEach((current, index, arr) => {
+        const before = arr[index - 1];
+        if (typeof before === "number") {
+          if (current - before - 1 > max) {
+            const start = sourceCode.getIndexFromLoc({
+              line: before + 1,
+              column: 0,
+            });
+            const end = sourceCode.getIndexFromLoc({
+              line: current - max,
+              column: 0,
+            });
+            if (
+              tokens.some((token) => isRangesOverlap(token.range, [start, end]))
+            ) {
+              return;
             }
+
+            context.report({
+              loc: {
+                start: { line: before, column: 0 },
+                end: { line: current, column: 0 },
+              },
+              messageId: MESSAGE_IDS.UNEXPECTED,
+              data: {
+                max,
+              },
+              fix(fixer) {
+                return fixer.removeRange([start, end]);
+              },
+            });
           }
-        });
+        }
+      });
+    }
+    return {
+      "Document:exit"() {
+        check(sourceCode.lines, 1, []);
+      },
+      TaggedTemplateExpression(node) {
+        if (shouldCheckTaggedTemplateExpression(node, context)) {
+          const { html, tokens } = parse(
+            node.quasi,
+            getSourceCode(context),
+            {}
+          );
+          const lines = codeToLines(html);
+          check(
+            lines,
+            // @ts-ignore
+            node.quasi.loc.start.line,
+            getTemplateTokens(tokens)
+          );
+        }
+      },
+      TemplateLiteral(node) {
+        if (shouldCheckTemplateLiteral(node, context)) {
+          const { html, tokens } = parse(node, getSourceCode(context), {});
+          const lines = codeToLines(html);
+          check(
+            lines,
+            // @ts-ignore
+            node.loc.start.line,
+            getTemplateTokens(tokens)
+          );
+        }
       },
     };
   },

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

@@ -41,7 +41,7 @@ module.exports = {
           h1s.push(node);
         }
       },
-      "Program:exit"() {
+      "Document:exit"() {
         if (h1s.length > 1) {
           h1s.forEach((h1) => {
             context.report({

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

@@ -3,6 +3,7 @@
  */
 
 const { RULE_CATEGORY, OBSOLETE_TAGS } = require("../constants");
+const { createVisitors } = require("./utils/visitors");
 
 const OBSOLETE_TAGS_SET = new Set(OBSOLETE_TAGS);
 
@@ -31,7 +32,7 @@ module.exports = {
   },
 
   create(context) {
-    return {
+    return createVisitors(context, {
       Tag(node) {
         if (OBSOLETE_TAGS_SET.has(node.name)) {
           context.report({
@@ -43,6 +44,6 @@ module.exports = {
           });
         }
       },
-    };
+    });
   },
 };

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

@@ -7,6 +7,7 @@
 
 const { RULE_CATEGORY } = require("../constants");
 const { findAttr } = require("./utils/node");
+const { createVisitors } = require("./utils/visitors");
 
 const MESSAGE_IDS = {
   UNEXPECTED: "unexpected",
@@ -33,23 +34,28 @@ module.exports = {
   },
 
   create(context) {
-    return {
-      /**
-       * @param {TagNode | StyleTagNode | ScriptTagNode} node
-       */
-      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
-        const tabIndexAttr = findAttr(node, "tabindex");
-        if (
-          tabIndexAttr &&
-          tabIndexAttr.value &&
-          parseInt(tabIndexAttr.value.value, 10) > 0
-        ) {
-          context.report({
-            node: tabIndexAttr,
-            messageId: MESSAGE_IDS.UNEXPECTED,
-          });
-        }
-      },
-    };
+    /**
+     * @param {TagNode | StyleTagNode | ScriptTagNode} node
+     */
+    function check(node) {
+      const tabIndexAttr = findAttr(node, "tabindex");
+      if (
+        tabIndexAttr &&
+        tabIndexAttr.value &&
+        !tabIndexAttr.value.templates.length &&
+        parseInt(tabIndexAttr.value.value, 10) > 0
+      ) {
+        context.report({
+          node: tabIndexAttr,
+          messageId: MESSAGE_IDS.UNEXPECTED,
+        });
+      }
+    }
+
+    return createVisitors(context, {
+      Tag: check,
+      StyleTag: check,
+      ScriptTag: check,
+    });
   },
 };