我有一个选择字段和一个输入字段,我想为它们创建一个测试,以便在选择选项为“女性”时显示输入字段“年龄”。但我得到了一个错误,有人能帮助我吗?
错误:测试库元素错误:找不到角色为“textbox”且名称为/age/i
的可访问元素
const genderOption = watch("gender");
<input name="gender" role="combobox">
<button class="combobox-arrow"></button>
<ul role="listbox">
<li
role="option"
value="Male"
><span>Male</span></li>
<li
role="option"
value="Female"
><span>Female</span></li>
</ul>
{genderOption === "Female" && (
<label for="ageInput">Age</label>
<input
id="ageInput"
type="text"
name="Age"
>
)}
const genderInput = screen.getByRole("combobox", {
name: /gender/i,
});
userEvent.click(genderInput);
const optionElement = screen.getByRole("option", {
name: /female/i,
});
await userEvent.click(optionElement);
const ageElement = screen.getByRole("textbox", {
name: /age/i,
});
1条答案
按热度按时间lnxxn5zx1#
使用React Testing Library测试元素的出现和消失有时候很难完全准确地把握时间,您应该使用
findByX
查询来等待元素出现。https://testing-library.com/docs/guide-disappearance/#1-using-findby-queries