为什么我在 React 中的异步测试不起作用？

Question

我正在用 jest 和 react 测试库（最新版本）测试一个 react 组件，但我没有让异步测试工作。我认为这是一个语法问题。组件正确渲染，并且由于超时有效，提取 (useEffect) 似乎也有效。

test('renders asynchron', async () => {
   renderComp(); //renders component
   
   await waitFor(() => expect(screen.findByTestId('testid')).toBeInTheDocument()); //dont work
   await screen.findByTestId('testid'); //same

   setTimeout(() => {
      expect(screen.findByTestId('testid')).toBeInTheDocument(); //this works
   }, 100);

});

如果我希望在单击按钮后出现元素，我也会遇到同样的问题。

Answer 1

因为以下箭头函数不可等待：

() => expect(screen.findByTestId('testid')).toBeInTheDocument()

您必须定义内部函数 async 并等待。

为什么我在 React 中的异步测试不起作用？

Why did my asynchronous test in react not work?

javascript

reactjs

jestjs

react-testing