如何从 Jest 手动模拟中检查默认导出 function

Question

The following manual mock file of isomorphic-fetch for Jest tests returns the expected values:

// __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;

However I've ran into problems when trying to inspect the arguments with which it was called, as the mock property on fetch was undefined. I've tried two things:

First, I've wrapped the Fetch function in jest.fn like this:

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

export default Fetch;

Now after adding

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

in the test file, I can inspect calls to fetch with

fetchMock.mock.calls[0]

But now fetch in the application code returns undefined during tests for some reason.

The second thing I've tried was removing the jest.fn wrapper from Fetch and adding

jest.mock("isomorphic-fetch")

to the test file. Now fetch returns the expected values in the application code during tests, but fetchMock.mock is now undefined again.

Jest config:

// 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"],
    }
  }
}

There is a complete example on GitHub.

Answer 1

The reason why Jest spy and regular mocked function may behave differently with the same implementation is that Jest spy can be reset to be a no-op.

This exactly what happens in this Jest setup:

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

restoreMocks option is generally desirable, it prevents test cross-contamination by resetting spied methods to original implementations.

resetMocks is generally undesirable and virtually unusable, it resets reusable spies from __mocks__ to no-op implementation.

TL;DR: resetMocks configuration option and jest.resetAllMocks() destroy the implementations of reusable spies and should be generally avoided. If a specific spy needs to be reset, this can be done on a per-case basis with mockReset method.