reactjs - 如何使用 Jest 测试无状态组件内的函数？

Question

我需要在我的无状态组件中测试一个函数，如下所示:

function App(props) {
  const handleItemClick = () => {
    if (true) {
      props.doanything();
    }
  }

  return (
    <div onClick={handleItemClick}>
      App
    </div>
  );
}

Answer 1

正如建议的那样 - 如果您可以通过模拟用户点击来简单地测试您的功能，那么请采用这种方法。但是，说测试内部实现是“不好的做法”是无益且不切实际的。
直接测试功能仍然有充分的理由。尤其是当您的组件很复杂时，有多个嵌套组件在您要测试的功能运行之前对服务器进行异步调用。
在这种情况下 - 你有两个选择，我知道:

将功能移出功能组件范围，导出并测试它(注意，您可能需要传入很多 Prop ，这样看起来很难看)

使用类组件。这样您就可以直接引用该函数。

我希望有一个更好的，希望有人会在评论中提出一些建议。