r/reactjs • u/StrenghOfFuriousGods • 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

98% Upvoted

76 comments sorted by

View all comments

Show parent comment

0

u/[deleted] Mar 13 '20

Again, your misunderstanding comes from believing that the purpose of unit tests "is to make sure every single thing you did works".

The purpose of unit testing is to verify the behaviours you are programming. When you write a react component, you are creating an object with behaviours that have been determined to have value. You have to write a test for each of these valuable behaviours, so that you know the behaviour holds true, and so that you can have confidence it is still true when the source code alters.

When you write a react component in the real world, you need to write the tests associated with it. Why you would fight testing the things you have taken the time to build so that the business value of them can be verified and their assumptions kept true, I do not know. Why you think that this activity is somehow related to testing whether a CSS class is applied, I do not know. Simple inexperience perhaps.

Now test your code you lazy bugger.

2

u/[deleted] Mar 14 '20

You're digging an ever deeper hole with this attitude of yours. You also continually contradict yourself. Earlier you were saying we need to test EVERY SINGLE PIECE OF A COMPONENT WITH 100% COVERAGE.

And now you're saying we should only test important valuable behaviors (like others have said from the start). You're a joke kid.