fix: stub dynamic components (#1051)

Author: eddyerburgh

packages/create-instance/patch-render.js

@@ -50,6 +50,10 @@ function isConstructor (el) {
   return typeof el === 'function'
 }
 
+function isComponentOptions (el) {
+  return typeof el === 'object' && (el.template || el.render)
+}
+
 export function patchRender (_Vue, stubs, stubAllComponents) {
   // This mixin patches vm.$createElement so that we can stub all components
   // before they are rendered in shallow mode. We also need to ensure that
@@ -60,7 +64,10 @@ export function patchRender (_Vue, stubs, stubAllComponents) {
   function patchRenderMixin () {
     const vm = this
 
-    if (vm.$options.$_doNotStubChildren || vm._isFunctionalContainer) {
+    if (
+      vm.$options.$_doNotStubChildren ||
+      vm.$options._isFunctionalContainer
+    ) {
       return
     }
 
@@ -73,12 +80,11 @@ export function patchRender (_Vue, stubs, stubAllComponents) {
         return originalCreateElement(el, ...args)
       }
 
-      if (isConstructor(el)) {
+      if (isConstructor(el) || isComponentOptions(el)) {
         if (stubAllComponents) {
           const stub = createStubFromComponent(el, el.name || 'anonymous')
           return originalCreateElement(stub, ...args)
         }
-
         const Constructor = shouldExtend(el, _Vue) ? extend(el, _Vue) : el
 
         return originalCreateElement(Constructor, ...args)

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

@@ -56,7 +56,7 @@ describeWithMountingMethods('options.slots', mountingMethod => {
     }
   })
 
-  it('mounts component with default slot if passed object with template prop in slot object', () => {
+  it('mounts component with default slot if passed compiled options in slot object', () => {
     const compiled = compileToFunctions('<div id="div" />')
     const wrapper = mountingMethod(ComponentWithSlots, {
       slots: { default: [compiled] }

test/specs/shallow-mount.spec.js

@@ -454,10 +454,10 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
     const TestComponent = {
       template: `
       <div>
-        <ChildComponent text="normal" />
-        <component :is="dataComponent" text="data" />
-        <component :is="computedComponent" text="computed" />
-        <component :is="methodComponent()" text="method" />
+        <ChildComponent />
+        <component :is="dataComponent" />
+        <component :is="computedComponent" />
+        <component :is="methodComponent()" />
       </div>
       `,
       components: { ChildComponent },
@@ -481,7 +481,13 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
       }
     }
     const wrapper = shallowMount(TestComponent)
-    expect(wrapper.text()).to.equal('')
-    expect(wrapper.findAll(ChildComponent).length).to.equal(4)
+    expect(wrapper.html()).to.equal(
+      '<div>' +
+        '<childcomponent-stub></childcomponent-stub> ' +
+        '<anonymous-stub></anonymous-stub> ' +
+        '<anonymous-stub></anonymous-stub> ' +
+        '<anonymous-stub></anonymous-stub>' +
+        '</div>'
+    )
   })
 })