Question

我正在尝试仅将waitForElementToBeRemoved与元素一起使用，但Jest正在超时。当我传入一个函数时，它就可以工作。

根据此功能，我的理解是它应该可以包含以下元素：https://github.com/testing-library/dom-testing-library/pull/460

我已验证我的应用正在使用@ testing-library / dom @ 7.8.0。

这是代码：

// doesn't work
await waitForElementToBeRemoved(screen.getByText("Loading..."));

// works
await waitForElementToBeRemoved(() => screen.getByText("Loading..."));

知道我在做什么错吗？

Answer 1

最近，我遇到了反应测试库的相同问题，原因是该库的版本。默认情况下，create-react-app安装过时的@testing-library版本。
反应测试库的此处解决方案：
运行CLI命令npm outdated并检查依赖项的版本：

Package                      Current  Wanted  Latest
@testing-library/jest-dom      4.2.4   4.2.4  5.11.4
@testing-library/react         9.5.0   9.5.0  11.0.2
@testing-library/user-event    7.2.1   7.2.1  12.1.4

要更新依赖项，请打开package.json并将其手动更新为最新版本：

  ...
  "dependencies": {
    ...
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.0.2",
    "@testing-library/user-event": "^12.1.4"
    ...
  },
  ...

保存更改并运行CLI命令：npm install

如果 DOM测试库对“ @ testing-library / dom”使用相同的步骤

Answer 2

除了我以前的回答，我建议使用queryByText：

await waitForElementToBeRemoved(screen.queryByText("Loading..."));

而不是getByText：

await waitForElementToBeRemoved(screen.getByText("Loading..."));

请参阅Common mistakes with React Testing Library

waitForElementToBeRemoved在传递元素时超时

2 个答案: