Waiting for a page to load - Cypress

Question

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:

Answer 1

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