Jest/Enzyme测试中Prop-function Mock已调用但断言失败问题

嘿，我碰到过好几个类似的情况，咱们一步步来排查哈！你说日志明明显示theFunctionIWantToTest被调用了，但断言就是失败，大概率是这几个原因：

1. 组件缓存了Props函数的引用 #

这是最常见的坑！如果你的组件在构造函数或者某个生命周期里，把this.props.theFunctionIWantToTest赋值给了实例变量（比如this.myFunc = props.theFunctionIWantToTest），那测试时传入的Mock函数可能没被用到——因为组件已经用了初始化时的引用。

解决办法：
在onSomethingDoSomething方法里直接调用this.props.theFunctionIWantToTest()，不要缓存到实例变量里。比如把：

// 错误写法
constructor(props) {
  super(props);
  this.myFunc = props.theFunctionIWantToTest;
}

onSomethingDoSomething() {
  this.myFunc();
}

改成：

// 正确写法
onSomethingDoSomething() {
  this.props.theFunctionIWantToTest();
}

2. 断言的时机不对（异步/状态更新延迟） #

如果onSomethingDoSomething里有异步操作（比如setTimeout、接口请求），或者依赖组件状态更新，Jest会在异步操作完成前就执行断言，导致看起来函数被调用了，但断言时还没触发。

解决办法：

• 要是用了定时器，用Jest的假定时器：

jest.useFakeTimers();
const mockFunc = jest.fn();
const wrapper = shallow(<MyComponent theFunctionIWantToTest={mockFunc} />);

wrapper.instance().onSomethingDoSomething();
jest.runAllTimers(); // 执行所有待处理的定时器

expect(mockFunc).toHaveBeenCalled();

• 要是是其他异步操作，用async/await配合waitFor：

test('triggers the target function', async () => {
  const mockFunc = jest.fn();
  const wrapper = shallow(<MyComponent theFunctionIWantToTest={mockFunc} />);

  wrapper.instance().onSomethingDoSomething();
  
  await waitFor(() => {
    expect(mockFunc).toHaveBeenCalled();
  });
});

• 要是是同步但依赖组件更新，记得调用wrapper.update()：

wrapper.instance().onSomethingDoSomething();
wrapper.update(); // 同步组件状态
expect(mockFunc).toHaveBeenCalled();

3. 断言的细节不匹配 #

你可能以为断言的是“被调用过”，但实际写的是带参数或者次数的断言，而参数/次数不匹配。比如：

• 你写了expect(mockFunc).toHaveBeenCalledWith('wrongParam')，但实际调用时传的是另一个参数
• 你断言toHaveBeenCalledTimes(1)，但函数被调用了两次

解决办法：
先简化断言，用expect(mockFunc).toHaveBeenCalled()测试基础情况，确认没问题后再加参数/次数的校验。同时可以打印Mock的调用记录：

console.log(mockFunc.mock.calls); // 看看实际的调用参数和次数

4. Mock函数被意外重置 #

如果你的测试用例之间没清理Mock，或者在触发方法前不小心调用了mockClear()/mockReset()，会导致断言时Mock的调用记录被清空。

解决办法：
在每个测试用例开头重置Mock，或者用jest.clearAllMocks()确保Mock是干净的：

beforeEach(() => {
  jest.clearAllMocks();
});

先从这几个方向排查，应该能解决你的问题！

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