CODEWITHSUNDEEP
cypress
user3378165
user3378165

Reputation: 6916

Iterate through elements

I have a page with a few Results panels, each panel has its own delete button.

I wrote a Cypress test to test the delete process, the test works as expected, the panel gets deleted:

cy.get('div[data-test="Results"]')
  .first()
  .within(() => {
    cy.get('p[data-test="Contact ID"]').then($match => {
      contactID = $match.html();
      cy.get('button[data-test="Delete Contact"]')
        .click()
        .get('div[data-test="Delete Record Modal"]')
        .should('be.visible')
        .get('button[data-test="Confirm Deletion"]')
        .click();
    });
  });

Next I'm trying to detect if the correct panel got deleted. How can I iterate through all the <p />s of all panels and make sure none of them has a contactID equal to the one that was deleted?

I tried this:

cy.get('p[data-test="ContactID"]').then($match2 => {
  expect($match2.text()).not.to.eq(contactID);
});

But in $match2 I get all contacts ids all together for example: 12345678 instead of 1234 and 5678

Upvotes: 2

Views: 5064

Answers (1)

kuceb
kuceb

Reputation: 18079

You can use each:

cy.get('p[data-test="ContactID"]').each(($match) => {
  cy.wrap($match).invoke('text').should('not.eq', contactID)
})
  • invoke calls a function on the subject, in this case, .text()
  • the chained .should makes an assertion on that text
  • this will retry the assertion until it passes or times out (see retry-ability) due to the cy.wrap

Upvotes: 5

Related Questions