全部模拟嘲笑/传播

时间:2020-04-09 15:54:05

标签: jestjs axios

我有一个非常基本的组件,该组件使用axios.all进行3次对笑话api的调用,然后将值存储在state中。然后,我将这些值映射到页面上。非常基本的东西。

我正在尝试编写一个模拟axios.all的测试,我可以将一些硬编码的响应传递给它。我想证明呼叫解决后数据绑定正确进行。

我很难做到这一点,我想知道是否有人有任何见识。

Link to CodeSandbox

在此先感谢您提供所有帮助!

1 个答案:

答案 0 :(得分:0)

测试的问题在于您没有嘲笑axios方法。导入库时,仅将其命名为axiosMock并不起作用。

您必须模拟使用的方法:

describe("<TestScreen />", () => {
  afterEach(() => {
    cleanup();
    jest.clearAllMocks();
  });

  beforeEach(() => {
    // Mock all the calls to axios.get, each one returning a response.
    axios.get = jest
      .fn()
      .mockResolvedValueOnce(RESPONSES[0])
      .mockResolvedValueOnce(RESPONSES[1])
      .mockResolvedValueOnce(RESPONSES[2]);

    // Spy on spread method so that we can wait for it to be called.
    jest.spyOn(axios, "spread");
  });

  test("placeholder", async () => {
    const { queryAllByTestId } = render(<App />);

    await waitFor(() => expect(axios.spread).toHaveBeenCalledTimes(1));

    const setups = queryAllByTestId("setup");
    const punchlines = queryAllByTestId("punchline");

    expect(setups.length).toBe(3);
    expect(punchlines.length).toBe(3);
  });
});