0

I have the following to useState hooks:

const [file, setFile] = useState(null);
const [isLoading, setIsLoading] = useState(false);

this is my test:


  test('Happy path', async () => {
    jest
      .spyOn(React, 'useState')
      .mockImplementationOnce(() => [true, () => null])
      .mockImplementationOnce(() => [false, () => null]);
    render(<NarcUploadWindow {...mockPropsSuccess} />);
    const sendButton = await waitFor(() => screen.findByText(`Send`));
    fireEvent.click(sendButton);
    expect(mockPropsSuccess.showSuccessToasterMessage).toHaveBeenCalled();
  });

problem is the file field remains null and the isLoading also doesn't change if I try to set it to true, I have also tried:

import * as React from 'react';
...
const [file, setFile] = React.useState(null);
const [isLoading, setIsLoading] = React.useState(false);

basically all four of combinations the import and the useState

however the problem remains the same, I saw this post: enzyme react useState

but I don't want to use enzyme so the majority of the solutions are not valid without using it

any help on how can I change the initial state of the hooks using jest?

Roie Beck
  • 1,113
  • 3
  • 15
  • 30
  • 3
    *Do not mock hooks.* That is far outside acceptable testing practices and is the reason you're not finding help or resources to answer the question. Test around user behavior, the DOM, and usual unit testing boundaries like network calls. – possum Jan 02 '23 at 13:14

0 Answers0