28 Mar How We Successfully Migrated from Enzyme to React Testing Library

In this case study, we showcase how our team of 2 Front-end engineers successfully navigated the complex transition of unit tests from Enzyme to React Testing Library (RTL) for a finance industry client over eight months.
Our efforts resulted in enhanced testing efficiency, improved application stability, and significant cost reductions, all while ensuring seamless migration.

An overview:

About the Client

The company is a San Francisco-based organization specializing in financial services. They offer a comprehensive solution tailored for small and medium-sized businesses, focusing on payroll processing, benefits administration, and compliance management, ensuring a seamless experience for their clients.

About the Project

Our client needed help with their existing unit tests, which were written in Enzyme. These tests were slow, complex, and challenging to maintain, resulting in high resource consumption during testing. Additionally, the client faced issues with bad patterns and flaky tests, which contributed to inconsistent test results and reduced the reliability of the testing process. Our team recommended transitioning the unit tests from Enzyme to React Testing Library (RTL), which better aligns with user behavior and emphasizes testing components as users interact with them.

Our main project goals were to improve testing efficiency and application stability while ensuring the client’s application remains operational throughout the migration process.

Challenges

Enzyme tests focus on testing individual components, while RTL tests are structured around use cases. Due to this different approach, we had to analyze the coverage of each Enzyme test and then adjust the tests for each specific use case. In some instances, several Enzyme tests were consolidated into a single RTL test. This complexity and volume of tests presented a challenge for our team.

Results

After eight months of dedicated effort, our team successfully converted all unit tests from Enzyme to RTL. The migration to RTL had many benefits.

Faster Test Execution: The adoption of RTL led to quicker test runs, resulting in reduced build times and faster feedback loops for our development team. For some tests, the improvement was up to 15 seconds!

Simplified Test Maintenance: The simpler and more intuitive queries provided by RTL made our tests easier to read, understand, and maintain. Additionally, RTL tests are less coupled to the implementation details of the components, making them more resilient to changes in the underlying code.

Enhanced Test Coverage: The transition to RTL allowed us to achieve more comprehensive testing, covering a wider range of application behaviors and use cases. In total, we wrote over 800 tests, ensuring thorough coverage of the application’s functionality and reducing the likelihood of regressions.

Reduced Resource Consumption: By optimizing our Continuous Integration (CI) process to run only changed and new tests, we were able to lower the costs associated with resource usage

Improved Application Robustness: Our removal of obsolete and flaky tests significantly improved the application’s robustness and the reliability of our testing suite.

Better Test Structure: RTL encouraged a more structured approach to testing, aligning with best practices and ensuring cleaner, more reliable tests.

Increased Testing Efficiency: With RTL, our tests became more focused and efficient, leading to quicker identification and resolution of issues.

Explore our case studies and find out how we help our clients achieve their goals: Case studies.