How it works...

Let's assume that you have the following Vue application in an index.html file:

<!DOCTYPE html><html><head>  <title>7.6</title>  <script src="https://unpkg.com/vue/dist/vue.js"></script></head><body>  <div id="app">    <h2>Welcome to my test page</h2>    <button id="showBtn" @dblclick="show = true">      Show    </button>    <p v-show="show">Hello Nightwatch!</p>  </div></body></html>

Just after the <div> element, add this script:

<script>  const vm = new Vue({    el: '#app',    data: {      show: false    }  })</script>

You can serve your app with http-server. Go to http://localhost:8080 with your browser, and you can try double-clicking on the button to make the text appear.

Now, if we want to test that, we look at nightwatch's API and discover that it ...

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.