Waiting for a page to load - Cypress

user_14952419 0
Viewed 21514

I'm having an issue as the page is not fully loaded. I tried the cy.wait(1000) method, which I do believe is not a good solution, but still not working, the page is not fully loaded.

Here is the website that I'm trying to test https://www.24mx.ie/. The code is in the file homePage.js.

class HomePage {
  static loadHomePage() {
    cy.visit(Cypress.env('url') + '.ie/');
    cy.wait(1000)      
  }

  static acceptCookies() {
    cy.get('div.m-button.m-button--navigation.m-button--xs.qa-consent-agree-btn.ng-tns-c95-8').click();
  }
}

export default HomePage

code in the file homePage.spec.js

import HomePage from '../pageObjects/homePage'

describe('Home Page Test', function () {
    it('Home Page TC', function () {
        HomePage.loadHomePage();
    })

    it('Accepting Cookies TC', function () {
        HomePage.acceptCookies();
    })

})

Here is a print screen from the test:

enter image description here

cypress pageload automated-tests testing javascript
2 Answers

You should just do a cy.get() and .should() to make Cypress wait for something to appear on the page.

If the page is busy doing API requests, you can do a cy.intercept() on one or more of the API calls, and wait for them. This will buy you some time before you wait for an element to appear. You can look at the network tab in the Chrome debug tools to see what API requests the page is making. I would pick one that takes some time to load, and wait for that.

This is a much better way of "waiting" for the page to load than doing a cy.wait()

user_39753090

To make sure the page has loaded successfully, you can assert any element to be visible. Since after page load you're clicking the accept cookie button I would suggest to assert the same as visible, something like:

class HomePage {
  static loadHomePage() {
    cy.visit(Cypress.env('url') + '.ie/');
    cy.get('[class*=qa-consent-agree-btn]', {
      timeout: 5000
    }).should('be.visible') //Make sure Cookie Accept button is visible with timeout of 5 seconds. You can increase timeout as required.     
    }

    static acceptCookies() {
      cy.get('[class*=qa-consent-agree-btn]').click();
    }
  }

  export default HomePage
user_45712710
Related