编剧用 text= 选择元素或 hastext 完全匹配答案

【问题标题】：Playwright selecting element with text= or hastext with exact match编剧用 text= 选择元素或 hastext 完全匹配
【发布时间】：2022-08-03 12:08:35
【问题描述】：

我正在使用剧作家 nodejs。我为自己编写了一个小的动态选择器函数来选择数据表上的页码按钮。

pageNumberButton(page, table_id, page_number) {
   page.locator(`[aria-controls=${table_id}]`, {hasText: page_number});
}

我也试过：

pageNumberButton(page, table_id, page_number) {
   page.locator(`[aria-controls=${table_id}] text=${page_number}`);
}

但是，我似乎无法让它完全匹配。

假设我的 dataTable 有 13 页：

我希望点击第 1 页。所以我发出以下命令：await pageNumberButton(page, \"resultsTable\", \"1\").click();

但我得到一个严格模式错误，因为有两个结果：1 和 13。

动态创建这个小选择器以便我可以对按钮进行完全匹配的最佳或好的方法是什么？

标签： playwright

【解决方案1】：

我找到了一个选择。创建一个正则表达式对象并将其传递给 hasText。

pageNumberButton(page, table_id, page_number) { 
    const regexNumber = new RegExp(`^${page_number}$`); 
    page.locator(`[aria-controls=${table_id}]`, {hasText: regexNumber});
}`

【讨论】：

【解决方案2】：

文本正文可以用单引号或双引号转义以搜索具有确切内容的文本节点

    pageNumberButton(page, table_id, page_number) {
       page.locator(`[aria-controls=${table_id}]`)
           .filter({ has: page.locator(`text="${page_number}"`) });
    }

【讨论】：