Improved autofix of vue/no-deprecated-slot-attribute rule when slot n…

…ame contains `_`. (#1436)
vuejs · Feb 14, 2021 · 4b41399 · 4b41399
1 parent b978258
commit 4b41399
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 2 deletions.
diff --git a/lib/rules/syntaxes/slot-attribute.js b/lib/rules/syntaxes/slot-attribute.js
@@ -23,8 +23,8 @@ module.exports = {
         return true
       }
       const slotName = slotAttr.value.value
-      // If non-Latin characters are included it can not be converted.
-      return !/[^a-z]/i.test(slotName)
+      // If other than alphanumeric, underscore and hyphen characters are included it can not be converted.
+      return !/[^\w\-]/u.test(slotName)
     }
 
     /**

diff --git a/tests/lib/rules/no-deprecated-slot-attribute.js b/tests/lib/rules/no-deprecated-slot-attribute.js
@@ -348,6 +348,63 @@ tester.run('no-deprecated-slot-attribute', rule, {
           line: 4
         }
       ]
+    },
+    {
+      code: `
+      <template>
+        <MyComponent>
+          <template slot="foo-bar">
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      output: `
+      <template>
+        <MyComponent>
+          <template v-slot:foo-bar>
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      errors: ['`slot` attributes are deprecated.']
+    },
+    {
+      code: `
+      <template>
+        <MyComponent>
+          <template slot="foo_bar">
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      output: `
+      <template>
+        <MyComponent>
+          <template v-slot:foo_bar>
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      errors: ['`slot` attributes are deprecated.']
+    },
+    {
+      code: `
+      <template>
+        <MyComponent>
+          <template slot="123">
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      output: `
+      <template>
+        <MyComponent>
+          <template v-slot:123>
+            <a/>
+          </template>
+        </MyComponent>
+      </template>`,
+      errors: ['`slot` attributes are deprecated.']
     }
   ]
 })