jest.mock()内使用jest.fn()定义mock调用返回undefined问题排查

你遇到的问题是CRA（Create React App）默认开启了resetMocks: true的Jest配置导致的：
这个配置会在每个测试用例执行前自动调用jest.resetAllMocks()方法，该方法会清空所有jest.fn()创建的模拟函数的自定义实现、返回值配置、调用历史记录。你在jest.mock工厂函数中给模拟函数设置的初始返回值会被这个逻辑清除，因此调用时返回undefined。
而你替换为普通函数后，普通函数不属于Jest的模拟函数范畴，不会被resetMocks逻辑影响，所以运行正常。

你可以执行npx jest --showConfig命令查看当前生效的Jest配置，确认是否存在resetMocks: true的配置项，CRA创建的项目默认开启该配置。

• 方案1：在测试前置钩子中重新为模拟函数配置返回值（推荐，不影响全局配置）

import foo, { bar, baz } from './util'

beforeEach(() => {
  // TypeScript 场景需要先断言为 jest.Mock 类型
  (foo as jest.Mock).mockReturnValue('mocked foo')
  (bar as jest.Mock).mockReturnValue('mocked bar')
  (baz as jest.Mock).mockReturnValue('mocked baz')
})

• 方案2：关闭resetMocks配置
  可以在package.json的jest配置段中将resetMocks改为false，该方案不推荐，容易导致测试用例之间的模拟数据互相污染。
• 方案3：无需验证函数调用行为时直接使用普通函数模拟
  也就是你现在去掉jest.fn()的写法，实现更简洁，适合不需要校验函数调用次数、入参的场景。

内容的提问来源于stack exchange，提问作者Kevin Gilbert