feat: enabled slots option to take class components (#826)

Author: nekosaur

packages/create-instance/validate-slots.js

@@ -2,11 +2,11 @@
 
 import { throwError } from 'shared/util'
 import { compileToFunctions } from 'vue-template-compiler'
+import { isVueComponent } from '../shared/validators'
 
 function isValidSlot (slot: any): boolean {
   return (
-    Array.isArray(slot) ||
-    (slot !== null && typeof slot === 'object') ||
+    isVueComponent(slot) ||
     typeof slot === 'string'
   )
 }
@@ -23,24 +23,16 @@ function requiresTemplateCompiler (slot: any): void {
 
 export function validateSlots (slots: SlotsObject): void {
   Object.keys(slots).forEach(key => {
-    if (!isValidSlot(slots[key])) {
-      throwError(
-        `slots[key] must be a Component, string or an array ` + `of Components`
-      )
-    }
+    const slot = Array.isArray(slots[key]) ? slots[key] : [slots[key]]
 
-    requiresTemplateCompiler(slots[key])
-
-    if (Array.isArray(slots[key])) {
-      slots[key].forEach(slotValue => {
-        if (!isValidSlot(slotValue)) {
-          throwError(
-            `slots[key] must be a Component, string or an array ` +
-              `of Components`
-          )
-        }
-        requiresTemplateCompiler(slotValue)
-      })
-    }
+    slot.forEach(slotValue => {
+      if (!isValidSlot(slotValue)) {
+        throwError(
+          `slots[key] must be a Component, string or an array ` +
+            `of Components`
+        )
+      }
+      requiresTemplateCompiler(slotValue)
+    })
   })
 }

test/specs/mounting-options/slots.spec.js

@@ -546,4 +546,26 @@ describeWithMountingMethods('options.slots', mountingMethod => {
       wrapper.find('div').trigger('click')
     }
   )
+
+  it('mounts component with default slot if passed class component in slot object', () => {
+    const wrapper = mountingMethod(ComponentWithSlots, {
+      slots: { default: ComponentAsAClass }
+    })
+    if (mountingMethod.name === 'renderToString') {
+      expect(wrapper).contains('<div></div>')
+    } else {
+      expect(wrapper.contains(ComponentAsAClass)).to.equal(true)
+    }
+  })
+
+  it('mounts component with default slot if passed class component in array in slot object', () => {
+    const wrapper = mountingMethod(ComponentWithSlots, {
+      slots: { default: [ComponentAsAClass] }
+    })
+    if (mountingMethod.name === 'renderToString') {
+      expect(wrapper).contains('<div></div>')
+    } else {
+      expect(wrapper.contains(ComponentAsAClass)).to.equal(true)
+    }
+  })
 })