diff --git a/packages/eslint-plugin/lib/rules/require-attrs.js b/packages/eslint-plugin/lib/rules/require-attrs.js
index 5b6e7c2c..771a2d18 100644
--- a/packages/eslint-plugin/lib/rules/require-attrs.js
+++ b/packages/eslint-plugin/lib/rules/require-attrs.js
@@ -7,6 +7,7 @@
const { NODE_TYPES } = require("@html-eslint/parser");
const { RULE_CATEGORY } = require("../constants");
+const { createVisitors } = require("./utils/visitors");
const MESSAGE_IDS = {
MISSING: "missing",
@@ -103,25 +104,32 @@ module.exports = {
});
}
- return {
- /**
- * @param {StyleTagNode | ScriptTagNode} node
- * @returns
- */
- [["StyleTag", "ScriptTag"].join(",")](node) {
- const tagName = node.type === NODE_TYPES.StyleTag ? "style" : "script";
- if (!tagOptionsMap.has(tagName)) {
- return;
- }
- check(node, tagName);
- },
- Tag(node) {
- const tagName = node.name.toLowerCase();
- if (!tagOptionsMap.has(tagName)) {
- return;
- }
- check(node, tagName);
- },
- };
+ /**
+ * @param {StyleTagNode | ScriptTagNode} node
+ */
+ function checkStyleOrScript(node) {
+ const tagName = node.type === NODE_TYPES.StyleTag ? "style" : "script";
+ if (!tagOptionsMap.has(tagName)) {
+ return;
+ }
+ check(node, tagName);
+ }
+
+ /**
+ * @param {TagNode} node
+ */
+ function checkTag(node) {
+ const tagName = node.name.toLowerCase();
+ if (!tagOptionsMap.has(tagName)) {
+ return;
+ }
+ check(node, tagName);
+ }
+
+ return createVisitors(context, {
+ StyleTag: checkStyleOrScript,
+ ScriptTag: checkStyleOrScript,
+ Tag: checkTag,
+ });
},
};
diff --git a/packages/eslint-plugin/tests/rules/require-attrs.test.js b/packages/eslint-plugin/tests/rules/require-attrs.test.js
index 0c6f905a..a9afcda0 100644
--- a/packages/eslint-plugin/tests/rules/require-attrs.test.js
+++ b/packages/eslint-plugin/tests/rules/require-attrs.test.js
@@ -2,6 +2,7 @@ const createRuleTester = require("../rule-tester");
const rule = require("../../lib/rules/require-attrs");
const ruleTester = createRuleTester();
+const templateRuleTester = createRuleTester("espree");
ruleTester.run("require-attrs", rule, {
valid: [
@@ -250,3 +251,46 @@ ruleTester.run("require-attrs", rule, {
},
],
});
+
+templateRuleTester.run("[template] require-attrs", rule, {
+ valid: [
+ {
+ code: "html``",
+ options: [
+ {
+ tag: "svg",
+ attr: "viewBox",
+ },
+ ],
+ },
+ ],
+ invalid: [
+ {
+ code: 'html``',
+ options: [
+ {
+ tag: "img",
+ attr: "alt",
+ },
+ {
+ tag: "img",
+ attr: "class",
+ value: "img",
+ },
+ ],
+ errors: [
+ {
+ line: 1,
+ column: 6,
+ message: "Missing 'alt' attributes for 'img' tag",
+ },
+ {
+ line: 1,
+ column: 11,
+ endColumn: 24,
+ message: "Unexpected 'class' attributes value. 'img' is expected",
+ },
+ ],
+ },
+ ],
+});