赛普拉斯 |在特定条件下单击行内列中的按钮

Cypress | Click on a button in a column inside a row on specific condition

我有一个包含多行和多列的 table。

我想触发以下场景:

这是我的 table 结构:

这是我的代码片段

clickOnDeleteIcon(email: string)  {
        cy.get('tbody.MuiTableBody-root tr td', { timeout: 20000})
            .filter(`:contains(${email})`)
            .parentsUntil('tbody.MuiTableBody-root tr')
            .find('button[title = "Delete"]')
            .click()
    }

我也试过了

clickOnDeleteIcon(email: string)  {
        cy.contains('tbody.MuiTableBody-root tr td', email).parent('tr')
            .find('button[title = "Delete"]')
            .click()
    }

但是,我在过滤器中超时

Timed out retrying after 10000ms: Expected to find element: :contains(Julie_Williamson88@gmail.com), but never found it. Queried from element: [ <td.MuiTableCell-root.MuiTableCell-body.MuiTableCell-paddingNone>, 1535 more... ]

filter() 命令使用 css,但 :contains 似乎无效 css,如 here 所述。

您应该使用来自 cypress 的 contains() 命令按文本内容查询元素。

我会这样使用它:

cy.get('tbody.MuitableBody-root')
    .contains('tr', email)
    .find('button[title="Delete"]')
    .click();

你可以这样做:

cy.get('tbody.MuiTableBody-root tr', {
  timeout: 15000,
})
  .should('be.visible')
  .each(($ele, index) => {
    if ($ele.text().toLowerCase().trim().includes('ursula_white@gmail.com')) {
      cy.wrap($ele).within(() => {
        cy.get('[title="Delete"]').click()
      })
    }
  })