Cypress点击表格指定文本对应行编辑按钮找不到actions类如何解决

代码问题分析 #

• 链式调用断裂：你在cy.contains('td', 'abc').scrollIntoView().siblings()之后直接使用了独立的cy.get语句，该语句会从全局DOM根节点搜索元素，而非限定在前面匹配到的表格行上下文内，因此无法定位到目标行对应的操作按钮。
• 选择器逻辑错误：.siblings()获取的是当前td的同级td节点，你后续全局搜索td div的范围完全不符合预期，同时判断.actions类同时携带icon-pencil类的逻辑也和实际DOM结构不匹配，两个类通常是分别挂载在操作容器和编辑图标节点上的。

正确实现代码 #

// 方案1：直接在目标行内查找编辑图标
cy.contains('td', 'abc')
  .scrollIntoView()
  // 向上定位到当前单元格所属的整行
  .closest('tr')
  // 在当前行范围内查找编辑图标
  .find('.icon-pencil')
  .click()

如果操作按钮外层确实有.actions类容器，可使用更精准的限定：

// 方案2：带操作容器类限定
cy.contains('td', 'abc')
  .scrollIntoView()
  .closest('tr')
  .find('.actions .icon-pencil')
  .click()

内容的提问来源于stack exchange，提问作者ZombiePie