The repository is designed to compare the idiosyncrasies of most ubiquitous React unit-testing libraries.
It is likely to be confusing for the first time to understand to what extent the libraries differ from each other. To grasp the main concepts, it is strongly advised to process some of the resources, although learning through practice is more effective and can absolutely shorten the time. For those who would like to dive right in, I have gathered a few definitions below.
Rather than tests focusing on the implementation (Enzyme), tests are more focused on user behavior (react-testing-library). (David Boyne, Medium - My experience moving from Enzyme to react-testing-library)
Enzyme allows you to access the internal workings of your components. You can read and set the state, and you can mock children to make tests run faster. On the other hand, react-testing-library doesn't give you any access to the implementation details. It renders the components and provides utility methods to interact with them. The idea is that you should communicate with your application in the same way a user would. So rather than set the state of a component you reproduce the actions a user would do to reach that state. (@Giorgio Polvara - Gpx, StackOverflow - Difference between enzyme, ReactTestUtils and react-testing-library)
The more your tests resemble the way your software is used, the more confidence they can give you. (Kent C. Dodds, Twitter)
Check out the configs folder and jest.config.js.
It is worthwile to mention that RTL can be used out of the box without requiring a separate config file, whereas Enzyme needs an adapter which should be in line with React.
See @testing-library/jest-dom in case you want your tests to be more explicit and readable. It greatly enchances Jest's expectors.
✔️ Find elements [Implementation | Enzyme | RTL]
✔️ Fire events [Implementation | Enzyme | RTL]
✔️ Conditionals [Implementation | Enzyme | RTL]
✔️ Components wrapped inside HOC(s) [Implementation | Enzyme | RTL]
✔️ Asynchronous events [Implementation | Enzyme | RTL]
✔️ Hooks [Implementation | Enzyme | RTL]
- David Boyne, Medium - My experience moving from Enzyme to react-testing-library
- @Black, StackOverflow - Difference between enzyme, ReactTestUtils and react-testing-library
- LevelUpTuts, YouTube - What Is React Testing Library?
- Kent C. Dodds, YouTube - Test Driven Development with react-testing-library
- Leigh Halliday, YouTube - Testing React
- @skyboyer007, Reddit - Use
dive()to access wrapped components
Contributors are welcome and also expected to adhere to the Contributor Covenant.
The project is under the MIT license. For more information read the LICENSE.md file.