@html-eslint/eslint-plugin 0.41.0 → 0.43.0

package/lib/rules/no-restricted-attr-values.js

@@ -1,10 +1,7 @@
 /**
- * @typedef { import("@html-eslint/types").StyleTag } StyleTag
- * @typedef { import("@html-eslint/types").Attribute } Attribute
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
+ * @import {StyleTag, Attribute, Tag, ScriptTag } from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  * @typedef {{attrPatterns: string[], attrValuePatterns: string[], message?: string}[]} Options
- * @typedef { import("../types").RuleModule<Options> } RuleModule
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -16,7 +13,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<Options>}
  */
 module.exports = {
   meta: {
@@ -53,6 +50,7 @@ module.exports = {
             type: "string",
           },
         },
+        additionalProperties: false,
       },
     },
     messages: {

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

@@ -1,11 +1,8 @@
 /**
- * @typedef { import("@html-eslint/types").StyleTag } StyleTag
- * @typedef { import("@html-eslint/types").Attribute } Attribute
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
+ * @import {StyleTag, Attribute, Tag, ScriptTag} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  * @typedef {{tagPatterns: string[], attrPatterns: string[], message?: string}[]} Options
  *
- * @typedef { import("../types").RuleModule<Options> } RuleModule
  */
 
 const { NODE_TYPES } = require("@html-eslint/parser");
@@ -18,7 +15,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<Options>}
  */
 module.exports = {
   meta: {
@@ -55,6 +52,7 @@ module.exports = {
             type: "string",
           },
         },
+        additionalProperties: false,
       },
     },
     messages: {

package/lib/rules/no-script-style-type.js

@@ -1,8 +1,6 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
- * @typedef { import("@html-eslint/types").StyleTag } StyleTag
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
+ * @import {RuleModule} from "../types";
+ * @import {StyleTag, Tag, ScriptTag} from "@html-eslint/types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -15,7 +13,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

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

@@ -1,6 +1,6 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
- * @typedef { import("@html-eslint/types").Tag } Tag
+ * @import {RuleModule} from "../types";
+ * @import {Tag} from "@html-eslint/types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -11,7 +11,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

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

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -12,7 +12,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/no-trailing-spaces.js

@@ -1,10 +1,9 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
- * @typedef { import("@html-eslint/types").CommentContent } CommentContent
- * @typedef { import("@html-eslint/types").Text } Text
+ * @import {RuleModule} from "../types";
+ * @import {CommentContent, Text} from "@html-eslint/types";
  */
 
-const { parse } = require("@html-eslint/template-parser");
+const { parseTemplateLiteral } = require("./utils/template-literal");
 const { RULE_CATEGORY } = require("../constants");
 const {
   getTemplateTokens,
@@ -23,7 +22,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {
@@ -108,10 +107,9 @@ module.exports = {
       },
       TaggedTemplateExpression(node) {
         if (shouldCheckTaggedTemplateExpression(node, context)) {
-          const { html, tokens } = parse(
+          const { html, tokens } = parseTemplateLiteral(
             node.quasi,
-            getSourceCode(context),
-            {}
+            getSourceCode(context)
           );
           const lines = codeToLines(html);
           check(
@@ -128,7 +126,10 @@ module.exports = {
       },
       TemplateLiteral(node) {
         if (shouldCheckTemplateLiteral(node, context)) {
-          const { html, tokens } = parse(node, getSourceCode(context), {});
+          const { html, tokens } = parseTemplateLiteral(
+            node,
+            getSourceCode(context)
+          );
           const lines = codeToLines(html);
           check(
             html,

package/lib/rules/prefer-https.js

@@ -1,9 +1,6 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
- * @typedef { import("@html-eslint/types").Attribute } Attribute
- * @typedef { import("@html-eslint/types").AttributeValue } AttributeValue
+ * @import {Tag, ScriptTag, Attribute, AttributeValue} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -66,7 +63,7 @@ function getResourceAttributeValue(node) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/quotes.js

@@ -1,12 +1,10 @@
 /**
- * @typedef { import("eslint").AST.Range } Range
- * @typedef { import("@html-eslint/types").Attribute } Attribute
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
- * @typedef { import("@html-eslint/types").StyleTag } StyleTag
+ * @import {AST} from "eslint";
+ * @import {Attribute, Tag, ScriptTag, StyleTag} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  *
- * @typedef {"single" | "double"} Option
- * @typedef { import("../types").RuleModule<[Option]> } RuleModule
+ * @typedef {"single" | "double"} SingleOrQuoteOption
+ * @typedef {{enforceTemplatedAttrValue: boolean}} ObjectOption
  */
 
 const { NODE_TYPES } = require("@html-eslint/parser");
@@ -28,7 +26,7 @@ const QUOTES_STYLES = {
 const QUOTES_CODES = [`"`, `'`];
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[SingleOrQuoteOption, ObjectOption]>}
  */
 module.exports = {
   meta: {
@@ -46,6 +44,16 @@ module.exports = {
       {
         enum: [QUOTES_STYLES.SINGLE, QUOTES_STYLES.DOUBLE],
       },
+      {
+        type: "object",
+        properties: {
+          enforceTemplatedAttrValue: {
+            type: "boolean",
+            default: false,
+          },
+        },
+        additionalProperties: false,
+      },
     ],
     messages: {
       [MESSAGE_IDS.UNEXPECTED]:
@@ -61,11 +69,15 @@ module.exports = {
         ? context.options[0]
         : QUOTES_STYLES.DOUBLE;
     const expectedQuote = SELECTED_STYLE === QUOTES_STYLES.DOUBLE ? `"` : `'`;
+    const enforceTemplatedAttrValue =
+      context.options &&
+      context.options[1] &&
+      context.options[1].enforceTemplatedAttrValue;
 
     const sourceCode = getSourceCode(context);
 
     /**
-     * @param {Range} range
+     * @param {AST.Range} range
      * @returns {string}
      */
     function getCodeIn(range) {
@@ -94,7 +106,10 @@ module.exports = {
        * Allow template expression.
        * ex: html`<div foo=${foo}></div>`
        */
-      if (attr.value.parts.some((part) => part.type === NODE_TYPES.Template)) {
+      if (
+        !enforceTemplatedAttrValue &&
+        attr.value.parts.some((part) => part.type === NODE_TYPES.Template)
+      ) {
         return;
       }
 

package/lib/rules/require-attrs.js

@@ -1,17 +1,12 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").ScriptTag } ScriptTag
- * @typedef { import("@html-eslint/types").StyleTag } StyleTag
- * @typedef { import("@html-eslint/types").Attribute } Attribute
+ * @import {Tag, ScriptTag, StyleTag, Attribute} from "@html-eslint/types";
+ * @import {RuleModule, ReportFixFunction} from "../types";
  *
  * @typedef {Object} Option
  * @property {string} tag
  * @property {string} attr
  * @property {string} [value]
  *
- * @typedef { import("../types").RuleModule<Option[]> } RuleModule
- * @typedef { import("../types").ReportFixFunction} ReportFixFunction
- *
  */
 
 const { NODE_TYPES } = require("@html-eslint/parser");
@@ -25,7 +20,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<Option[]>}
  */
 module.exports = {
   meta: {

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

@@ -1,7 +1,6 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
- * @typedef { import("@html-eslint/types").AttributeValue } AttributeValue
- * @typedef { import("../types").SuggestionReportDescriptor } SuggestionReportDescriptor
+ * @import {RuleModule, SuggestionReportDescriptor} from "../types";
+ * @import {AttributeValue} from "@html-eslint/types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -20,7 +19,7 @@ const MESSAGE_IDS = {
 const VALID_BUTTON_TYPES_SET = new Set(["submit", "button", "reset"]);
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

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

@@ -1,10 +1,10 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
+ * @import {Tag} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  *
  * @typedef {Object} Option
  * @property {"always" | "never"} [Option.selfClosing]
  * @property {string[]} [Option.selfClosingCustomPatterns]
- * @typedef { import("../types").RuleModule<[Option]> } RuleModule
  */
 
 const { RULE_CATEGORY, VOID_ELEMENTS } = require("../constants");
@@ -20,7 +20,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[Option]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-doctype.js

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -10,7 +10,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-explicit-size.js

@@ -1,12 +1,9 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
+ * @import {RuleModule} from "../types";
  *
  * @typedef {Object} Option
  * @property {string[]} [Option.allowClass]
  * @property {string[]} [Option.allowId]
- * @typedef { import("../types").RuleModule<[Option]> } RuleModule
- *
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -22,7 +19,7 @@ const MESSAGE_IDS = {
 const TARGET_ELEMENTS = ["img", "iframe"];
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[Option]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-form-method.js

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { NODE_TYPES } = require("@html-eslint/parser");
@@ -17,7 +17,7 @@ const MESSAGE_IDS = {
 const ALLOWED_METHODS = new Set(["GET", "POST", "DIALOG"]);
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

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

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -13,7 +13,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-img-alt.js

@@ -1,10 +1,9 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
+ * @import {Tag} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  *
  * @typedef {Object} Option
- * @property {string[]} [Option.substitute]
- *
- * @typedef { import("../types").RuleModule<[Option]> } RuleModule
+ * @property {string[]} [substitute]
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -13,14 +12,15 @@ const { getRuleUrl } = require("./utils/rule");
 
 const MESSAGE_IDS = {
   MISSING_ALT: "missingAlt",
+  INSERT_ALT: "insertAlt",
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[Option]>}
  */
 module.exports = {
   meta: {
-    type: "code",
+    type: "suggestion",
 
     docs: {
       description: "Require `alt` attribute at `<img>` tag",
@@ -30,6 +30,7 @@ module.exports = {
     },
 
     fixable: null,
+    hasSuggestions: true,
     schema: [
       {
         type: "object",
@@ -41,10 +42,12 @@ module.exports = {
             },
           },
         },
+        additionalProperties: false,
       },
     ],
     messages: {
       [MESSAGE_IDS.MISSING_ALT]: "Missing `alt` attribute at `<img>` tag",
+      [MESSAGE_IDS.INSERT_ALT]: 'Insert `alt=""` at `<img>` tag',
     },
   },
 
@@ -60,13 +63,27 @@ module.exports = {
         if (node.name !== "img") {
           return;
         }
-        if (!hasAltAttrAndValue(node, substitute)) {
+
+        const hasAlt = hasValidAltOrSubstitute(node, substitute);
+        const hasSubstituteOption = substitute.length > 0;
+
+        if (!hasAlt) {
           context.report({
             loc: {
               start: node.openStart.loc.start,
               end: node.openEnd.loc.end,
             },
             messageId: MESSAGE_IDS.MISSING_ALT,
+            suggest: hasSubstituteOption
+              ? null
+              : [
+                  {
+                    messageId: MESSAGE_IDS.INSERT_ALT,
+                    fix(fixer) {
+                      return fixer.insertTextBefore(node.openEnd, ' alt=""');
+                    },
+                  },
+                ],
           });
         }
       },
@@ -77,16 +94,22 @@ module.exports = {
 /**
  * @param {Tag} node
  * @param {string[]} substitute
- * @returns
+ * @returns {boolean}
  */
-function hasAltAttrAndValue(node, substitute = []) {
-  return node.attributes.some((attr) => {
-    if (attr.key && attr.value) {
-      return (
-        (attr.key.value === "alt" || substitute.includes(attr.key.value)) &&
-        typeof attr.value.value === "string"
-      );
+function hasValidAltOrSubstitute(node, substitute) {
+  let hasAnyAlt = false;
+
+  for (const attr of node.attributes) {
+    if (attr.key && attr.key.value) {
+      const isAltAttr = attr.key.value === "alt";
+      const isSubstituteAttr = substitute.includes(attr.key.value);
+
+      if (isAltAttr || isSubstituteAttr) {
+        hasAnyAlt = true;
+        break;
+      }
     }
-    return false;
-  });
+  }
+
+  return hasAnyAlt;
 }

package/lib/rules/require-input-label.js

@@ -1,6 +1,6 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
+ * @import {Tag} from "@html-eslint/types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -17,7 +17,7 @@ const INPUT_TAGS = new Set(["input", "textarea", "select"]);
 const LABEL_ATTRIBUTES = new Set(["id", "aria-labelledby", "aria-label"]);
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-lang.js

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -13,7 +13,7 @@ const MESSAGE_IDS = {
 };
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-li-container.js

@@ -1,5 +1,5 @@
 /**
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
  */
 
 const { NODE_TYPES } = require("@html-eslint/parser");
@@ -13,7 +13,7 @@ const MESSAGE_IDS = {
 const VALID_CONTAINERS = ["ul", "ol", "menu"];
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-meta-charset.js

@@ -1,7 +1,6 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {RuleModule} from "../types";
+ * @import {Tag, AnyNode} from "@html-eslint/types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -23,7 +22,7 @@ function isMetaCharset(node) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-meta-description.js

@@ -1,7 +1,6 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {Tag, AnyNode} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  */
 const { RULE_CATEGORY } = require("../constants");
 const { filter } = require("./utils/array");
@@ -22,7 +21,7 @@ function isMetaTagNode(node) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-meta-viewport.js

@@ -1,7 +1,6 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {Tag, AnyNode} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -31,7 +30,7 @@ function isMetaViewport(node) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-open-graph-protocol.js

@@ -1,10 +1,7 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
- *
+ * @import {Tag, AnyNode} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  * @typedef {string[]} Option
- *
- * @typedef { import("../types").RuleModule<[Option]> } RuleModule
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -36,7 +33,7 @@ function normalize(properties) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[Option]>}
  */
 module.exports = {
   meta: {

package/lib/rules/require-title.js

@@ -1,8 +1,6 @@
 /**
- * @typedef { import("@html-eslint/types").Tag } Tag
- * @typedef { import("@html-eslint/types").Text } Text
- * @typedef { import("@html-eslint/types").AnyNode } AnyNode
- * @typedef { import("../types").RuleModule<[]> } RuleModule
+ * @import {Tag, Text, AnyNode} from "@html-eslint/types";
+ * @import {RuleModule} from "../types";
  */
 
 const { RULE_CATEGORY } = require("../constants");
@@ -32,7 +30,7 @@ function isNonEmptyText(node) {
 }
 
 /**
- * @type {RuleModule}
+ * @type {RuleModule<[]>}
  */
 module.exports = {
   meta: {