Javascript DOM测试库：当表单头具有相同的文本内容时选择按钮？

我使用的是DOM测试库，不是React测试库，但是前者没有标记，所以我使用了后者，因为这似乎是最接近的匹配。希望没问题

我有一个身份验证表单，其提交按钮包含文本“登录”，该页面还包含具有相同文本内容的标题：

如屏幕截图所示，我实际上已将标题改为“Admin Log in”，因为这（至少暂时）解决了问题

我写的测试如下：

从'@testing library/testcafe'导入{getByPlaceholderText，getByText}；
const testHostname=process.env.TEST_HOST | |'https://redacted-qa-server';
fixture`Admin Auth`.page`${testHostname}/Admin/`；
测试（'身份验证适用于已知帐户'，异步t=>{
等待
.typeText（GetByPlaceholder文本（'电子邮件地址'），用户名）
.typeText（GetByPlaceholder文本（“您的密码”），密码）
。单击（getByText（“登录”）；
const location=wait t t.eval（（）=>window.location）；
wait t t.expect（location.pathname）.notContains（'/login'）；
});

值得一提的是，标题和提交按钮目前都使用CSS将文本样式设置为所有大写，但都使用“登录”的大小写进行编码

通过将标题内容更改为包含“Admin”，并在

getByText

中使用精确匹配精度，此测试可以通过。但是，如果我不想在标题中包含“Admin”前缀，该怎么办

我知道我可以使用正则表达式匹配，比如

getByText（/^log-in$/I）

来区分大小写，但不允许使用子字符串，但这并不能解决“我不想保留管理员前缀”的问题

---

我知道我可以使用

getAllByText

获取匹配数组，并且可以简单地知道哪一个是我想要单击的。。。但这似乎违背了DOM测试库的精神。这个问题有解决办法吗？

您可以使用

getByText（/log-in/i，{selector:'button}）

来选择登录按钮

您可能还对for

*ByRole

查询感兴趣。发布后，您还可以执行以下操作：

getByRole（'button'，{name:/log-in/i}）

---

考虑到两者之间的选择，我想我更喜欢

getByText

。祝你好运

您可以使用

getByText（/log-in/i，{selector:'button'}）

来选择登录按钮

您可能还对for

*ByRole

查询感兴趣。发布后，您还可以执行以下操作：

getByRole（'button'，{name:/log-in/i}）

考虑到两者之间的选择，我想我更喜欢

getByText

。祝你好运