时间戳

首页 > 解决方案 > 如何从 Jest 手动模拟中检查默认导出功能

javascript - 如何从 Jest 手动模拟中检查默认导出功能

问题描述

以下isomorphic-fetch用于 Jest 测试的手动模拟文件返回预期值：

// __mocks__/isomorphic-fetch.ts

import * as req from "./requestData";

const Fetch = (url: string, options: any): Promise<any> => {
  const resultPromise = {
    text: () => {
      return Promise.resolve(req.generateMockResponseData(url, options.body));
    },
  };
  return Promise.resolve(resultPromise);
};

export default Fetch;

但是，当我尝试检查调用它的参数时遇到了问题，因为mock属性 onfetch是未定义的。我尝试了两件事：

首先，我将Fetch函数包装成jest.fn这样：

const Fetch = jest.fn((url: string, options: any): Promise<any> => {
// implementation is same as above
});

export default Fetch;

现在添加后

import _fetchMock  from "isomorphic-fetch"
const fetchMock = _fetchMock as jest.Mock<Promise<any>>;

在测试文件中，我可以检查调用来获取

fetchMock.mock.calls[0]

但是现在fetch在应用程序代码中由于某种原因在测试期间返回未定义。

我尝试的第二件事是从中删除jest.fn包装器Fetch并添加

jest.mock("isomorphic-fetch")

到测试文件。现在fetch在测试期间返回应用程序代码中的预期值，但fetchMock.mock现在再次未定义。

笑话配置：

// jest.config.js
module.exports = {
  "clearMocks": true,
  "coverageDirectory": "../coverage",
  "resetMocks": true,
  "restoreMocks": true,
  "rootDir": "./src",
  "testEnvironment": "jsdom",
  "preset": "ts-jest",
  "coveragePathIgnorePatterns": ["Error.ts"],
  "testEnvironmentOptions": {
    "resources": "usable",
    "features": {
      "FetchExternalResources": ["script", "iframe"],
      "ProcessExternalResources": ["script", "iframe"],
    }
  }
}

GitHub上有一个完整的例子。

标签： javascripttypescriptjestjsfetch

解决方案

Jest spy 和常规模拟函数在相同实现中可能表现不同的原因是 Jest spy 可以重置为无操作。

这正是此 Jest 设置中发生的情况：

...
"resetMocks": true,
"restoreMocks": true,
...

restoreMocks该选项通常是可取的，它通过将间谍方法重置为原始实现来防止测试交叉污染。

resetMocks通常是不可取的并且几乎无法使用，它将可重用间谍从无__mocks__操作实现重置。

TL;DR：resetMocks配置选项并jest.resetAllMocks()破坏可重用间谍的实现，通常应避免。如果需要重置特定的间谍，可以使用mockReset方法在每个案例的基础上完成。

推荐阅读