In this Vue 3 tutorial, we learn how to compare two images of an application with snapshot testing. We cover how to write and compare snapshots with Jest, how to update an older snapshot and how to use mocked data in a test.
We cover the following topics:
1. Lesson Project
2. What is Snapshot Testing
3. How to write a snapshot test with Jest
4. How to update a snapshot
5. How to use mocked data in a snapshot test
Note that this tutorial is for the Vue 3 Options API (which is similar to Vue 2). We later move on to the Composition API and then the Script Setup (3.2 update)
Jest Test Runner
https://jestjs.io/
Jest Snapshot Documentation
https://jestjs.io/docs/expect#tomatch...
Jest VSCode Extension
https://marketplace.visualstudio.com/...
Vue CLI Unit Jest Plugin
https://cli.vuejs.org/core-plugins/un...
Vue Jest
https://github.com/vuejs/vue-jest
Vue Testing Utilities
https://next.vue-test-utils.vuejs.org/
This lesson is also available in written format
https://www.koderhq.com/tutorial/vue/...
Check out the Vue 3 for Beginners playlist for more Vue tutorial videos
• Vue 3 for Beginners
Subscribe to the channel and never miss a lesson
/ @koderhq
Visit the website for a wide range of programming tutorials
https://www.koderhq.com