期望“间谍”至少被调用一次 Vitest

Question

我收到错误 - 预期“间谍”在调用时至少被调用一次

expect(log.warn).toHaveBeenCalled();

我不明白为什么会这样，因为我正在测试的函数正在调用该函数

log.warn(.....)

单元测试

describe('handleServerError', () => {
    it('should set error message in store and log the error', () => {
      vi.mock('common/helpers/server-error-message.js', async () => {
        const actual = await vi.importActual('common/helpers/server-error-message.js');
        return {
          ...actual,
          getErrorCodeFromEvent: () => 27001,
        };
      });
      actions.handleServerError(context);
      expect(context.commit).toHaveBeenCalledWith('setServerErrorCode', 27001);
      expect(log.warn).toHaveBeenCalled();
    });
  });

Vue 商店动作

handleServerError(context, e) {
    log.warn(getServerErrorLogMessage('getLicenses', e));
    const code = getErrorCodeFromEvent(e);
    context.commit('setServerErrorCode', code);
  },

也许有人遇到过这种情况并以某种方式克服了它？

我已经尝试了 vitest 文档中的许多不同变体来测试这个，但没有帮助，也没有在 stackoverflow 中找到解决方案

Answer 1

在开始测试之前尝试监视函数

vi.spyOn(console, 'warn');

这实质上为该功能创建了一个模拟

https://vitest.dev/api/#vi-spyon

Answer 2

这不会解决这个问题。但是我发布了我遇到的东西。我做错的是缺少添加我的包装器组件

const mockedUsedNavigate = vi.fn();

vi.mock('react-router-dom', async () => {
  const actual: object = await vi.importActual('react-router-dom');

  return {
    ...actual,
    useNavigate: () => mockedUsedNavigate,
  };
});

test('should navigate to dashboard', () => {
  const { result } = renderHook(() => useAuth());

  act(() => {
    result.current.login('token');
  });

  expect(mockedUsedNavigate).toBeCalledWith('/dashboard', { replace: true });
});

然后我更新它添加包装器组件

const { result } = renderHook(() => useAuth(), { wrapper });

这就是它的样子

interface WrapperProps extends MemoryRouterProps {
  children: React.ReactNode;
}

export const wrapper: React.FC<WrapperProps> = ({
  children,
  ...routerProps
}) => (
  <MemoryRouter {...routerProps}>
    <QueryClientProvider client={queryClient}>
      <AuthProvider>{children}</AuthProvider>
    </QueryClientProvider>
  </MemoryRouter>
);