Unit test for useMutation hook 's can't be mocked to run onError callback

[ducle-infotrack]

Describe the bug

Description

When running the unit test for the useMuation hook,
The mocked mutation function is expected to be throw error and onError callback is executed, but it appears to not be called at all.

Your minimal, reproducible example

VScode

Steps to reproduce

Steps to Reproduce

1. Run the unit test for useMutation

2. Observe the test results.

import { mount } from 'enzyme';
import { act } from 'react-dom/test-utils';
import { useMutation } from 'react-query';

// Mock the useMutation hook from react-query
jest.mock('react-query');

// Custom hook that uses a mutation from react-query
const useCustomHook = () => {
  const mutation = useMutation((data) => {
    mutationFn: () => api.post(/* data */),
    onError: (err) => {
      toast({
        title: 'error',
        message: err.message,
      });
    },
  });

  return mutation;
};

describe('useCustomHook', () => {
  const mockMutation = jest.fn();

  beforeEach(() => {
    // Mock the return value of useMutation
    (useMutation as jest.Mock).mockReturnValue({ mutate: mockMutation });
  });

  afterEach(() => {
    jest.clearAllMocks();
  });

  it('should handle error when mutation fails', async () => {
    const TestComponent = () => {
      useCustomHook();
      return null; // render nothing
    };

    mount(<TestComponent />);

    const error = new Error('Mutation failed');

    mockMutation.mockImplementation(() => { // or mockRejecteValueOnce
      throw error;
    });

    await act(async () => {
      try {
        await mockMutation(data);
      } catch (err) {
        // Handle error
      }

    expect(mockError).toHaveBeenCalledWith({
      title: 'error',
      message: error.message,
    });
  });
});

Expected behavior

The mockError function should be called with the following arguments:

{
  "title": "error",
  "message": "Mutation failed"
}

How often does this bug happen?

• Every run

Screenshots or Videos

No response

Platform

Node.js version: 18.18.2
NPM/Yarn version: 9.8.1
React version: 18
Testing library: Jest with Enzyme
Operating System: Ubuntu

Tanstack Query adapter

react-query

TanStack Query version

5.14.2

TypeScript version

5.3.3

Additional context

No response

[TkDodo]

// Mock the useMutation hook from react-query
jest.mock('react-query');

Please don't mock the whole query package - just mock your api.post(/* data */), function or the network layer, e.g. with msw.

[justLuiz]

as sugested you should mock your api.post to throw an error, and you easily can point yout assert to toast call