如何使用 react hooks 测试库测试内部函数？

Question

我有一个自定义挂钩，我正在尝试为使用 react hooks 测试库包编写测试，我想知道如何测试自定义挂钩中未返回但在其他内部使用的内部函数函数。

const customHook = () => {
  const [count, setCount] = React.useState(0);

  const doSomeThing = () => {
    ..code
  }

  const increment = () => {
    doSomeThing(); //Would like to make assertations on this
    setCount((x) => x + 1 );
  }

  return { count, increment }
}

export default customHook;

测试

it('Should call increment', () => {
  const { result } = renderHook(() => useCustomHook())

  act(() => {
    result.current.increment();
  });

  expect(doSomeThing).toHaveBeenCalled(); //end result of what I would like help on
});

我如何编写测试来查看 doSomething 是否已 called/used？

Answer 1

你不能。它完全在那个钩子的内部，并且没有提供句柄来获取那个函数。所以你不能模拟它，也不能直接调用它。只测试 doSomething 函数是不可能的。

更重要的是，你不应该这样做。您不想在那个级别进行测试。这是一个私有的实现细节。您应该测试挂钩的 public 接口。这意味着测试参数、return 值以及挂钩 return 调用函数如何影响下一个 returned 值。

测试不应该关心函数如何完成它的工作。测试应该只关心函数是否正确地完成它的工作。

这意味着您的测试只能验证 doSomething 做了什么，而不是它是否被调用。截至目前，它根本没有做任何事情，所以没有什么可测试的。

如何使用 react hooks 测试库测试内部函数？

How to test internal functions using react hooks testing library?

reactjs

jestjs

react-testing-library

react-hooks-testing-library