From 49f7e07d96e4273b6398caf7a7e2a7c9ef2efa76 Mon Sep 17 00:00:00 2001
From: dobromir-hristov <dobromir92@gmail.com>
Date: Sat, 21 Mar 2020 18:55:37 +0200
Subject: [PATCH 1/3] feat: update scope-slot detection

---
 .../create-instance/create-scoped-slots.js    | 17 +++++++++++---
 .../mounting-options/scopedSlots.spec.js      | 23 +++++++++++++++++++
 2 files changed, 37 insertions(+), 3 deletions(-)

diff --git a/packages/create-instance/create-scoped-slots.js b/packages/create-instance/create-scoped-slots.js
index d5d0cecaa..d93b61728 100644
--- a/packages/create-instance/create-scoped-slots.js
+++ b/packages/create-instance/create-scoped-slots.js
@@ -5,7 +5,7 @@ import { throwError } from 'shared/util'
 import { VUE_VERSION } from 'shared/consts'
 
 function isDestructuringSlotScope(slotScope: string): boolean {
-  return slotScope[0] === '{' && slotScope[slotScope.length - 1] === '}'
+  return /^{.*}$/.test(slotScope)
 }
 
 function getVueTemplateCompilerHelpers(
@@ -46,7 +46,17 @@ function validateEnvironment(): void {
   }
 }
 
-const slotScopeRe = /<[^>]+ slot-scope=\"(.+)\"/
+function isScopedSlot(slotString) {
+  const slotScopeRe = /<[^>]+ slot-scope="(.+)"/
+  const vSlotRe = /<template v-slot(?::.+)?="(.+)"/
+  const shortVSlotRe = /<template #.*="(.+)"/
+
+  const hasOldSlotScope = slotString.match(slotScopeRe)
+  const hasVSlotScopeAttr = slotString.match(vSlotRe)
+  const hasShortVSlotScopeAttr = slotString.match(shortVSlotRe)
+
+  return hasOldSlotScope || hasVSlotScopeAttr || hasShortVSlotScopeAttr
+}
 
 // Hide warning about <template> disallowed as root element
 function customWarn(msg) {
@@ -76,7 +86,8 @@ export default function createScopedSlots(
         ? slot
         : compileToFunctions(slot, { warn: customWarn }).render
 
-    const hasSlotScopeAttr = !isFn && slot.match(slotScopeRe)
+    const hasSlotScopeAttr = !isFn && isScopedSlot(slot)
+
     const slotScope = hasSlotScopeAttr && hasSlotScopeAttr[1]
     scopedSlots[scopedSlotName] = function(props) {
       let res
diff --git a/test/specs/mounting-options/scopedSlots.spec.js b/test/specs/mounting-options/scopedSlots.spec.js
index ecb4cc2f7..55aea32d0 100644
--- a/test/specs/mounting-options/scopedSlots.spec.js
+++ b/test/specs/mounting-options/scopedSlots.spec.js
@@ -281,6 +281,29 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
     }
   )
 
+  itDoNotRunIf.only(
+    vueVersion < 2.5,
+    'renders scoped slot with v-slot syntax',
+    async () => {
+      const TestComponent = {
+        data() {
+          return {
+            val: 25
+          }
+        },
+        render() {
+          return this.$scopedSlots.default({ val: this.val })
+        }
+      }
+      const wrapper = mountingMethod(TestComponent, {
+        scopedSlots: {
+          default: '<template v-slot:default="{ val }">{{ val }}</template>'
+        }
+      })
+      expect(wrapper.html()).to.contain(25)
+    }
+  )
+
   itDoNotRunIf(
     vueVersion < 2.5 || mountingMethod.name !== 'mount',
     'renders using localVue constructor',

From 1992e85cba597c0945c3421f602e1d83ca8ed707 Mon Sep 17 00:00:00 2001
From: dobromir-hristov <dobromir92@gmail.com>
Date: Mon, 23 Mar 2020 11:13:07 +0200
Subject: [PATCH 2/3] fix: fix issue with empty template tag when using v-slot

---
 .../create-instance/create-scoped-slots.js    | 38 +++++++++++++++----
 .../mounting-options/scopedSlots.spec.js      | 34 +++++++++++++----
 2 files changed, 57 insertions(+), 15 deletions(-)

diff --git a/packages/create-instance/create-scoped-slots.js b/packages/create-instance/create-scoped-slots.js
index d93b61728..50464d9ee 100644
--- a/packages/create-instance/create-scoped-slots.js
+++ b/packages/create-instance/create-scoped-slots.js
@@ -46,16 +46,35 @@ function validateEnvironment(): void {
   }
 }
 
-function isScopedSlot(slotString) {
+function isScopedSlot(slot) {
+  if (typeof slot === 'function') return { match: null, slot }
+
   const slotScopeRe = /<[^>]+ slot-scope="(.+)"/
   const vSlotRe = /<template v-slot(?::.+)?="(.+)"/
   const shortVSlotRe = /<template #.*="(.+)"/
 
-  const hasOldSlotScope = slotString.match(slotScopeRe)
-  const hasVSlotScopeAttr = slotString.match(vSlotRe)
-  const hasShortVSlotScopeAttr = slotString.match(shortVSlotRe)
+  const hasOldSlotScope = slot.match(slotScopeRe)
+  const hasVSlotScopeAttr = slot.match(vSlotRe)
+  const hasShortVSlotScopeAttr = slot.match(shortVSlotRe)
 
-  return hasOldSlotScope || hasVSlotScopeAttr || hasShortVSlotScopeAttr
+  if (hasOldSlotScope) {
+    return { slot, match: hasOldSlotScope }
+  } else if (hasVSlotScopeAttr || hasShortVSlotScopeAttr) {
+    // Strip v-slot and #slot attributes from `template` tag. compileToFunctions leaves empty `template` tag otherwise.
+    const sanitizedSlot = slot.replace(
+      /(<template)([^>]+)(>.+<\/template>)/,
+      '$1$3'
+    )
+    return {
+      slot: sanitizedSlot,
+      match: hasVSlotScopeAttr || hasShortVSlotScopeAttr
+    }
+  }
+  // we have no matches, so we just return
+  return {
+    slot: slot,
+    match: null
+  }
 }
 
 // Hide warning about <template> disallowed as root element
@@ -80,15 +99,18 @@ export default function createScopedSlots(
   for (const scopedSlotName in scopedSlotsOption) {
     const slot = scopedSlotsOption[scopedSlotName]
     const isFn = typeof slot === 'function'
+
+    const scopedSlotMatches = isScopedSlot(slot)
+
     // Type check to silence flow (can't use isFn)
     const renderFn =
       typeof slot === 'function'
         ? slot
-        : compileToFunctions(slot, { warn: customWarn }).render
+        : compileToFunctions(scopedSlotMatches.slot, { warn: customWarn })
+            .render
 
-    const hasSlotScopeAttr = !isFn && isScopedSlot(slot)
+    const slotScope = scopedSlotMatches.match && scopedSlotMatches.match[1]
 
-    const slotScope = hasSlotScopeAttr && hasSlotScopeAttr[1]
     scopedSlots[scopedSlotName] = function(props) {
       let res
       if (isFn) {
diff --git a/test/specs/mounting-options/scopedSlots.spec.js b/test/specs/mounting-options/scopedSlots.spec.js
index 55aea32d0..b50707bf7 100644
--- a/test/specs/mounting-options/scopedSlots.spec.js
+++ b/test/specs/mounting-options/scopedSlots.spec.js
@@ -281,26 +281,46 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
     }
   )
 
-  itDoNotRunIf.only(
-    vueVersion < 2.5,
+  itDoNotRunIf(
+    vueVersion < 2.6,
     'renders scoped slot with v-slot syntax',
-    async () => {
+    () => {
       const TestComponent = {
         data() {
           return {
             val: 25
           }
         },
-        render() {
-          return this.$scopedSlots.default({ val: this.val })
+        template: '<div><slot :val="val"/></div>'
+      }
+      const wrapper = mountingMethod(TestComponent, {
+        scopedSlots: {
+          default:
+            '<template v-slot:default="{ val }"><p>{{ val }}</p></template>'
         }
+      })
+      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n</div>')
+    }
+  )
+
+  itDoNotRunIf(
+    vueVersion < 2.6,
+    'renders scoped slot with shorthand v-slot syntax',
+    () => {
+      const TestComponent = {
+        data() {
+          return {
+            val: 25
+          }
+        },
+        template: '<div><slot :val="val"/></div>'
       }
       const wrapper = mountingMethod(TestComponent, {
         scopedSlots: {
-          default: '<template v-slot:default="{ val }">{{ val }}</template>'
+          default: '<template #default="{ val }"><p>{{ val }}</p></template>'
         }
       })
-      expect(wrapper.html()).to.contain(25)
+      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n</div>')
     }
   )
 

From 51c9135d57182221177365adfa0c9d8a45fa5c0d Mon Sep 17 00:00:00 2001
From: dobromir-hristov <dobromir92@gmail.com>
Date: Mon, 23 Mar 2020 12:20:42 +0200
Subject: [PATCH 3/3] test: add more v-slot tests

---
 .../mounting-options/scopedSlots.spec.js      | 23 ++++++++++++-------
 1 file changed, 15 insertions(+), 8 deletions(-)

diff --git a/test/specs/mounting-options/scopedSlots.spec.js b/test/specs/mounting-options/scopedSlots.spec.js
index b50707bf7..2bd3fc2a3 100644
--- a/test/specs/mounting-options/scopedSlots.spec.js
+++ b/test/specs/mounting-options/scopedSlots.spec.js
@@ -288,18 +288,22 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
       const TestComponent = {
         data() {
           return {
-            val: 25
+            val: 25,
+            val2: 50
           }
         },
-        template: '<div><slot :val="val"/></div>'
+        template:
+          '<div><slot :val="val"/><slot name="named" :val="val2"/></div>'
       }
       const wrapper = mountingMethod(TestComponent, {
         scopedSlots: {
           default:
-            '<template v-slot:default="{ val }"><p>{{ val }}</p></template>'
+            '<template v-slot:default="{ val }"><p>{{ val }}</p></template>',
+          named:
+            '<template v-slot:named="prop"><p>{{ prop.val }}</p></template>'
         }
       })
-      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n</div>')
+      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n  <p>50</p>\n</div>')
     }
   )
 
@@ -310,17 +314,20 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
       const TestComponent = {
         data() {
           return {
-            val: 25
+            val: 25,
+            val2: 50
           }
         },
-        template: '<div><slot :val="val"/></div>'
+        template:
+          '<div><slot :val="val"/><slot name="named" :val="val2"/></div>'
       }
       const wrapper = mountingMethod(TestComponent, {
         scopedSlots: {
-          default: '<template #default="{ val }"><p>{{ val }}</p></template>'
+          default: '<template #default="{ val }"><p>{{ val }}</p></template>',
+          named: '<template #named="prop"><p>{{ prop.val }}</p></template>'
         }
       })
-      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n</div>')
+      expect(wrapper.html()).to.equal('<div>\n  <p>25</p>\n  <p>50</p>\n</div>')
     }
   )