CODEWITHSUNDEEP
cypress
Jonas
Jonas

Reputation: 396

Assert that an element disappears: waits for the the element

I have this code where it basically should click on a button and the window div[data-e2e-modal] should not be visible anymore. My CSS-Checker shows me that after click the modal window is gone.

.click({ force: true }).then(() => {
    cy.get('div[data-e2e-modal]').should('not.be.visible');

However, in cypress the message for the second line is:

AssertionError
Timed out retrying after 10000ms: Expected to find element: div[data-e2e-modal], but never found it.

This error message is above all wrong, as it should not find div[data-e2e-modal]. Unfortunately, the best assertion that the click worked, is checking for the the div[data-e2e-modal] to disappear. Any suggestion?

Also this does not work:

 cy.modal()
      .button('Apply')
      .click({ force: true }).then(() => {
        cy.get('div[data-e2e-modal]')
          .button('Apply')
          .should('not.be.visible');

});

Upvotes: 0

Views: 461

Answers (1)

Alapan Das
Alapan Das

Reputation: 18634

As of 6.0, cypress has mentioned this in their Migration guide:

Use .should('not.exist') to assert that an element does not exist in the DOM (not .should('not.be.visible'), etc).

So instead, you can try something like this:

cy.get('buttonSelector').click({force: true})
cy.get('div[data-e2e-modal]').should('not.exist')

Upvotes: 1

Related Questions