In cypress, how do I wait for a page to load?

cypress
bbsimonbb picture bbsimonbb · Mar 29, 2018 · Viewed 21.2k times · Source

Don't tell anyone, but our app is not yet single-page. I can wait on a given XHR request by giving the route an alias, but how do I wait until some navigation completes and the browser is safely on a new page?

Answer

Igor Shubovych picture Igor Shubovych · Apr 2, 2018

You can add some assert inside:

cy.click('#someButtonToNavigateOnNewPage');

cy.location('pathname', {timeout: 60000})
  .should('include', '/newPage');

cy.click('#YouAreOnNewPage');

You can change default timeout - by default it's 4000 ms (4 secs) - to ensure that user navigated the page. I've put a big number here - 60,000 ms - because I'm sure that 99% of users will leave if they do not have page loaded after 1 min.

Related questions

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 …

Read More
In Cypress how to count a selection of items and get the length?

I'm starting to learn Cypress. I have a 4 row table (with a class of datatable). I can verify the number of rows this way: cy.get('.datatable').find('tr').each(function(row, i){ expect(i).to.be.lessThan(4) }) This …

Read More
Cypress get href attribute

I have a test case in which i have a link which opens in a new tab, and since cypress doesn't support multi tab, i wanna get href attribute of that link and then open it in the same tab, …

Read More