TIL - React and Testing
April 09, 2020
What follows is notes from a class. Incomplete thoughts & code that probably will only make sense to me. Given enough time, even that may be a stretch! Reference at your own risk 😂
Slides and more slides specifically about TDD
Setting Up Tests in React with Jest
Jest will automatically look for files with .test
in the name (for example, component.test.js
), and will find test files in directories called __tests__
(in this directory, they don’t need .test
in the file name).
Testing Library
Testing Library is another approach to testing, more focused on the user experience than the implementation of functions in an app. Here is the React version and here’s the Vue version.
To test user interaction, it has a user-event
ecosystem.
Snapshot Testing
Jest can do snapshot testing which allows you to take a snapshot (hence the name) of the HTML produced from a component, and then lets you compare that snapshot when future changes are made. Leigh Halliday wrote a post Introduction to the React Testing Library which explains the concept and shows some demos.