View profile

Deep dive into Testing React

Revue
 
Hey folks, I hope you are doing fine learning React, GraphQL and Firebase with my books. The last two
 

Robin Wieruch - A Developer's Newsletter

October 21 · Issue #25 · View online
Hello, it's Robin. I am the author of books such as The Road to React, The Road to GraphQL, and many other online tutorials about JavaScript and its ecosystem. This is my newsletter which delivers comprehensive tutorials, books, and courses straight to your inbox. Quality content only. Give it a chance and become a better developer every month.

Hey folks, I hope you are doing fine learning React, GraphQL and Firebase with my books. The last two months I have been busy launching my new Website with Gatsby. I am super happy with the result and would love to hear your feedback.
Did you already have the chance to work with Gatsby? If yes, let me know about your experiences. If not, maybe what I like about Gatsby.js convinces you :-)
If you just want to get started with a personal website in Gatsby yourself, check out this starter project – which I used myself – which comes with:
  • MDX Markdown
  • Blog Post Categories & Pagination
  • Syntax Highlighting
In other news, I started a Twitter Poll about React Styling yesterday which went quite viral. Make sure to give your vote there as well.
This month I aggregated my new tutorials into one topic:
  • Deep dive into React Testing
If they excite you, give me a thumbs up. If they don’t, let me know what you want to learn about in JavaScript instead :-)

Deep dive into React Testing
There are many libraries and combinations of these libraries that you can use for bare bones React Testing:
The last three months, I worked with one larger client of mine and we settled on only using Jest for testing React components (1). It went surprisingly well and I would do it again for my next projects. Sometimes there is no need to throw yet another library on top of it.
However, if you are looking for more conveniences, testing React with Enzyme (2) or RTL (3) gives you more abstractions on top. But again, your whole development team needs to adjust to yet another testing library.
If you are coming from Node.js, testing your React components with Mocha/Chai/Sinon (4) may be more familiar to you. That’s how I learned testing frontend applications at least; but times have changed and thus I think the other solutions are more popular now.
Regardless of which solution you pick, throwing Cypress on top for E2E Testing isn’t a bad idea. Especially if you are working on more complex user interactions and/or larger web applications, it saves you lots of time in the aftermath, because you don’t have to do much manual testing for every deployment anymore. Read more about testing React with Cypress.
In one of my last projects, the PM enforced a testing coverage of 95%. Generally, I don’t agree with a threshold as high as 95%, but then again I just shifted my perspective on things and took it as opportunity to learn more about testing. Read more about setting up a CI + Test Coverage.
If you are like me and you want to double down on a simple renderer + Jest for testing React applications, you may enjoy these tutorials to boost your Jest knowledge:
That’s it from my side for this month with the latest updates for React and the JS ecosystem. Let me know what you want to learn about next and I try to cover it in one of my tutorials. Wishing you a good time.
Cheers, Robin
PS.: If you read one of my books, it would mean the world to me if you would leave a nice review for one of them.
Monthly Pick
Just recently I watched Mortal Engines and Ready Player One. I am not sure about the performance of the actors, because I am not that much into movies, but it’s just amazing how these kind of movies let you escape into another world. So if you feel like shutting your systems down, give them a try if you haven’t already.
Did you enjoy this issue?
If you don't want these updates anymore, please unsubscribe here
If you were forwarded this newsletter and you like it, you can subscribe here
Powered by Revue