Início / coding / Perguntas / 77657364
Accepted
Tim
Asked: 2023-12-14 09:36:32 +0800 CST

No Cypress, você consegue encontrar a primeira linha de uma tabela que possui um texto específico?

  • 772

Sou relativamente novo nos testes Cypress.

Tenho uma tabela que possui mais de uma linha com um texto específico e quero obter apenas a primeira linha.

Até agora, a única maneira que descobri de fazer isso é percorrer todas as linhas da tabela em busca do texto. Isso não é apenas feio, mas também impede que o teste atue apenas na primeira linha que encontrar.

Aqui está meu código meio desajeitado:

const SELECTOR = {
    dataTableBody: '.p-datatable-tbody'
} as const;


cy.assertVisible(SELECTOR.dataTableBody);
cy.then(() => {
    cy.get(SELECTOR.dataTableBody).then($tbody => {
        cy.get(SELECTOR.dataTableBody).find('tr').each($row => {
            if (($row.find('td:nth-child(1)').text().trim()) === 'MyText') {

                    //I only want it to get here on the FIRST row that has 'MyText'
            }
        });
    });
});

Obrigado!

angular

1 respostas

  1. Best Answer

    Eu usaria .contains()já que você procura algum texto.

    .contains()sempre retorna apenas o primeiro elemento, mesmo se houver muitos elementos correspondentes.

    Aqui está uma tabela de exemplo simples

    <table>
  <tbody class="p-datatable-tbody">
    <tr>                   
      <td></td>
      <td>MyText</td>      
    </tr>
    <tr>
      <td>MyText</td>
      <td></td>
    </tr>
  </tbody>
</table>

    Esta é a sequência de comandos mais simples que posso imaginar

    cy.get('.p-datatable-tbody').should('be.visible')
  .contains('tr', 'MyText')
  .then($row => {
    // $row is the first row that contains 'MyText' anywhere in the row

    expect($row.index()).to.eq(0)   // 1st row was picked
  })

    Mas ele retorna a linha que contém 'MyText' em qualquer lugar da linha.

    Se você quiser verificar apenas a primeira coluna, especifiquetd:nth-child(1)

    cy.get('.p-datatable-tbody').should('be.visible')
  .contains('td:nth-child(1)', 'MyText')
  .parent()
  .then($row => {
    // $row is the first row that contains 'MyText' in the first column

    expect($row.index()).to.eq(2)   // 2nd row was picked
  })
    • 2

relate perguntas