Chapter 9. Testing and debugging

 

This chapter covers

  • Creating a test environment that reflects the complexities of an isomorphic app
  • Using Enzyme to create unit tests for your React components
  • Using React Developer Tools to debug in the browser
  • Using Redux Dev Tools to debug in the browser

Have you ever worked in a code base that has lots of tests, but the tests break randomly, require constant updating, and never prevent you from creating regression errors? This situation is surprisingly easy to create when you have more than two developers working on a code base. Having a solid testing strategy and understanding where to draw the line between unit tests and integration tests is important for any app. But isomorphic apps have an additional level of complexity that needs to be thought through: is this a test for code that runs on the server, in the browser, or in both environments?

The first part of this chapter explores how to think about testing an isomorphic app. You’ll learn to test React with Enzyme and how to test your components in multiple environments. The second part of the chapter covers debugging tools that can help with real-world development.

The code for this chapter can be found in the complete-isomorphic-example repo on GitHub:

$ git clone https://github.com/isomorphic-dev-js/complete-isomorphic-
     example.git

Each section has base code provided in a branch. The first branch you’ll use is chapter-9.1.1:

$ git checkout chapter-9.1.1
$ npm install
$ npm start

9.1. Testing: React components

9.2. Testing: thinking isomorphically

9.3. Using debugging tools

Summary

sitemap