@html-eslint/eslint-plugin 0.13.2 → 0.14.0

package/lib/rules/element-newline.js

@@ -1,10 +1,4 @@
-/**
- * @typedef {import("../types").ElementNode} ElementNode
- * @typedef {import("../types").AnyNode} AnyNode
- * @typedef {import("../types").Context} Context
- */
-
-const { RULE_CATEGORY, NODE_TYPES } = require("../constants");
+const { RULE_CATEGORY } = require("../constants");
 
 const MESSAGE_IDS = {
   EXPECT_NEW_LINE_AFTER: "expectAfter",
@@ -31,13 +25,10 @@ module.exports = {
     },
   },
 
-  /**
-   * @param {Context} context
-   */
   create(context) {
     function checkSiblings(siblings) {
       siblings
-        .filter((node) => node.type !== NODE_TYPES.TEXT && node.range[0])
+        .filter((node) => node.type !== "Text")
         .forEach((current, index, arr) => {
           const after = arr[index + 1];
           if (after) {
@@ -45,7 +36,7 @@ module.exports = {
               context.report({
                 node: current,
                 messageId: MESSAGE_IDS.EXPECT_NEW_LINE_AFTER,
-                data: { tag: `<${current.tagName}>` },
+                data: { tag: `<${current.name}>` },
                 fix(fixer) {
                   return fixer.insertTextAfter(current, "\n");
                 },
@@ -55,75 +46,49 @@ module.exports = {
         });
     }
 
-    /**
-     *
-     * @param {ElementNode['childNodes'][number]} node
-     */
-    function checkChild(node) {
-      const children = (node.childNodes || []).filter(
-        (n) => !!n.range[0] && n.type !== NODE_TYPES.TEXT
-      );
-      const first = children[0];
-      const last = children[children.length - 1];
+    function checkChild(node, children) {
+      const targetChildren = children.filter((n) => n.type !== "Text");
+      const first = targetChildren[0];
+      const last = targetChildren[targetChildren.length - 1];
       if (first) {
-        if (node.startTag && isOnTheSameLine(node.startTag, first)) {
+        if (isOnTheSameLine(node.openEnd, first)) {
           context.report({
-            node: node.startTag,
+            node: node.openEnd,
             messageId: MESSAGE_IDS.EXPECT_NEW_LINE_AFTER,
-            data: { tag: `<${node.tagName}>` },
+            data: { tag: `<${node.name}>` },
             fix(fixer) {
-              if (node.startTag) {
-                return fixer.insertTextAfter(node.startTag, "\n");
-              }
-              return null;
+              return fixer.insertTextAfter(node.openEnd, "\n");
             },
           });
         }
       }
+
       if (last) {
-        if (node.endTag && isOnTheSameLine(node.endTag, last)) {
+        if (node.close && isOnTheSameLine(node.close, last)) {
           context.report({
-            node: node.endTag,
+            node: node.close,
             messageId: MESSAGE_IDS.EXPECT_NEW_LINE_BEFORE,
-            data: { tag: `</${node.tagName}>` },
+            data: { tag: `</${node.name}>` },
             fix(fixer) {
-              if (node.endTag) {
-                return fixer.insertTextBefore(node.endTag, "\n");
-              }
-              return null;
+              return fixer.insertTextBefore(node.close, "\n");
             },
           });
         }
       }
     }
     return {
-      /**
-       * @param {ElementNode} node
-       */
-      "*"(node) {
-        if (node.type !== NODE_TYPES.TEXT) {
-          checkSiblings(node.childNodes || []);
-          checkChild(node);
-        }
+      [["Tag", "StyleTag", "ScriptTag", "Program"].join(",")](node) {
+        const children = node.type === "Program" ? node.body : node.children;
+        checkSiblings(children);
+        checkChild(node, children);
       },
     };
   },
 };
 
-/**
- * Checks whether two nodes are on the same line or not.
- * @param {AnyNode} nodeBefore A node before
- * @param {AnyNode} nodeAfter  A node after
- * @returns {boolean} `true` if two nodes are on the same line, otherwise `false`.
- */
 function isOnTheSameLine(nodeBefore, nodeAfter) {
   if (nodeBefore && nodeAfter) {
-    // @ts-ignore
-    if (nodeBefore.endTag) {
-      // @ts-ignore
-      return nodeBefore.endTag.loc.end.line === nodeAfter.loc.start.line;
-    }
-    return nodeBefore.loc.start.line === nodeAfter.loc.start.line;
+    return nodeBefore.loc.end.line === nodeAfter.loc.start.line;
   }
   return false;
 }

package/lib/rules/id-naming-convention.js

@@ -58,12 +58,15 @@ module.exports = {
 
     return {
       "*"(node) {
+        if (!node.attributes || node.attributes.length <= 0) {
+          return;
+        }
         const idAttr = NodeUtils.findAttr(node, "id");
-        if (idAttr && idAttr.value && !checkNaming(idAttr.value)) {
+        if (idAttr && idAttr.value && !checkNaming(idAttr.value.value)) {
           context.report({
             node: idAttr,
             data: {
-              actual: idAttr.value,
+              actual: idAttr.value.value,
               convention,
             },
             messageId: MESSAGE_IDS.WRONG,

package/lib/rules/indent.js

@@ -1,10 +1,11 @@
 /**
  * @typedef {import("../types").Rule} Rule
- * @typedef {import("../types").ElementNode} ElementNode
- * @typedef {import("../types").AttrNode} AttrNode
  * @typedef {import("../types").TagNode} TagNode
- * @typedef {import("../types").AnyNode} AnyNode
  * @typedef {import("../types").BaseNode} BaseNode
+ * @typedef {import("../types").OpenTagStartNode} OpenTagStartNode
+ * @typedef {import("../types").CloseTagNode} CloseTagNode
+ * @typedef {import("../types").LineNode} LineNode
+ *@typedef {import("../types").AnyNode} AnyNode
  * @typedef {Object} IndentType
  * @property {"tab"} TAB
  * @property {"space"} SPACE
@@ -12,7 +13,7 @@
  * @typedef {Object} MessageId
  * @property {"wrongIndent"} WRONG_INDENT
  */
-const { RULE_CATEGORY, NODE_TYPES } = require("../constants");
+const { RULE_CATEGORY } = require("../constants");
 const { NodeUtils } = require("./utils");
 
 /** @type {MessageId} */
@@ -26,12 +27,7 @@ const INDENT_TYPES = {
   SPACE: "space",
 };
 
-const IGNORING_NODES = [
-  NODE_TYPES.PRE,
-  NODE_TYPES.SCRIPT,
-  NODE_TYPES.STYLE,
-  NODE_TYPES.XMP,
-];
+const IGNORING_NODES = ["pre", "xmp", "script", "style"];
 
 /**
  * @type {Rule}
@@ -67,219 +63,209 @@ module.exports = {
   },
   create(context) {
     const sourceCode = context.getSourceCode();
+    let indentLevel = -1;
+    let parentIgnoringChildCount = 0;
 
-    const indentLevel = new IndentLevel();
-    const { indentType, indentSize } = getIndentTypeAndSize(context.options);
-    const indentUnit =
-      indentType === INDENT_TYPES.SPACE ? " ".repeat(indentSize) : "\t";
+    const { indentType, indentSize, indentChar } = (function () {
+      const options = context.options;
+      /**
+       * @type {IndentType['SPACE'] | IndentType['TAB']}
+       */
+      let indentType = INDENT_TYPES.SPACE;
+      let indentSize = 4;
+      if (options.length) {
+        if (options[0] === INDENT_TYPES.TAB) {
+          indentType = INDENT_TYPES.TAB;
+        } else {
+          indentSize = options[0];
+        }
+      }
+      const indentChar =
+        indentType === INDENT_TYPES.SPACE ? " ".repeat(indentSize) : "\t";
+      return { indentType, indentSize, indentChar };
+    })();
+
+    function indent() {
+      indentLevel++;
+    }
+    function unindent() {
+      indentLevel--;
+    }
 
     /**
      * @param {string} str
+     * @returns {number}
      */
-    function countIndentSize(str) {
+    function countLeftPadding(str) {
       return str.length - str.replace(/^[\s\t]+/, "").length;
     }
 
     /**
-     * @param {BaseNode} node
+     * @param {AnyNode} node
+     * @returns {node is LineNode}
      */
-    function getLineCodeBefore(node) {
-      const lines = sourceCode.getLines();
-      const line = lines[node.loc.start.line - 1];
-      let end = node.loc.start.column;
-      // @ts-ignore
-      if (typeof node.textLine === "string") {
-        // @ts-ignore
-        end += countIndentSize(node.textLine);
-      }
-
-      return line.slice(0, end);
+    function isLineNode(node) {
+      return node.type === "Line";
     }
 
     /**
-     * @param {BaseNode} node
-     * @param {BaseNode} [nodeToReport]
+     * @param {AnyNode} node
+     * @returns {string}
      */
-    function checkIndent(node, nodeToReport) {
-      const codeBefore = getLineCodeBefore(node);
-      if (codeBefore.trim().length === 0) {
-        const level = indentLevel.get();
-        const expectedIndent = indentUnit.repeat(level);
-        if (codeBefore !== expectedIndent) {
-          const expected = `${
-            indentType === INDENT_TYPES.SPACE ? level * indentSize : level
-          } ${indentType}`;
-          const actualTabs = (codeBefore.match(/\t/g) || []).length;
-          const actualSpaces = (codeBefore.match(/[^\S\t\n\r]/g) || []).length;
-
-          let actual = "";
-
-          if (!actualTabs && !actualSpaces) {
-            actual = "no indent";
-          }
-          if (actualTabs) {
-            actual += `${actualTabs} ${INDENT_TYPES.TAB}`;
-          }
-          if (actualSpaces) {
-            actual += `${actual.length ? ", " : ""}${actualSpaces} ${
-              INDENT_TYPES.SPACE
-            }`;
-          }
+    function getActualIndent(node) {
+      const lines = sourceCode.getLines();
+      const line = lines[node.loc.start.line - 1];
+      let column = node.loc.start.column;
 
-          context.report({
-            node: nodeToReport || node,
-            messageId: MESSAGE_ID.WRONG_INDENT,
-            data: {
-              expected,
-              actual,
-            },
-            fix(fixer) {
-              const start = node.range[0] - node.loc.start.column;
-              let end = node.range[0];
-              // @ts-ignore
-              if (node.textLine) {
-                end += codeBefore.length;
-              }
-              return fixer.replaceTextRange([start, end], expectedIndent);
-            },
-          });
-        }
+      if (isLineNode(node)) {
+        column += countLeftPadding(node.value);
       }
+
+      return line.slice(0, column);
     }
 
     /**
-     * @param {AnyNode} startTag
-     * @param {AttrNode[]} attrs
+     * @returns {string}
      */
-    function checkAttrsIndent(startTag, attrs) {
-      attrs.forEach((attr) => {
-        if (attr.loc.start.line !== startTag.loc.start.line) {
-          checkIndent(attr);
-        }
-      });
+    function getExpectedIndent() {
+      return indentChar.repeat(indentLevel);
     }
 
     /**
-     * @param {BaseNode} startTag
+     * @param {AnyNode} node
+     * @param {string} actualIndent
+     * @return {BaseNode}
      */
-    function checkEndOfStartTag(startTag) {
-      const start = startTag.range[1] - 1;
-      const end = startTag.range[1];
-      const line = startTag.loc.end.line;
-      const endCol = startTag.loc.end.column;
-      const startCol = startTag.loc.end.column - 1;
+    function getIndentNodeToReport(node, actualIndent) {
+      let rangeStart = node.range[0];
+
+      if (node.type !== "Line") {
+        rangeStart -= actualIndent.length;
+      }
 
-      checkIndent({
-        range: [start, end],
-        start,
-        end,
+      return {
+        range: [rangeStart, rangeStart + actualIndent.length],
         loc: {
           start: {
-            line,
-            column: startCol,
+            column: 0,
+            line: node.loc.start.line,
           },
           end: {
-            line,
-            column: endCol,
+            column: actualIndent.length,
+            line: node.loc.start.line,
           },
         },
-      });
+      };
     }
-    let nodesToIgnoreChildren = [];
-    return {
-      /**
-       * @param {ElementNode} node
-       */
-      "*"(node) {
-        if (IGNORING_NODES.includes(node.type)) {
-          nodesToIgnoreChildren.push(node);
-          return;
+
+    /**
+     * @param {string} actualIndent
+     * @param {number} expectedIndentSize
+     */
+    function getMessageData(actualIndent, expectedIndentSize) {
+      const actualTabs = (actualIndent.match(/\t/g) || []).length;
+      const actualSpaces = (actualIndent.match(/[^\S\t\n\r]/g) || []).length;
+      let actual = "";
+      if (!actualTabs && !actualSpaces) {
+        actual = "no indent";
+      } else {
+        if (actualTabs) {
+          actual += `${actualTabs} tab`;
         }
-        if (nodesToIgnoreChildren.length) {
-          return;
+        if (actualSpaces) {
+          if (actual) {
+            actual += ", ";
+          }
+          actual += `${actualSpaces} space`;
         }
+      }
 
-        indentLevel.up();
+      if (indentType === "space") {
+        expectedIndentSize *= indentSize;
+      }
 
-        if (node.startTag && Array.isArray(node.attrs)) {
-          checkAttrsIndent(node.startTag, node.attrs);
-        }
+      return {
+        actual,
+        expected: `${expectedIndentSize} ${indentType}`,
+      };
+    }
 
-        (node.childNodes || []).forEach((current) => {
-          if (current.startTag) {
-            checkIndent(current.startTag);
-          }
-          if (current.endTag) {
-            checkIndent(current.endTag);
-          }
+    /**
+     * @param {AnyNode} node
+     */
+    function checkIndent(node) {
+      if (parentIgnoringChildCount > 0) {
+        return;
+      }
+      const actualIndent = getActualIndent(node);
+      const expectedIndent = getExpectedIndent();
+      if (actualIndent.trim().length) {
+        return;
+      }
+      if (actualIndent !== expectedIndent) {
+        const targetNode = getIndentNodeToReport(node, actualIndent);
+        context.report({
+          node: targetNode,
+          messageId: MESSAGE_ID.WRONG_INDENT,
+          data: getMessageData(actualIndent, indentLevel),
+          fix(fixer) {
+            return fixer.replaceText(targetNode, expectedIndent);
+          },
         });
+      }
+    }
 
-        if (
-          (NodeUtils.isTextNode(node) || NodeUtils.isCommentNode(node)) &&
-          node.lineNodes &&
-          node.lineNodes.length
-        ) {
-          if (!node.startTag) {
-            indentLevel.down();
-          }
-          node.lineNodes.forEach((lineNode) => {
-            if (lineNode.textLine.trim().length) {
-              checkIndent(lineNode);
-            }
-          });
-          if (!node.startTag) {
-            indentLevel.up();
-          }
+    return {
+      // Tag
+      Tag(node) {
+        if (IGNORING_NODES.includes(node.name)) {
+          parentIgnoringChildCount++;
         }
+        indent();
       },
-      "*:exit"(node) {
-        if (IGNORING_NODES.includes(node.type)) {
-          nodesToIgnoreChildren.pop();
-          return;
-        }
-        if (nodesToIgnoreChildren.length) {
-          return;
+      OpenTagStart: checkIndent,
+      OpenTagEnd: checkIndent,
+      CloseTag: checkIndent,
+      "Tag:exit"(node) {
+        if (IGNORING_NODES.includes(node.name)) {
+          parentIgnoringChildCount--;
         }
-        indentLevel.down();
+        unindent();
+      },
 
-        if (node.startTag) {
-          checkEndOfStartTag(node.startTag);
-        }
+      // Attribute
+      Attribute: indent,
+      AttributeKey: checkIndent,
+      AttributeValue: checkIndent,
+      "Attribute:exit": unindent,
+
+      // Text
+      Text(node) {
+        indent();
+        const lineNodes = NodeUtils.splitToLineNodes(node);
+        lineNodes.forEach((lineNode) => {
+          if (lineNode.value.trim().length) {
+            checkIndent(lineNode);
+          }
+        });
       },
+      "Text:exit": unindent,
+
+      // Comment
+      Comment: indent,
+      CommentOpen: checkIndent,
+      CommentContent(node) {
+        indent();
+        const lineNodes = NodeUtils.splitToLineNodes(node);
+        lineNodes.forEach((lineNode) => {
+          if (lineNode.value.trim().length) {
+            checkIndent(lineNode);
+          }
+        });
+      },
+      CommentClose: checkIndent,
+      "Comment:exit": unindent,
+      "CommentContent:exit": unindent,
     };
   },
 };
-
-function getIndentTypeAndSize(options) {
-  /**
-   * @type {IndentType['SPACE'] | IndentType['TAB']}
-   */
-  let indentType = INDENT_TYPES.SPACE;
-  let indentSize = 4;
-  if (options.length) {
-    if (options[0] === INDENT_TYPES.TAB) {
-      indentType = INDENT_TYPES.TAB;
-    } else {
-      indentSize = options[0];
-    }
-  }
-  return { indentType, indentSize };
-}
-
-class IndentLevel {
-  constructor() {
-    this.level = -1;
-  }
-
-  up() {
-    this.level++;
-  }
-
-  down() {
-    this.level--;
-  }
-
-  get() {
-    return this.level;
-  }
-}

package/lib/rules/no-abstract-roles.js

@@ -46,10 +46,10 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
+      [["Tag", "ScriptTag", "StyleTag"].join(",")](node) {
         const roleAttr = NodeUtils.findAttr(node, "role");
         if (roleAttr) {
-          if (ABSTRACT_ROLE_SET.has(roleAttr.value)) {
+          if (roleAttr.value && ABSTRACT_ROLE_SET.has(roleAttr.value.value)) {
             context.report({
               messageId: MESSAGE_IDS.UNEXPECTED,
               node: roleAttr,

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

@@ -31,7 +31,7 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
+      [["Tag", "ScriptTag", "StyleTag"].join(",")](node) {
         const accessKeyAttr = NodeUtils.findAttr(node, "accesskey");
         if (accessKeyAttr) {
           context.report({

package/lib/rules/no-aria-hidden-body.js

@@ -32,13 +32,21 @@ module.exports = {
 
   create(context) {
     return {
-      Body(node) {
+      Tag(node) {
+        if (node.name !== "body") {
+          return;
+        }
         const ariaHiddenAttr = NodeUtils.findAttr(node, "aria-hidden");
-        if (ariaHiddenAttr && ariaHiddenAttr.value !== "false") {
-          context.report({
-            node: ariaHiddenAttr,
-            messageId: MESSAGE_IDS.UNEXPECTED,
-          });
+        if (ariaHiddenAttr) {
+          if (
+            (ariaHiddenAttr.value && ariaHiddenAttr.value.value !== "false") ||
+            !ariaHiddenAttr.value
+          ) {
+            context.report({
+              node: ariaHiddenAttr,
+              messageId: MESSAGE_IDS.UNEXPECTED,
+            });
+          }
         }
       },
     };

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

@@ -31,20 +31,20 @@ module.exports = {
 
   create(context) {
     return {
-      "*"(node) {
-        if (Array.isArray(node.attrs)) {
+      [["Tag", "StyleTag", "ScriptTag"].join(",")](node) {
+        if (Array.isArray(node.attributes)) {
           const attrsSet = new Set();
-          node.attrs.forEach((attr) => {
-            if (attrsSet.has(attr.name)) {
+          node.attributes.forEach((attr) => {
+            if (attr.key && attrsSet.has(attr.key.value)) {
               context.report({
-                node: node.startTag,
+                node: attr,
                 data: {
-                  attrName: attr.name,
+                  attrName: attr.key.value,
                 },
                 messageId: MESSAGE_IDS.DUPLICATE_ATTRS,
               });
             } else {
-              attrsSet.add(attr.name);
+              attrsSet.add(attr.key.value);
             }
           });
         }

package/lib/rules/no-duplicate-id.js

@@ -33,13 +33,16 @@ module.exports = {
     const IdAttrsMap = new Map();
     return {
       "*"(node) {
+        if (!node.attributes || node.attributes.length <= 0) {
+          return;
+        }
         const idAttr = NodeUtils.findAttr(node, "id");
-        if (idAttr) {
-          if (!IdAttrsMap.has(idAttr.value)) {
-            IdAttrsMap.set(idAttr.value, []);
+        if (idAttr && idAttr.value) {
+          if (!IdAttrsMap.has(idAttr.value.value)) {
+            IdAttrsMap.set(idAttr.value.value, []);
           }
-          const nodes = IdAttrsMap.get(idAttr.value);
-          nodes.push(idAttr);
+          const nodes = IdAttrsMap.get(idAttr.value.value);
+          nodes.push(idAttr.value);
         }
       },
       "Program:exit"() {