In the new Content View page for Katello, I introduced and wrote tests using react-testing-library. You can see the PR and tests here. There has been some interest in this library and seeing if it is a good fit for us.
I found it to be very intuitive and I really liked how it can replicate user interaction. This is similiar to cypress.io, which we have also had discussions about introducing, but react-testing-library doesn’t require the full-stack environment. A fully provisioned environment is challenging and resource-intensive to recreate in a CI server, especially for Katello.
react-testing-library is a way to get the benefits of integration testing at the PR level without needing more resources to do so. It was very easy to run the new tests along with the others in the already existing
npm test command, and no CI changes were needed. The library also integrates nicely with jest.
The library author’s philosophy is to test your React components as a user would interact with them and not to test implementation details of your code. I feel this is in line with some of the discussions around testing we have had lately.
The major benefits I see are:
- Bug and regression prevention as we test actual user workflows
- Able to test the workflows and UI interaction that we develop with UX professionals
- Worry-free refactoring as our tests are not tied to implementation details, meaning refactoring UI code will not require as much test refactoring.
- Ability to use TDD to recreate bugs with a test and iterate on the fix.
I’m not suggesting we get rid of existing enzyme snapshots, but would like to see
react-testing-library added to the foreman-js as a development dependency and would encourage its use in new pages instead of enzyme snapshots to test user interaction. I think this will bring us more confidence in our UI code, easier and safer refactoring, and more intuitive testing.
Please let me know what you think!