At Radial Development Group, we often choose React for front end views (typically in conjunction with Redux). Since we practice test-driven development, we also set up a test environment.
Here’s an outline of the tools we use and why. Later, we’ll follow up with some in-depth posts on how we use these tools.
When setting up your test environment, you will need at least three things, likely four:
- An assertion library
- A testing framework
- A test builder
- (Optional) Additional project-specific plugins
An assertion library allows the test to expect a certain result in a test. We use Chai.
Mocha is a testing framework that provides functional blocks to write and group your tests, setup and teardown input from plugins and other imported modules; and to run assertions about the system under test. Check out our brief example here on getting started with Mocha.
Webpack is a module bundler (any static asset) that is used to bundle and serve the app’s files.
Read more about webpack.
- Sinon lets you mock a function or an entire object as well as ‘spy’ on whether specific methods have been called in your tests.
Testing React Components
With enzyme you can render react components easily and “traverse your React Components’ output” to make assertions about test results.
We’ll be updating this post and adding others with more in-depth guides to each of these tools. Stay tuned!