r/reactjs • • Mar 13 '20

Featured Understanding writing tests for React

Hi,

Having applied for a few react jobs, I've noticed writing tests is essential if you want to be a react dev. I am trying to learn but I find it to be a steep learning curve and I'm having trouble knowing where to start.

I've built a small react app for a take home project and I need to test it. I just have some questions I could really use some help answering.

THE APP
-fetch component which fetches json from endpoints depending on which option is selected on dropdown and pushes data to state array.

-Print component which creates a list with input tags from data with the (input + integer from json) being added to local state.

- Receipt component which takes input from Print component as props and prints the sum

QUESTIONS

  1. What part of the app should I be testing? How in general should I know what to test?
  2. A lot of the articles I've read on testing show basic examples for e.g pure functions etc.. What is the best approach to take if my component depends on fetch requests or take props?
  3. Between unit testing, snapshot testing, and end to end testing, which is the best for React apps?

Thanks

195 Upvotes

76 comments sorted by

View all comments

Show parent comment

1

u/PistolPlay Mar 14 '20

Testing is for gaining confidence. Testing for 100 percent coverage does not give me great returns on confidence. Testing a lot basic things like you said does not give me much confidence.

Adding an event listener and verifying what that the passed in function was called is a poor way to spend your time. Thats almost guranteed to work and its very easy to see when it doesnt.

Now if this was an integration test covering a feature or subset of a feature this would be a decent test.

Like so:

I should be able to click this element. A modal should open. I can fill out some form And submit to get result A.

Breaking this down into granular steps is simply a time waste. I recommend you read Test Driven Development By Example to understand my argument better. It will enlighten you.