赛普拉斯点击具有特定 src 的 table 中的第 n 个图像

Question

我在 table 中有一个项目列表，每个项目都有一个图像，活动的（蓝色）和非活动的（黑色），我如何为 cypress 进行此查询。

这是 table 列表的图片：

然后这是 table 的 html 代码：

下图展开后，src路径为/static/images/icon_profile.png

我现在的测试是这样的:

it('Should create a legal form of a Customer profile', ()=>{
    cy.get('th').eq(50).find('img').should('have.attr', 'src', '/static/images/icon_profile.png').first().click()
  })

但是当我运行它时，我得到这个错误：

Answer 1

你可以这样做

cy.get('tr').each(($ele) => {
  if ($ele.attr('src') == '/static/images/icon_profile.png') {
    cy.wrap($ele).parent('a').click()
  }
})

Answer 2

您可以通过组合选择器更轻松地做到这一点

cy.get('tr img[src="/static/images/icon_profile.png"]')
  .first()
  .parent('a')  // click the link not the img
  .click()

在使用 .eq(50) 运行

时确认您有正确的索引

cy.get('tr img[src="/static/images/icon_profile.png"]')
  .first()
  .parent('tr')
  .invoke('index')  // which row is it?
  .log()

赛普拉斯点击具有特定 src 的 table 中的第 n 个图像

Cypress click on an nth image in a table with specifc src

javascript

reactjs

cypress

e2e-testing