Jest中如何在测试阶段单独修改已配置Mock的返回值？

问题场景 #

在beforeAll中为loadStatus配置了Mock返回值，包含mutate和默认返回false的isLoading Mock函数。期望在单个测试用例中仅修改isLoading的返回值为true，无需重新配置整个loadStatus的Mock对象，但使用mockedIsLoading.mockReturnValueOnce(true)未达到预期效果。

原因分析 #

mockReturnValueOnce(true)仅会让isLoading的下一次调用返回true，之后会自动恢复为beforeAll中设置的默认返回值false。如果组件在渲染过程中多次调用isLoading，后续调用会回到false，导致你感知到“修改未生效”。

解决方案 #

根据需求选择以下方案：

方案1：让测试用例中isLoading始终返回true #

使用mockReturnValue(true)替换mockReturnValueOnce(true)，覆盖默认返回值，确保该测试用例中所有isLoading调用都返回true。测试结束后可重置回默认值，避免影响其他用例。

test('my test', () => {
  // 覆盖默认返回值，所有调用均返回true
  mockedIsLoading.mockReturnValue(true);
  render(<Wrapper />);
  
  // 这里添加你的断言逻辑
  
  // 可选：测试结束后重置为默认的false
  mockedIsLoading.mockReturnValue(false);
});

方案2：灵活控制多次调用的返回值 #

如果需要让isLoading前N次调用返回true，后续恢复默认，可链式调用mockReturnValueOnce：

test('my test', () => {
  // 前两次调用返回true，之后回到false
  mockedIsLoading.mockReturnValueOnce(true).mockReturnValueOnce(true);
  render(<Wrapper />);
  
  // 断言逻辑...
});

方案3：动态控制返回值 #

通过变量控制isLoading的返回值，实现更灵活的动态修改：

// 初始化时用变量控制返回值
let isLoadingValue = false;
const mockedIsLoading = jest.fn(() => isLoadingValue);

beforeAll(() => {
  mockedLoadStatus.mockReturnValue({
    mutate: mockedMutate,
    isLoading: mockedIsLoading,
  });
});

test('my test', () => {
  // 修改变量即可控制返回值
  isLoadingValue = true;
  render(<Wrapper />);
  
  // 断言逻辑...
  
  // 测试结束后重置变量
  isLoadingValue = false;
});

额外建议：隔离测试用例影响 #

为避免不同测试用例之间的Mock状态干扰，建议在afterEach中重置Mock函数：

afterEach(() => {
  // 重置Mock的调用记录和返回值配置
  mockedIsLoading.mockReset();
  // 恢复默认返回值false
  mockedIsLoading.mockReturnValue(false);
});

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