Go Pro Sign Up Login
0 days 0 hrs 0 min 0 sec

Summer Sale

50% off Level Up Pro until you unsubscribe.
Get access to ALL 128 courses on Level Up Tutorials

This is your last chance to get Level Up Pro for $145/year.

or Learn More
Moon Moon

Buy Now and unlock this series




yours forever

Become a Pro and unlock everything




per month

Refactoring With Tests

In this video, we are going to start refactoring with our tests. We will be creating a few more folders and files to keep our code and tests better organized.


Become a pro to download code and videos


User avatar


over 2 years ago

Heads up Scott,

When checking the movies returned from the api in MoviesList, you have added a check for if (movies.success). When the api fails to return data, it returns an object with the success key set to false. So in the code you are checking for success to be true. However when the api returns successfully, there is no success key set at all. And therefore the movies never show on the screen (Because in your example you are not actually displaying the movies, this error is not apparent in the videos).

Changing the check from if (movies.success) to if (movies.results) fixes the issue :)


over 2 years ago [edited]

Hi, I tried adding a test to App.js

But it throws an error about the ajax call on MoviesList.test.js, so if I go ahead and add a mock response just as we did on MoviesList.test.js the error goes away.

My question is, is it correct to add again the same mocked response in App.js? It seems wrong to have to mock the response of the movies api twice, once in MoviesList.test.js and then in App.test.js

Also, how would you go about if there are two components with ajax calls? how do you say, one is for one component and another is for another.

Right now is just: fetch.mockResponseOnce(JSON.stringify(movies))

How would one do it when there are say two ajax calls, one in MoviesList.test.js and another in another compoent.


Want to join the conversation?

Become a Pro member today!