Add externalIgnores option for `vue/singleline-html-element-content…

…-newline` (#2297)
vuejs · Nov 29, 2023 · ac57432 · ac57432
1 parent a725170
commit ac57432
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 7 deletions.
diff --git a/docs/rules/singleline-html-element-content-newline.md b/docs/rules/singleline-html-element-content-newline.md
@@ -56,7 +56,8 @@ This rule enforces a line break before and after the contents of a singleline el
   "vue/singleline-html-element-content-newline": ["error", {
     "ignoreWhenNoAttributes": true,
     "ignoreWhenEmpty": true,
-    "ignores": ["pre", "textarea", ...INLINE_ELEMENTS]
+    "ignores": ["pre", "textarea", ...INLINE_ELEMENTS],
+    "externalIgnores": []
   }]
 }
 ```
@@ -66,7 +67,9 @@ This rule enforces a line break before and after the contents of a singleline el
 - `ignoreWhenEmpty` ... disables reporting when element has no content.
     default `true`
 - `ignores` ... the configuration for element names to ignore line breaks style.
-    default `["pre", "textarea", ...INLINE_ELEMENTS]`.
+    default `["pre", "textarea", ...INLINE_ELEMENTS]`
+- `externalIgnores` ... the configuration for external element names to ignore line breaks style, it allows avoiding overwrite the default value of ignores.
+    default `[]`
 
 ::: info
   All inline non void elements can be found [here](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/utils/inline-non-void-elements.json).

diff --git a/lib/rules/singleline-html-element-content-newline.js b/lib/rules/singleline-html-element-content-newline.js
@@ -22,6 +22,7 @@ function parseOptions(options) {
   return Object.assign(
     {
       ignores: ['pre', 'textarea', ...INLINE_ELEMENTS],
+      externalIgnores: [],
       ignoreWhenNoAttributes: true,
       ignoreWhenEmpty: true
     },
@@ -67,6 +68,12 @@ module.exports = {
             items: { type: 'string' },
             uniqueItems: true,
             additionalItems: false
+          },
+          externalIgnores: {
+            type: 'array',
+            items: { type: 'string' },
+            uniqueItems: true,
+            additionalItems: false
           }
         },
         additionalProperties: false
@@ -82,7 +89,7 @@ module.exports = {
   /** @param {RuleContext} context */
   create(context) {
     const options = parseOptions(context.options[0])
-    const ignores = options.ignores
+    const ignores = new Set([...options.ignores, ...options.externalIgnores])
     const ignoreWhenNoAttributes = options.ignoreWhenNoAttributes
     const ignoreWhenEmpty = options.ignoreWhenEmpty
     const template =
@@ -96,9 +103,9 @@ module.exports = {
     /** @param {VElement} node */
     function isIgnoredElement(node) {
       return (
-        ignores.includes(node.name) ||
-        ignores.includes(casing.pascalCase(node.rawName)) ||
-        ignores.includes(casing.kebabCase(node.rawName))
+        ignores.has(node.name) ||
+        ignores.has(casing.pascalCase(node.rawName)) ||
+        ignores.has(casing.kebabCase(node.rawName))
       )
     }
 

diff --git a/tests/lib/rules/singleline-html-element-content-newline.js b/tests/lib/rules/singleline-html-element-content-newline.js
@@ -204,7 +204,35 @@ tester.run('singleline-html-element-content-newline', rule, {
         <div
           id=
           ""
-    `
+    `,
+    {
+      code: `
+        <template>
+          <pre>content</pre>
+          <IgnoreTag>content</IgnoreTag>
+          <IgnoreTag attr>content</IgnoreTag>
+          <IgnoreTag><span attr>content</span></IgnoreTag>
+        </template>`,
+      options: [
+        {
+          externalIgnores: ['IgnoreTag']
+        }
+      ]
+    },
+    {
+      code: `
+        <template>
+        <pre>content</pre>
+          <ignore-tag>content</ignore-tag>
+          <ignore-tag attr>content</ignore-tag>
+          <ignore-tag><span attr>content</span></ignore-tag>
+        </template>`,
+      options: [
+        {
+          externalIgnores: ['IgnoreTag']
+        }
+      ]
+    }
   ],
   invalid: [
     {