如何模拟反应自定义钩子返回值？

Question

这是我的自定义钩子：

   export function useClientRect() {
    const [scrollH, setScrollH] = useState(0);
    const [clientH, setClientH] = useState(0);
    const ref = useCallback(node => {
      if (node !== null) {
        setScrollH(node.scrollHeight);
        setClientH(node.clientHeight);
      }
    }, []);
    return [scrollH, clientH, ref];
  }
}

我希望每次调用它时，它都会返回我的值。喜欢：

 jest.mock('useClientRect', () => [300, 200, () => {}]);

我怎样才能做到这一点？

原文由 Homa 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

将挂钩作为模块加载。然后模拟模块：

 jest.mock('module_name', () => ({
    useClientRect: () => [300, 200, jest.fn()]
}));

mock 应该在测试 fn 之外的文件之上调用。因此我们将只有一个数组作为模拟值。

如果你想在不同的测试中用不同的值模拟钩子：

 import * as hooks from 'module_name';

it('a test', () => {
    jest.spyOn(hooks, 'useClientRect').mockImplementation(() => ([100, 200, jest.fn()]));
    //rest of the test
});

原文由 Homa 发布，翻译遵循 CC BY-SA 4.0 许可协议