How do we validate an element is not displayed even when it is present in the DOM using Cypress

user_14845143 0
Viewed 414

I am trying to validate whether an element is not visible. I tried using element.should("not.exist") but it fails as the element is present in the DOM.

Is there a way we can validate that an element is not displayed?

cypress automated-tests javascript
2 Answers

You can do this assertion like so:

cy.get('<element-selector-here>').should('not.be.visible');

Also, you can assert the element exist & it's not visible like so:

cy.get('<element-selector-here>').should('exist').and('not.be.visible');
user_98841900

You can use JQuery and Chai assertion to check that the element is not visible.

cy.get('<element-selector-here>').then(($el) => {
  expect($el.is(':visible').to.be.false)
})
user_128384930
Related