Your browser is by far one of your best tools to help debug and test your application. In this video, Emmanuel Henri introduces what the major tools available in Chrome are.
- [Instructor] Whenever there's a bug … or your application isn't performing the way you expect, … your first reaction should be to use the Chrome DevTools … or the ones from your favorite browser. … Earlier, we installed a React Dev Tools … and they're also really handy … when we need to debug our application. … I'll explore this one next. … I took a liberty of inserting a few bugs in our application … if you are using the exercise files … look into chapter three and then the start of 03 01, … and if you aren't using them, … I'll point out the bugs … so you can reproduce them in your code. … So if your application isn't running, please do npm start, … and also open up a second terminal … and run the test with npm run test. … So if we take a look at my terminal, … I have the test right now running, … and then I also have the application running here. … So let's go back to our browser. … So as you can see there are a few bugs reported … by both the console, the web browser, and then our test. …
- Setting up for React testing and debugging
- Testing with Jest
- Snapshot testing
- Debugging with Chrome and Chrome extensions
- Optimizing React code with ESLINT
- Type checking