React testing problem

1

Hi everyone,

I have learnt full stack web development for several months but am still struggling with testing. Are there any good resources for learning testing, especially with tools like Enzyme and Jest for beginners? Btw, anyone could explain how one should test fetch in a function component? I have found sth like below:

         const mockSuccessResponse = {data:{...}};
        const mockJsonPromise = await Promise.resolve(mockSuccessResponse); 
        const mockFetchPromise =await Promise.resolve({ 
            json: () => mockJsonPromise,
        });
        jest.spyOn(global, 'fetch').mockImplementation(() => mockFetchPromise); 

        process.nextTick(() => { 
            expect(wrapper...).toBe(...)
      
            global.fetch.mockClear(); 
            done(); 
        });

My question is in my functional component, there are several fetch functions,.Which one will be mocked with the above code?

2

Hi there!

What does that exactly mean?
What are you struggling with?

If you want to learn testing, I wouldn’t start with mocking functions. This is probably putting the cart before the horse.

I would start with the simplest steps:

  • if the component gets rendered at all
  • if the component has some specific items (you pass props, do they exist?)
  • if the UI components show up
    etc.

Testing is a lot about thinking:

  • Why do I want to test this thing?
  • What is the purpose of this thing?
  • What is the core feature of this thing?
  • How should the user see this thing?

I would read this:

So what is your best guess and why?

3

Thank you so much. I will read through the materials before taking a guess. :grin:

1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.