Building your first test
To illustrate how quick and easy it is to get started with automated tests in a Vue 3 project, we will start by creating a simple test using Vitest (https://vitest.dev/), the officially recommended testing framework for Vue 3 and the simplest to begin with as the installation steps of a new application let you select it right away.
In the following figure, you can see the prompt for installing Vitest:
Figure 11.2 – Creating an application and selecting Yes to using Vitest
After the application is scaffolded, you will find it created a __tests__
folder under components
and created a test already. For now though, delete the file (but not the folder) and create a new __tests__
folder directly under the root of you project. Next, create an App.test.js
file.
We will use shallowMount
to render the application and test whether it displays The Vue.js Workshop Blog. For the purposes of this example, we’ll use the text...