如何解决在 Act-Arrange-Assert 中使用 waitFor 中的 expect 作为我的“Assert”可以吗？
我最近开始使用 React / DOM 测试库来测试我所有的前端 React 代码。我遇到的第一个问题是，根据我们应用程序的布局方式，我无法判断数据加载（在我的情况下来自 Mock Service Worker）何时完成，因为一切都是通过 Redux/Redux 处理的Saga 和我们的 Loading spinner 组件位于我们正在测试的组件之外。
因此，为了等待数据加载，我们实际上必须waitFor原始数据本身（因为我们不能简单地等待加载微调器或文本消失，因为它存在组件之外）：
// Expect our first row's Name column to match our filter by text
await waitFor(() => expect(getTableRowAndCell(table,1,1).textContent).toBe('OUTSTANDING')
在这种情况下，我们的 Act-Arrange-Assert 模式中的断言在 waitFor 内，尽管还有其他情况我正在测试表中的几行，所以只有第一个断言会被包装在 waitFor 中，而其他的可以简单地直接断言，如下所示：
// Expect our first row's Value column to match our filterByText
await waitFor(() => expect(getTableRowAndCell(table,3).textContent).toBe('VALUE')
// Expect our second row's Value column to match our filterByText
expect(getTableRowAndCell(table,2,3).textContent).toBe('VALUE')
解决方法
您是否正在尝试执行纯函数 (getTableRowAndCell) 来检查结果是否在 DOM 中？
自然步骤是：
1 - 渲染你的组件（当组件挂载时，它在某处执行？getTableRowAndCell？）
render(<TableComponent />);
2 - 等待文档中的数据：
expect(await screen.findByText('VALUE')).toBeInTheDocument();
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
