Sample integration tests implementation for a common react app structure
Read more about the the project and reasoning here.
Goal of the app implementation is follow a common react app structure and patterns while keeping it simple and small for ease of reading and understanding.
The app implements a simple use case:
- User enters a GitHub username
- App displays a list of public repositories associated with the entered username
The app includes:
- API requests (axios)
- Internationalization support (react-intl-universal)
- Global state management (redux + redux-thunk)
- CSS in JS solution (@material-ui/styles)
- SPA routing (react-router-dom)
The project was bootstrapped with Create React App.
Integration tests are written from User perspective and ignore as much of implementation details as possible. Instead, tests assert that user can interact with the DOM to fulfill a certain scenario.
Integration tests are written using:
- jest: JavaScript testing framework
- react-testing-library: Simple and complete React DOM testing utilities that encourage good testing practices.
- jest-dom: Custom jest matchers to test the state of the DOM.
- nock: HTTP server mocking and expectations library.