From the course: Testing in React with Vitest
Unlock the full course today
Join today to access over 24,000 courses taught by industry experts.
Snapshot testing: Part 2 - React.js Tutorial
From the course: Testing in React with Vitest
Snapshot testing: Part 2
- [Instructor] Now, from the above code structure, we can see we have an asynchronous function that fetches data from our mock database, and we are able to simulate a network call to the database for this test. This is a good use case for testing and is a frequent function in almost all web applications. Let's go ahead and create a test file in our test folder called Fruits.test.tsx. So in our test folder, let's do Fruits.test.tsx. I have copied the code from chapter 2-3-N, and I'll paste it in the file. We begin by importing, describe, expect, and it from vitest. Then we import our fruits component from our fruit component. Then we describe our Fruit Snapshot Test, and it should be loading fruit data. But it can be whatever you want, loading fruit data. Describe the keyword used here is used to organize tests into logical functions. It's not uncommon to have different components tested in one file. We can also use it to classify our tests based on functionality. Expect, another…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.