jest.fn() 里面 jest.mock() returns 未定义

Question

我有一个带有默认导出和 2 个命名导出的简单“util”模块。

const foo = () => 'foo'
export default foo
    
export const bar = () => 'bar'
export const baz = () => 'baz'

在我的测试中，我是这样嘲笑它的：

jest.mock('./util', () => ({
  __esModule: true,
  default: jest.fn(() => 'mocked foo'),
  bar: jest.fn(() => 'mocked bar'),
  baz: jest.fn(() => 'mocked baz'),
}))

describe('util', () => {
  //...
})

在我的组件上，当我调用 foo()、bar() 或 baz() 时，我收到了 undefined。但是如果我像那样删除 jest.fn() 一切正常：

jest.mock('./util', () => ({
  __esModule: true,
  default: () => 'mocked foo',
  bar: () => 'mocked bar',
  baz: () => 'mocked baz',
}))

我的示例与 jest doc 上的示例非常接近： https://jestjs.io/docs/mock-functions#mocking-partials

我正在使用 React (CRA) 和 TypeScript

我知道模拟模块有不同的方法，但我很想了解我面临的问题。

知道我做错了什么吗？ :) 谢谢！

Answer 1

我运行遇到了同样的问题（也是运行 CRA）并发现这可能是原因：

https://github.com/facebook/jest/issues/9131#issuecomment-668790615

A little late here, but I was just having this exact issue. I discovered that someone had added resetMocks: true to the jest.config.js file. This means that the implementations of mock functions are reset before each test. So in our case, the mock function was being included in the mocked module at test runtime, but that mock had been reset, so it returned undefined.

Regarding the original issue build environment, it looks like react-scripts does indeed add resetMocks: true into the jest config. (https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/scripts/utils/createJestConfig.js#L69) But you can override it on the jest key of your package.json. (https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/scripts/utils/createJestConfig.js#L74)

jest.fn() 里面 jest.mock() returns 未定义

jest.fn() inside jest.mock() returns undefined

testing

typescript

reactjs

jestjs

create-react-app