reactjs - 如何等到按钮的禁用状态在测试库中被更改？

Question

我有一个 React 组件，在一开始就禁用了输入字段和按钮。如果用户向输入字段提供的输入通过 API 验证，则此按钮的状态(禁用)会更改，在输入字段中键入任何内容后将调用该 API。

我通过提供有效输入进行测试，但它需要等到 API 调用完成，所以基本上我想测试一下，如果提供有效输入，按钮是否在我的测试中重新启用。

我正在通过以下代码执行此操作:

userEvent.type(getByRole("textbox"), "HELLO");
await waitFor(() => expect(getByTestId("my-btn")).not.toBeDisabled());

但即使输入有效也无法正常工作

Answer 1

您可以将waitFor 超时增加为explained in the doc :

await waitFor(() => expect(getByTestId("my-btn")).not.toBeDisabled(), {
  timeout: 5000,
});

超过 5000 你可能还需要 increase jest timeout .