diff --git a/packages/create-instance/create-component-stubs.js b/packages/create-instance/create-component-stubs.js index 7185ab648..0b8f8d094 100644 --- a/packages/create-instance/create-component-stubs.js +++ b/packages/create-instance/create-component-stubs.js @@ -43,10 +43,10 @@ function resolveComponent(obj: Object, component: string): Object { ) } -function getCoreProperties(componentOptions: Component): Object { +function getCoreProperties(componentOptions: Component, name?: string): Object { return { attrs: componentOptions.attrs, - name: componentOptions.name, + name: componentOptions.name || name, model: componentOptions.model, props: componentOptions.props, on: componentOptions.on, @@ -108,7 +108,7 @@ export function createStubFromComponent( } return { - ...getCoreProperties(componentOptions), + ...getCoreProperties(componentOptions, name), $_vueTestUtils_original: originalComponent, $_doNotStubChildren: true, render(h, context) { diff --git a/packages/create-instance/patch-create-element.js b/packages/create-instance/patch-create-element.js index 02b7d1256..daab487f9 100644 --- a/packages/create-instance/patch-create-element.js +++ b/packages/create-instance/patch-create-element.js @@ -68,8 +68,16 @@ export function patchCreateElement(_Vue, stubs, stubAllComponents) { } if (isConstructor(el) || isComponentOptions(el)) { + const componentOptions = isConstructor(el) ? el.options : el + const elName = componentOptions.name + + const stubbedComponent = resolveComponent(elName, stubs) + if (stubbedComponent) { + return originalCreateElement(stubbedComponent, ...args) + } + if (stubAllComponents) { - const stub = createStubFromComponent(el, el.name || 'anonymous', _Vue) + const stub = createStubFromComponent(el, elName || 'anonymous', _Vue) return originalCreateElement(stub, ...args) } const Constructor = shouldExtend(el, _Vue) ? extend(el, _Vue) : el diff --git a/test/specs/mounting-options/stubs.spec.js b/test/specs/mounting-options/stubs.spec.js index fa926c278..1fa368b9b 100644 --- a/test/specs/mounting-options/stubs.spec.js +++ b/test/specs/mounting-options/stubs.spec.js @@ -704,4 +704,90 @@ describeWithShallowAndMount('options.stub', mountingMethod => { `` ) }) + + it('stubs component inlined in render function with custom stub', () => { + let childComponentCreated = false + let childComponent2Created = false + const ChildComponent = Vue.extend({ + name: 'child-component', + template: '
', + created() { + childComponentCreated = true + } + }) + const ChildComponent2 = { + name: 'child-component-2', + template: '
', + created() { + childComponent2Created = true + } + } + + const ParentComponent = { + name: 'parent-component', + render(h) { + return h('div', [h(ChildComponent), h(ChildComponent2)]) + } + } + + const wrapper = mountingMethod(ParentComponent, { + stubs: { + ChildComponent: { + name: 'child-component', + template: '
' + }, + ChildComponent2: { + name: 'child-component-2', + template: '
' + } + } + }) + + expect(childComponentCreated).toBe(false) + expect(childComponent2Created).toBe(false) + + expect(wrapper.find('.stub').exists()).toBe(true) + expect(wrapper.find('.stub-2').exists()).toBe(true) + expect(wrapper.find(ChildComponent).exists()).toBe(true) + expect(wrapper.find(ChildComponent2).exists()).toBe(true) + }) + + it('stubs component inlined in render function with default stub', () => { + let childComponentCreated = false + let childComponent2Created = false + const ChildComponent = Vue.extend({ + name: 'child-component', + template: '
', + created() { + childComponentCreated = true + } + }) + const ChildComponent2 = { + name: 'child-component-2', + template: '
', + created() { + childComponent2Created = true + } + } + + const ParentComponent = { + name: 'parent-component', + render(h) { + return h('div', [h(ChildComponent), h(ChildComponent2)]) + } + } + + const wrapper = mountingMethod(ParentComponent, { + stubs: { + ChildComponent: true, + ChildComponent2: true + } + }) + + expect(childComponentCreated).toBe(false) + expect(childComponent2Created).toBe(false) + + expect(wrapper.find(ChildComponent).exists()).toBe(true) + expect(wrapper.find(ChildComponent2).exists()).toBe(true) + }) })