Vue.js 2 Cookbook

How to do it...

Let's suppose that you are writing a component that displays the Hello World! greeting; you want to test that the greeting is actually displayed, but the web page you are testing is already complex enough and you want to test your component in isolation.

Turns out you don't have to actually display the component to prove that it works. You can display and test your component outside the document.

Write the following setup for your greeting in your test file or test part of your page:

describe('my app', () => {  let vm  beforeEach(() => {    vm = new Vue({      template: '<div>{{greetings}}</div>',      data: {        greetings: 'Hello World'      }    })  })})

To materialize our Vue instance as an off-document element, we just need to add the $mount() ...