I have this react query hook:

import { useTranslation } from 'react-i18next';

import { getListCompetitionsAPI } from 'api/ManualActionsAPI';
import { activityLogHooks } from 'constants/ActivityLog';
import { BranchStatus } from 'models/BranchStatus';
import { Competition } from 'models/Competition';
import { pleaseTryAgainMessage } from 'utils/Context';

import { useQueryWrapper } from '../shared';

interface UseListCompetitionsInterface {
  result: Competition[];
  status: BranchStatus;
}

export const useListCompetitions = (
  sportId: number,
): UseListCompetitionsInterface => {
  const { t } = useTranslation();
  const { result, branchStatus: status } = useQueryWrapper<
    Competition[],
    number
  >(
    [activityLogHooks.listAudits, sportId],
    () => getListCompetitionsAPI(sportId),
    {
      meta: {
        errorMessage: pleaseTryAgainMessage(t, 'listing the competitions'),
      },
      enabled: !!sportId,
    },
  );

  return { result, status };
};


This is the useQueryWrapper:

import {
  QueryFunction,
  QueryObserverResult,
  QueryStatus,
  RefetchOptions,
  RefetchQueryFilters,
  UseQueryOptions,
  useQuery,
} from '@tanstack/react-query';

import { BranchStatus } from 'models/BranchStatus';

const queryStatusToBranchStatus: Record<
  QueryStatus | 'loading' | 'error' | 'success' | 'idle',
  BranchStatus
> = {
  success: BranchStatus.FINISHED,
  loading: BranchStatus.LOADING,
  error: BranchStatus.ERROR,
  idle: BranchStatus.IDLE,
};

interface UseQueryWrapperInterface<T> {
  result: T;
  branchStatus: BranchStatus;
  refetch: <TPageData>(
    options?: (RefetchOptions & RefetchQueryFilters<TPageData>) | undefined,
  ) => Promise<QueryObserverResult>;
}

export const useQueryWrapper = <T, K>(
  key: string[] | [string, K],
  func: QueryFunction<T>,
  opts?: UseQueryOptions<T>,
): UseQueryWrapperInterface<T> => {
  const { data, status, refetch } = useQuery<T>(key, func, opts);
  const result = data as T;
  const branchStatus = queryStatusToBranchStatus[status];
  return { result, branchStatus, refetch };
};


When running this unit test:

 it('should handle fetch failure', async () => {
    (getListCompetitionsAPI as jest.Mock).mockImplementationOnce(() =>
      Promise.reject('Error'),
    );

    const { result } = renderHook(() => useListCompetitions(sportId), {
      wrapper: ({ children }) => (
        <QueryClientProvider client={queryClient}>
          {children}
        </QueryClientProvider>
      ),
    });
    await waitFor(() => {
      expect(getListCompetitionsAPI).toHaveBeenCalled();
      expect(result.current.status).toBe('error');
    });
  });

I get  this error:

 Expected: "error"
    Received: "loading"