feat(emitted): add error handling to emitted and emittedByOrder

Author: eddyerburgh

flow/wrapper.js

@@ -8,6 +8,8 @@ declare type Selector = string | Component
 declare interface BaseWrapper { // eslint-disable-line no-undef
     at(index: number): Wrapper | void,
     contains(selector: Selector): boolean | void,
+    emitted(): { [name: string]: Array<Array<any>> } | void,
+    emittedByOrder(): Array<{ name: string; args: Array<any> }> | void,
     exists(): boolean,
     hasAttribute(attribute: string, value: string): boolean | void,
     hasClass(className: string): boolean | void,

src/wrappers/error-wrapper.js

@@ -16,6 +16,14 @@ export default class ErrorWrapper implements BaseWrapper {
     throwError(`find did not return ${this.selector}, cannot call contains() on empty Wrapper`)
   }
 
+  emitted (): void {
+    throwError(`find did not return ${this.selector}, cannot call emitted() on empty Wrapper`)
+  }
+
+  emittedByOrder (): void {
+    throwError(`find did not return ${this.selector}, cannot call emittedByOrder() on empty Wrapper`)
+  }
+
   exists (): boolean {
     return false
   }

src/wrappers/vue-wrapper.js

@@ -8,9 +8,6 @@ function update () {
 }
 
 export default class VueWrapper extends Wrapper implements BaseWrapper {
-  _emitted: { [name: string]: Array<Array<any>> };
-  _emittedByOrder: Array<{ name: string; args: Array<any> }>;
-
   constructor (vm: Component, options: WrapperOptions) {
     super(vm._vnode, update.bind(vm), options)
 
@@ -27,12 +24,4 @@ export default class VueWrapper extends Wrapper implements BaseWrapper {
 
     logEvents(vm, this._emitted, this._emittedByOrder)
   }
-
-  emitted () {
-    return this._emitted
-  }
-
-  emittedByOrder () {
-    return this._emittedByOrder
-  }
 }

src/wrappers/wrapper-array.js

@@ -25,11 +25,22 @@ export default class WrapperArray implements BaseWrapper {
 
     return this.wrappers.every(wrapper => wrapper.contains(selector))
   }
-
   exists (): boolean {
     return this.wrappers.length > 0
   }
 
+  emitted (): void {
+    this.throwErrorIfWrappersIsEmpty('emitted')
+
+    throwError('emitted must be called on a single wrapper, use at(i) to access a wrapper')
+  }
+
+  emittedByOrder (): void {
+    this.throwErrorIfWrappersIsEmpty('emittedByOrder')
+
+    throwError('emittedByOrder must be called on a single wrapper, use at(i) to access a wrapper')
+  }
+
   hasAttribute (attribute: string, value: string): boolean {
     this.throwErrorIfWrappersIsEmpty('hasAttribute')
 

src/wrappers/wrapper.js

@@ -11,6 +11,8 @@ import { throwError } from '../lib/util'
 export default class Wrapper implements BaseWrapper {
   vnode: VNode;
   vm: Component | null;
+  _emitted: { [name: string]: Array<Array<any>> };
+  _emittedByOrder: Array<{ name: string; args: Array<any> }>;
   isVueComponent: boolean;
   element: HTMLElement;
   update: Function;
@@ -47,6 +49,26 @@ export default class Wrapper implements BaseWrapper {
     return false
   }
 
+  /**
+   * Returns an object containing custom events emitted by the Wrapper vm
+   */
+  emitted () {
+    if (!this._emitted && !this.vm) {
+      throwError('wrapper.emitted() can only be called on a Vue instance')
+    }
+    return this._emitted
+  }
+
+  /**
+   * Returns an Array containing custom events emitted by the Wrapper vm
+   */
+  emittedByOrder () {
+    if (!this._emittedByOrder && !this.vm) {
+      throwError('wrapper.emittedByOrder() can only be called on a Vue instance')
+    }
+    return this._emittedByOrder
+  }
+
   /**
    * Utility to check wrapper exists. Returns true as Wrapper always exists
    */

test/unit/specs/mount/Wrapper/emitted.spec.js

@@ -21,11 +21,15 @@ describe('emitted', () => {
     expect(wrapper.emitted().foo).to.exist
     expect(wrapper.emitted().foo.length).to.equal(2)
     expect(wrapper.emitted().foo[1]).to.eql([2, 3, 4])
+  })
+
+  it('throws error when called on non VueWrapper', () => {
+    const wrapper = mount({
+      template: '<div><p /></div>'
+    })
+    const message = '[vue-test-utils]: wrapper.emitted() can only be called on a Vue instance'
 
-    expect(wrapper.emittedByOrder()).to.eql([
-      { name: 'foo', args: [] },
-      { name: 'bar', args: [1, 2, 3] },
-      { name: 'foo', args: [2, 3, 4] }
-    ])
+    const fn = () => wrapper.find('p').emitted()
+    expect(fn).to.throw().with.property('message', message)
   })
 })

test/unit/specs/mount/Wrapper/emittedByOrder.spec.js

@@ -0,0 +1,28 @@
+import mount from '~src/mount'
+
+describe('emittedByOrder', () => {
+  it('captures emitted events in order', () => {
+    const wrapper = mount({
+      render: h => h('div')
+    })
+
+    wrapper.vm.$emit('foo')
+    wrapper.vm.$emit('bar', 1, 2, 3)
+    wrapper.vm.$emit('foo', 2, 3, 4)
+    expect(wrapper.emittedByOrder()).to.eql([
+      { name: 'foo', args: [] },
+      { name: 'bar', args: [1, 2, 3] },
+      { name: 'foo', args: [2, 3, 4] }
+    ])
+  })
+
+  it('throws error when called on non VueWrapper', () => {
+    const wrapper = mount({
+      template: '<div><p /></div>'
+    })
+    const message = '[vue-test-utils]: wrapper.emittedByOrder() can only be called on a Vue instance'
+
+    const fn = () => wrapper.find('p').emittedByOrder()
+    expect(fn).to.throw().with.property('message', message)
+  })
+})

test/unit/specs/wrappers/error-wrapper.spec.js

@@ -15,6 +15,20 @@ describe('ErrorWrapper', () => {
     expect(() => error.contains()).to.throw().with.property('message', message)
   })
 
+  it('emitted throws error when called', () => {
+    const selector = 'div'
+    const message = `[vue-test-utils]: find did not return ${selector}, cannot call emitted() on empty Wrapper`
+    const error = new ErrorWrapper(selector)
+    expect(() => error.emitted()).to.throw().with.property('message', message)
+  })
+
+  it('emittedByOrder throws error when called', () => {
+    const selector = 'div'
+    const message = `[vue-test-utils]: find did not return ${selector}, cannot call emittedByOrder() on empty Wrapper`
+    const error = new ErrorWrapper(selector)
+    expect(() => error.emittedByOrder()).to.throw().with.property('message', message)
+  })
+
   it('hasAttribute throws error when called', () => {
     const selector = 'div'
     const message = `[vue-test-utils]: find did not return ${selector}, cannot call hasAttribute() on empty Wrapper`

test/unit/specs/wrappers/wrapper-array.spec.js

@@ -23,13 +23,37 @@ describe('WrapperArray', () => {
     expect(() => wrapperArray.find()).to.throw().with.property('message', message)
   })
 
-  it('findAll throws error if wrapper is not empty', () => {
+  it('emitted throws error if wrapper is not empty', () => {
+    const wrapperArray = new WrapperArray([])
+    const message = '[vue-test-utils]: emitted cannot be called on 0 items'
+    expect(() => wrapperArray.emitted()).to.throw().with.property('message', message)
+  })
+
+  it('emitted throws error if wrapper is empty', () => {
+    const wrapperArray = new WrapperArray([1, 2, 3])
+    const message = '[vue-test-utils]: emitted must be called on a single wrapper, use at(i) to access a wrapper'
+    expect(() => wrapperArray.emitted()).to.throw().with.property('message', message)
+  })
+
+  it('emittedByOrder throws error if wrapper is not empty', () => {
+    const wrapperArray = new WrapperArray([])
+    const message = '[vue-test-utils]: emittedByOrder cannot be called on 0 items'
+    expect(() => wrapperArray.emittedByOrder()).to.throw().with.property('message', message)
+  })
+
+  it('emittedByOrder throws error if wrapper is empty', () => {
+    const wrapperArray = new WrapperArray([1, 2, 3])
+    const message = '[vue-test-utils]: emittedByOrder must be called on a single wrapper, use at(i) to access a wrapper'
+    expect(() => wrapperArray.emittedByOrder()).to.throw().with.property('message', message)
+  })
+
+  it('findAll throws error if wrapper is  empty', () => {
     const wrapperArray = new WrapperArray([])
     const message = '[vue-test-utils]: findAll cannot be called on 0 items'
     expect(() => wrapperArray.findAll()).to.throw().with.property('message', message)
   })
 
-  it('findAll throws error if wrapper is empty', () => {
+  it('findAll throws error if wrapper is not empty', () => {
     const wrapperArray = new WrapperArray([1, 2, 3])
     const message = '[vue-test-utils]: findAll must be called on a single wrapper, use at(i) to access a wrapper'
     expect(() => wrapperArray.findAll()).to.throw().with.property('message', message)