From bf8516305760a832953b2342493299a05df49405 Mon Sep 17 00:00:00 2001
From: Pig Fang <g-plane@hotmail.com>
Date: Mon, 22 Mar 2021 15:51:51 +0800
Subject: [PATCH] Update: disallow `v-show` on `<template>` tag (#1451)

---
 docs/rules/valid-v-show.md      |  2 ++
 lib/rules/valid-v-show.js       |  7 +++++++
 tests/lib/rules/valid-v-show.js | 10 ++++++++++
 3 files changed, 19 insertions(+)

diff --git a/docs/rules/valid-v-show.md b/docs/rules/valid-v-show.md
index bcfb0c87b..710489946 100644
--- a/docs/rules/valid-v-show.md
+++ b/docs/rules/valid-v-show.md
@@ -20,6 +20,7 @@ This rule reports `v-show` directives in the following cases:
 - The directive has that argument. E.g. `<div v-show:aaa></div>`
 - The directive has that modifier. E.g. `<div v-show.bbb></div>`
 - The directive does not have that attribute value. E.g. `<div v-show></div>`
+- The directive is put on `<template>` tag. E.g. `<template v-show="condition" />`
 
 <eslint-code-block :rules="{'vue/valid-v-show': ['error']}">
 
@@ -32,6 +33,7 @@ This rule reports `v-show` directives in the following cases:
   <div v-show/>
   <div v-show:aaa="foo"/>
   <div v-show.bbb="foo"/>
+  <template v-show="condition" />
 </template>
 ```
 
diff --git a/lib/rules/valid-v-show.js b/lib/rules/valid-v-show.js
index d5378a63a..721904f4f 100644
--- a/lib/rules/valid-v-show.js
+++ b/lib/rules/valid-v-show.js
@@ -52,6 +52,13 @@ module.exports = {
             message: "'v-show' directives require that attribute value."
           })
         }
+        if (node.parent.parent.name === 'template') {
+          context.report({
+            node,
+            loc: node.loc,
+            message: "'v-show' directives cannot be put on <template> tags."
+          })
+        }
       }
     })
   }
diff --git a/tests/lib/rules/valid-v-show.js b/tests/lib/rules/valid-v-show.js
index 4220e8749..6b1d62015 100644
--- a/tests/lib/rules/valid-v-show.js
+++ b/tests/lib/rules/valid-v-show.js
@@ -63,6 +63,16 @@ tester.run('valid-v-show', rule, {
       filename: 'empty-value.vue',
       code: '<template><div v-show=""></div></template>',
       errors: ["'v-show' directives require that attribute value."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><template v-show="condition"></template></template>',
+      errors: ["'v-show' directives cannot be put on <template> tags."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><template v-show="condition" /></template>',
+      errors: ["'v-show' directives cannot be put on <template> tags."]
     }
   ]
 })