How to do it...

The test we will write is an illustration of how Vue's update mechanism works. From there, you will then be able to write asynchronous tests on your own.

In the beforeEach function of our test suite, write the following Vue instance:

describe('my app', () => {  let vm  beforeEach(() => {    vm = new Vue({      template: `        <div>          <input id="name" v-model="name">          <p>Hello from             <span id="output">{{name}}</span>          </p>        </div>      `,      data: {        name: undefined      }    }).$mount()  })})

This will create a component with a text box and a span element that will contain the Hello from ... phrase and whatever is written in the text box.

What we will do to test this component is write Herman in the text box (programmatically, not manually), and then wait for ...

Get Vue.js 2 Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.