在 Jest 中使用 toBeCalledWith() 测试参数

Question

我的函数使用puppetteer 的page 对象来评估和返回一些数据。

我想用jest 写一个单元测试来检查page.evaluate() 是否接受指定的参数

这是函数

async function cinemasfromState(page, state) {
  const CINEMA_SELECTOR = `div[data-state=$[STATE]] div.top-select-option a.eccheckbox`;
  let res = await page.evaluate(
    (elementPath, state) => {
      let results = Array.from(document.querySelectorAll(elementPath)).map(
        function(cin, index) {
          return {
            //Stuff
          };
          return result;
        },
        { state }
      );
    },
    CINEMA_SELECTOR.replace("$[STATE]", state),
    state
  );

  return res;
}

下面是我的测试的样子

describe("cinemasfromState", () => {
  let page_mock = {
    click: jest.fn(() => Promise.resolve()),
    evaluate: jest.fn((selector, state) => Promise.resolve())
  };

  test("page.evaluate called correctly ", async () => {
    await cinemasfromState(page_mock, "KAN");
    expect(page_mock.evaluate).toBeCalledTimes(1);
    expect(
      page_mock.evaluate)toBeCalledWith(
        "div[data-state=KAN] div.top-select-option a.eccheckbox",
        "KAN"
      );
  });
});

我得到以下错误作为我的测试输出

● cinemasfromState › page.evaluate called correctly

    expect(jest.fn()).toBeCalledWith(expected)

    Expected mock function to have been called with:
      "div[data-state=KAN] div.top-select-option a.eccheckbox"
    as argument 1, but it was called with
      [Function anonymous].

    Difference:

      Comparing two different types of values. Expected string but received function.
      "KAN"
    as argument 2, but it was called with
      "div[data-state=KAN] div.top-select-option a.eccheckbox".
      undefined
    as argument 3, but it was called with
      "KAN".

    Difference:

      Comparing two different types of values. Expected undefined but received string.

      52 |     expect(page_mock1.evaluate).toBeCalledTimes(1);
      53 |     expect(page_mock1.evaluate).toBeCalledWith(
    > 54 |       "div[data-state=KAN] div.top-select-option a.eccheckbox",
         |                            ^
      55 |       "KAN"
      56 |     );
      57 |   });

对编写测试以验证参数有帮助吗？

Answer 1

如果你阅读你的错误日志，你会注意到它试图匹配三个参数，但你只断言两个。开玩笑的.toBeCalledWith 将完全匹配传递给函数的参数及其顺序。

例如，如果你调用func(arg1, arg2)，那么expect(func).toBeCalledWith(arg2) 将失败，因为你没有同时断言arg1。这就是您的情况，因为page.evaluate() 的第一个参数实际上是一个匿名函数。

所以，你的测试需要是这样的：

expect(page_mock.evaluate).toBeCalledWith(
  expect.any(Function),
  "div[data-state=KAN] div.top-select-option a.eccheckbox",
  "KAN"
);