feat: Introduce enableAutoDestroy() helper function

Author: winniehell

docs/api/README.md

@@ -8,3 +8,4 @@
 !!!include(docs/api/createLocalVue.md)!!!
 !!!include(docs/api/createWrapper.md)!!!
 !!!include(docs/api/config.md)!!!
+!!!include(docs/api/enableAutoDestroy.md)!!!

docs/api/enableAutoDestroy.md

@@ -0,0 +1,25 @@
+## enableAutoDestroy(hook)
+
+- **Arguments:**
+
+  - `{Function} hook`
+
+- **Usage:**
+
+`enableAutoDestroy` allows to destroy all created `Wrapper` instances using the passed hook function (for example [`afterEach`](https://jestjs.io/docs/en/api#aftereachfn-timeout)).
+
+```js
+import { enableAutoDestroy, mount } from '@vue/test-utils'
+import Foo from './Foo.vue'
+
+// calls wrapper.destroy() after each test
+enableAutoDestroy(afterEach)
+
+describe('Foo', () => {
+  it('renders a div', () => {
+    const wrapper = mount(Foo)
+    expect(wrapper.contains('div')).toBe(true)
+    // no need to call wrapper.destroy() here
+  })
+})
+```

packages/test-utils/src/index.js

@@ -3,7 +3,7 @@ import mount from './mount'
 import createLocalVue from './create-local-vue'
 import RouterLinkStub from './components/RouterLinkStub'
 import createWrapper from './create-wrapper'
-import Wrapper from './wrapper'
+import Wrapper, { enableAutoDestroy } from './wrapper'
 import WrapperArray from './wrapper-array'
 import config from './config'
 import { warn } from 'shared/util'
@@ -20,6 +20,7 @@ export default {
   createLocalVue,
   createWrapper,
   config,
+  enableAutoDestroy,
   mount,
   shallow,
   shallowMount,

packages/test-utils/src/wrapper.js

@@ -25,6 +25,7 @@ export default class Wrapper implements BaseWrapper {
   isFunctionalComponent: boolean
   rootNode: VNode | Element
   selector: Selector | void
+  static _instances: ?Array<Wrapper>
 
   constructor(
     node: VNode | Element,
@@ -68,6 +69,10 @@ export default class Wrapper implements BaseWrapper {
     ) {
       this.isFunctionalComponent = true
     }
+
+    if (Wrapper._instances) {
+      Wrapper._instances.push(this)
+    }
   }
 
   at(): void {
@@ -603,3 +608,23 @@ export default class Wrapper implements BaseWrapper {
     this.element.dispatchEvent(event)
   }
 }
+
+export const enableAutoDestroy = (hook: Function) => {
+  if (Wrapper._instances) {
+    throwError('enableAutoDestroy cannot be called more than once')
+  }
+
+  Wrapper._instances = []
+
+  hook(() => {
+    const { _instances } = Wrapper
+    if (!_instances) {
+      return
+    }
+
+    while (_instances.length > 0) {
+      const wrapper = _instances.pop()
+      wrapper.destroy()
+    }
+  })
+}

test/specs/wrapper.spec.js

@@ -1,4 +1,5 @@
 import { describeWithShallowAndMount } from '~resources/utils'
+import { Wrapper, enableAutoDestroy } from '~vue/test-utils'
 
 describeWithShallowAndMount('Wrapper', mountingMethod => {
   ;['vnode', 'element', 'vm', 'options'].forEach(property => {
@@ -15,4 +16,41 @@ describeWithShallowAndMount('Wrapper', mountingMethod => {
         .with.property('message', message)
     })
   })
+
+  describe('enableAutoDestroy', () => {
+    const sandbox = sinon.createSandbox()
+
+    beforeEach(() => {
+      Wrapper._instances = undefined
+    })
+
+    it('calls the hook function', () => {
+      const hookSpy = sandbox.spy()
+
+      enableAutoDestroy(hookSpy)
+
+      expect(hookSpy).calledOnce
+    })
+
+    it('uses the hook function to destroy wrappers', () => {
+      let hookCallback
+      enableAutoDestroy(callback => {
+        hookCallback = callback
+      })
+      const wrapper = mountingMethod({ template: '<p>con tent</p>' })
+      sandbox.spy(wrapper, 'destroy')
+
+      hookCallback()
+
+      expect(wrapper.destroy).calledOnce
+    })
+
+    it('cannot be called twice', () => {
+      const noop = () => {}
+
+      enableAutoDestroy(noop)
+
+      expect(() => enableAutoDestroy(noop)).to.throw()
+    })
+  })
 })