测试异步获取数据的 React 组件

Question

我是 testing-library 的新手，正在尝试弄清楚如何为异步获取数据的组件编写一些测试。

这里是 codesandbox.

我很难找出使用 testing-library 的最佳方法。特别是因为它涉及异步获取数据并且存在去抖动。

我要做出的断言相当简单（您可以在测试文件中看到它），如果有人能帮助我解决这个问题，那就太好了。

谢谢。

Answer 1

在 this post 中，我解释了如何处理 RTL 中的 API 调用。

至于 debounce 我建议你只是模拟它，这样它就不会运行在你的测试中：

jest.mock('lodash/debounce', () => fn => fn)

或者如果你想要更完整的东西：

jest.mock('lodash/debounce', () => fn => {
  const debounced = function(...args) {
    const context = this
    return fn.apply(context, args)
   }
   debounced.cancel = () => {}
   return debounced
})

测试异步获取数据的 React 组件

Testing React component that fetches data asynchronously

reactjs

react-testing-library