如何在Playwright中点击特定行内的按钮？

因为行的顺序随机，直接通过类名点击会命中不确定的元素，核心思路是先通过唯一标识rowId锁定目标行，再定位行内的展开按钮，以下是几种实用实现方式：

方法1：基于行的属性定位（推荐，若rowId是行元素的属性） #

如果目标行的HTML结构类似 <tr data-row-id="xxx">（rowId以data属性存储在行元素上），直接用CSS选择器组合定位：

const targetRowId = "指定的rowId值"; // 替换为你要定位的实际rowId
await page.locator(`tr[data-row-id="${targetRowId}"] .ant-table-row-expand-icon`).click();

这种方式直接通过唯一属性锁定行，不受行顺序变化影响，定位精准。

方法2：基于行内文本定位（若rowId显示在行内单元格中） #

如果rowId是行内某个单元格的显示文本，用filter方法筛选目标行后再定位按钮：

const targetRowId = "指定的rowId值";
// 先筛选出包含目标rowId文本的行
const targetRow = page.locator("tr").filter({ hasText: targetRowId });
// 点击该行内的展开按钮
await targetRow.locator(".ant-table-row-expand-icon").click();

注意：如果行内有其他文本和rowId重复，需要更精准的文本匹配（比如指定单元格选择器配合hasText）。

方法3：基于行的ID属性定位（若rowId是行元素的id） #

如果目标行的HTML结构是 <tr id="xxx">，直接用ID选择器定位：

const targetRowId = "指定的rowId值";
await page.locator(`tr#${targetRowId} .ant-table-row-expand-icon`).click();

额外提示 #

• 优先使用Playwright推荐的page.locator()替代page.click()，它会自动等待元素可见、可交互，减少测试不稳定问题。
• 确保rowId在页面中唯一，避免出现多个行匹配同一个rowId的情况。

内容的提问来源于stack exchange，提问作者Katarzyna Zaczyńska