[IMP] Differences between Enzyme and React Testing Library
2 min readJul 20, 2022
my day to day learning…
Enzymes
- JavaScript Testing utility for React
- Enzyme is a popular testing library from Airbnb
- It provides us to test the implementation details of a React component
- It can provide us with access to the state, props and children components of a React component
React Testing Library:
- It was created by Kent C. Dodds (React Educator)
- It is a light-weight testing library.
- The testing is done from user’s perspective. That’s why this library doesn’t provide us the access to the component’s properties such as it’s state and props.
- The assertions are made from the DOM elements which can be accessed by the utility provided by React Testing Library.
Major differences between Enzyme and React Testing Library
Conceptual difference :
- In Enzyme, we are testing the component using the state and props of the component.
- React Testing Library, we test the component from user’s perspective.
Shallow or deep rendering
- In React Testing Library, we test using the DOM. So, there is no shallow or deep rendering. But in Enzyme, shallow or deep rendering is present.
- React Testing Library doesn’t provide us any means to gain access to the internals of the component.
Example
Conclusion
There is no hard and fast rules on how to test a component. Sometimes, we may need to test the internals of the component when just testing the DOM from user’s perspective may not make sense.
