Cypress:Is there any way to check invisibility of an element

问题

In our application when user do some actions that require communicatiion with server -a loading bar will be displayed on top panel.Once the action completed-Loading bar will be disappeared.In tests we are using this as a check before we move to next step. In selenium i am checking the disappearance of loading bar as shown below

WebDriverLongWait.Until(ExpectedConditions.InvisibilityOfElementLocated(By.Id("loading-bar")));

Is there a similar way to check invisibility of an element in Cypress

instead of waiting for loading bar i am waiting for the request to finish

as shown below cy.server()
            cy.route('POST','**/saveExpression').as('saveExpression')
            cy.get('.IEE-save-button',{ timeout: 100000 }).contains('Apply Expression').click();

            cy.wait('@saveExpression').then((xhr)=>

            {
                cy.contains('browse',{timeout: 60000}).click()
            })

回答1:

In this scenario, it's ideal to use .should('not.be.visible'). To place in your example as below,

cy.get('#loading-bar').should('not.be.visible')

Since loading bar indicator is dependent on some network request, you can wait for the XHR request to finish before making an assertion. You could use the wait() function of cypress. For instance:

// Wait for the route aliased as 'getAccount' to respond
cy.server()
cy.route('/accounts/*').as('getAccount')
cy.visit('/accounts/123')
cy.wait('@getAccount').then((xhr) => {
  cy.get('#loading-bar').should('not.be.visible')
})

来源：https://stackoverflow.com/questions/55112455/cypressis-there-any-way-to-check-invisibility-of-an-element

标签

cypress