Cypress: Test if element does not exist

I want to be able to click on a check box and test that an element is no longer in the DOM in Cypress. Can someone suggest how you do it?

//This is the Test when the check box is clicked and the element is there
cy.get('[type="checkbox"]').click();
cy.get('.check-box-sub-text').contains('Some text in this div.')

I want to do the opposite of the test above. So when I click it again the div with the class should not be in the DOM.


Well this seems to work, so it tells me I have some more to learn about .should()

cy.get('.check-box-sub-text').should('not.exist');

you can also search a for a text which is not supposed to exist:

cy.contains('[email protected]').should('not.exist')

Here you have the result in Cypress: 0 matched elements

enter image description here

documentation: https://docs.cypress.io/guides/references/assertions.html#Existence


Cypress 6.x+ Migration

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


Do not use not.visible assertion. It would falsely pass in < 6.0, but properly fail now:

// for element that was removed from the DOM
// assertions below pass in < 6.0, but properly fail in 6.0+
.should('not.be.visible')
.should('not.contain', 'Text')

Migration Docs here: Migrating-to-Cypress-6-0