diff --git a/packages/test-utils/src/create-wrapper.js b/packages/test-utils/src/create-wrapper.js index 23043460b..dbd69d993 100644 --- a/packages/test-utils/src/create-wrapper.js +++ b/packages/test-utils/src/create-wrapper.js @@ -7,7 +7,11 @@ import VueWrapper from './vue-wrapper' export default function createWrapper ( node: VNode | Component, options: WrapperOptions -) { +): VueWrapper | Wrapper { + const componentInstance = node.componentInstance || node.child + if (componentInstance) { + return new VueWrapper(componentInstance, options) + } return node instanceof Vue ? new VueWrapper(node, options) : new Wrapper(node, options) diff --git a/packages/test-utils/src/wrapper.js b/packages/test-utils/src/wrapper.js index 81a9b2161..d4eff61a2 100644 --- a/packages/test-utils/src/wrapper.js +++ b/packages/test-utils/src/wrapper.js @@ -323,6 +323,11 @@ export default class Wrapper implements BaseWrapper { typeof selector === 'string' ? selector : 'Component' ) } + // Using CSS Selector, returns a VueWrapper instance if the root element + // binds a Vue instance. + if (nodes[0].elm === this.element) { + return this + } return createWrapper(nodes[0], this.options) } @@ -333,7 +338,13 @@ export default class Wrapper implements BaseWrapper { findAll (selector: Selector): WrapperArray { getSelectorTypeOrThrow(selector, 'findAll') const nodes = findAll(this.vm, this.vnode, this.element, selector) - const wrappers = nodes.map(node => createWrapper(node, this.options)) + const wrappers = nodes.map(node => { + // Using CSS Selector, returns a VueWrapper instance if the root element + // binds a Vue instance. + return node.elm === this.element + ? this + : createWrapper(node, this.options) + }) return new WrapperArray(wrappers) } diff --git a/test/specs/wrapper/find.spec.js b/test/specs/wrapper/find.spec.js index fb7677f66..ae2fb7e62 100644 --- a/test/specs/wrapper/find.spec.js +++ b/test/specs/wrapper/find.spec.js @@ -20,12 +20,14 @@ describeWithShallowAndMount('find', mountingMethod => { const compiled = compileToFunctions('

') const wrapper = mountingMethod(compiled) expect(wrapper.find('p').vnode).to.be.an('object') + expect(wrapper.find('p').vm).to.equal(undefined) }) it('returns Wrapper matching class selector passed', () => { const compiled = compileToFunctions('
') const wrapper = mountingMethod(compiled) expect(wrapper.find('.foo').vnode).to.be.an('object') + expect(wrapper.find('.foo').vm).to.equal(undefined) }) it('returns Wrapper matching class selector passed if nested in a transition', () => { @@ -395,4 +397,20 @@ describeWithShallowAndMount('find', mountingMethod => { .with.property('message', message) }) }) + + itDoNotRunIf( + mountingMethod.name === 'shallowMount', + 'returns a VueWrapper instance by CSS selector if the element binds a Vue instance', () => { + const childComponent = { + name: 'bar', + template: '

' + } + const wrapper = mountingMethod({ + name: 'foo', + template: '

', + components: { childComponent } + }) + expect(wrapper.find('div').vm.$options.name).to.equal('foo') + expect(wrapper.find('p').vm.$options.name).to.equal('bar') + }) }) diff --git a/test/specs/wrapper/findAll.spec.js b/test/specs/wrapper/findAll.spec.js index 7908fe6df..72e785a5f 100644 --- a/test/specs/wrapper/findAll.spec.js +++ b/test/specs/wrapper/findAll.spec.js @@ -323,4 +323,22 @@ describeWithShallowAndMount('findAll', mountingMethod => { .with.property('message', message) }) }) + + itDoNotRunIf( + mountingMethod.name === 'shallowMount', + 'returns a WrapperArray which includes VueWrapper if the elements binds a Vue instance', () => { + const childComponent = { + name: 'bar', + template: '

' + } + const wrapper = mountingMethod({ + name: 'foo', + template: '

', + components: { childComponent } + }) + const wrappers = wrapper.findAll('.foo') + expect(wrappers.at(0).vm.$options.name).to.equal('foo') + expect(wrappers.at(1).vm).to.equal(undefined) + expect(wrappers.at(2).vm.$options.name).to.equal('bar') + }) }) diff --git a/test/specs/wrapper/setChecked.spec.js b/test/specs/wrapper/setChecked.spec.js index 2cbd6da16..44e3423f7 100644 --- a/test/specs/wrapper/setChecked.spec.js +++ b/test/specs/wrapper/setChecked.spec.js @@ -84,11 +84,11 @@ describeWithShallowAndMount('setChecked', mountingMethod => { }) it('throws error if wrapper does not contain element', () => { - const wrapper = mountingMethod({ render: h => h('div') }) - const div = wrapper.find('div') - div.element = null + const wrapper = mountingMethod({ template: '

' }) + const p = wrapper.find('p') + p.element = null - const fn = () => div.setChecked() + const fn = () => p.setChecked() const message = '[vue-test-utils]: cannot call wrapper.setChecked() on a wrapper without an element' expect(fn) diff --git a/test/specs/wrapper/setSelected.spec.js b/test/specs/wrapper/setSelected.spec.js index f60b3ed26..474f32fc8 100644 --- a/test/specs/wrapper/setSelected.spec.js +++ b/test/specs/wrapper/setSelected.spec.js @@ -34,11 +34,11 @@ describeWithShallowAndMount('setSelected', mountingMethod => { }) it('throws error if wrapper does not contain element', () => { - const wrapper = mountingMethod({ render: h => h('div') }) - const div = wrapper.find('div') - div.element = null + const wrapper = mountingMethod({ template: '

' }) + const p = wrapper.find('p') + p.element = null - const fn = () => div.setSelected() + const fn = () => p.setSelected() const message = '[vue-test-utils]: cannot call wrapper.setSelected() on a wrapper without an element' expect(fn) diff --git a/test/specs/wrapper/setValue.spec.js b/test/specs/wrapper/setValue.spec.js index 228c658fc..0727a798a 100644 --- a/test/specs/wrapper/setValue.spec.js +++ b/test/specs/wrapper/setValue.spec.js @@ -20,12 +20,11 @@ describeWithShallowAndMount('setValue', mountingMethod => { }) it('throws error if wrapper does not contain element', () => { - const wrapper = mountingMethod({ render: h => h('div') }) - const div = wrapper.find('div') - div.element = null - const fn = () => div.setValue('') - const message = - '[vue-test-utils]: cannot call wrapper.setValue() on a wrapper without an element' + const wrapper = mountingMethod({ template: '

' }) + const p = wrapper.find('p') + p.element = null + const fn = () => p.setValue('') + const message = '[vue-test-utils]: cannot call wrapper.setValue() on a wrapper without an element' expect(fn) .to.throw() .with.property('message', message) diff --git a/test/specs/wrapper/text.spec.js b/test/specs/wrapper/text.spec.js index 72634eddb..7e45f013e 100644 --- a/test/specs/wrapper/text.spec.js +++ b/test/specs/wrapper/text.spec.js @@ -20,14 +20,13 @@ describeWithShallowAndMount('text', mountingMethod => { expect(wrapper.text()).to.equal(text) }) - 152 + it('throws error if wrapper does not contain element', () => { - const wrapper = mountingMethod({ render: h => h('div') }) - const div = wrapper.find('div') - div.element = null - const fn = () => div.text() - const message = - '[vue-test-utils]: cannot call wrapper.text() on a wrapper without an element' + const wrapper = mountingMethod({ template: '

' }) + const p = wrapper.find('p') + p.element = null + const fn = () => p.text() + const message = '[vue-test-utils]: cannot call wrapper.text() on a wrapper without an element' expect(fn) .to.throw() .with.property('message', message) diff --git a/test/specs/wrapper/trigger.spec.js b/test/specs/wrapper/trigger.spec.js index 9b102ad14..457df809b 100644 --- a/test/specs/wrapper/trigger.spec.js +++ b/test/specs/wrapper/trigger.spec.js @@ -158,10 +158,10 @@ describeWithShallowAndMount('trigger', mountingMethod => { }) it('throws error if wrapper does not contain element', () => { - const wrapper = mountingMethod({ render: h => h('div') }) - const div = wrapper.find('div') - div.element = null - const fn = () => div.trigger('click') + const wrapper = mountingMethod({ template: '

' }) + const p = wrapper.find('p') + p.element = null + const fn = () => p.trigger('click') const message = '[vue-test-utils]: cannot call wrapper.trigger() on a wrapper without an element' expect(fn)