Regression: onBeforeLoad is not called when overwriting cy.visit

[nengelberth-aptera]

Steps to reproduce: (app code and test code)

1. Overwrite cy.visit to call the originalFunction and then do some extra waiting, such as:

function waitForPageToLoad() {
    cy.get('html').should('have.class', 'nprogress-busy');
    cy.get('html').should('not.have.class', 'nprogress-busy');
}

Cypress.Commands.overwrite('visit', (originalFn, url, options) => {
    originalFn(url, options);
    cy.location('href').should('contain', url);
    waitForPageToLoad();
})

2. Pass in an onBeforeLoad option -OR- define an onBeforeLoad option within the overwrite -- e.g. add options.onBeforeLoad = (win) => { console.log('onBeforeLoad executed') } to the Cypress.Commands.overwrite code above

Current behavior:

onBeforeLoad does not execute in either case.

Desired behavior:

onBeforeLoad executes.

This appears to be a regression of #2196, but the workaround specified by henrikq-vipps in that issue no longer works either.

Versions

Cypress version: 3.4.1
Operating System: Windows 10.0.18362.418
Browser: Chrome 78, Electron 61

[nengelberth-aptera]

As a workaround, I seem to be able to define a new custom command in basically the exact same way as I am trying to overwrite visit, and in that case visit's onBeforeLoad does get called.

This works:

Cypress.Commands.add('visitAndWaitForLoad', (url, options = {}) => {
    options.onBeforeLoad = (win) => {
        console.log('calling onBeforeLoad');
    }
    options.onLoad = (win) => {
        console.log('calling onLoad');
    }
    console.log(`calling cy.visit with options ${JSON.stringify(options, null, 4)}`)
    cy.visit(url, options);
    cy.location('href').should('contain', url);
    waitForPageToLoad();
})

cy.visitAndWaitForLoad('http://my.url.example.com');

[jennifer-shehane]

@nengelberth-aptera I see that you are using an older version of Cypress. Before I dive in to completely recreate the issue, could you update to the current version of Cypress and let me know if this is still happening for you? Your issue may have already been fixed. Thanks!

[nengelberth-aptera]

With Cypress 3.6, I'm not seeing either onBeforeLoad or onLoad events firing.

While I was double checking my configuration against the documentation while verifying this, I noticed that there was a small discrepancy between my code and what the documentation recommends...

My code is:

Cypress.Commands.overwrite('visit', (originalFn, url, options) => {
    options = {
        onBeforeLoad: (win) => { console.log('onBeforeLoad executed') }, onLoad: (win) => { console.log('onLoad executed') }
    }
    console.log('calling cy.visit');
    originalFn(url, options);
    cy.location('href').should('contain', url);
    waitForPageToLoad();
})

cy.visit('/');

Whereas the end of the documentation for overwriting a function includes:

  // originalFn is the existing `visit` command that you need to call
  // and it will receive whatever you pass in here.
  //
  // make sure to add a return here!
  return originalFn(url, options)

And if I do add a return on the line with the originalFn call, then both onBeforeLoad and onLoad are firing. In my specific case, the reason I want to override the visit function is specifically to add those two lines after calling the base function, to cause Cypress to wait for my application to finish navigating before it continues. So I guess this may be less a bug and more of a "how do I do what I want to do" type issue... but I've also kind of worked around it by changing to a custom command rather than the override anyway, so this can probably be closed.

[flotwig]

Sounds related to #4973 and #5595

[jennifer-shehane]

Since this issue hasn't had activity in a while, we'll close the issue until we can confirm this is still happening. Please comment if there is new information to provide concerning the original issue and we'd be happy to reopen.

[cvolant]

I experience this issue on 6.2.1 as well, on my repo, but not all the time... Sometimes it works, sometimes it does not.
I tried to build a minimal reproduction starting from the official Cypress example, but I did not succeed to reproduce the bug.
The page load speed might be in cause: the Cypress example page is really fast, and mine is not since it is a local development deployment.

Another weird hypothesis: may the service worker cause some troubles? I have one running on my page.

[cvolant]

I tried a workaround with a cy.on('window:before:load', () => { ... }) before the originalVisit call, but I have the same behavior: it works well with the simple Cypress example, but in my repo, it works only sometimes, which is really annoying.

So, the issue comes from the common code on top of which onBeforeLoad and cy.on('window:before:load', ...) are both built.

[jennifer-shehane]

@cvolant Service workers have been known to cause issues, I'm not sure if it's involved in your case. There are some workarounds for unregistering service workers in Cypress in this thread #702 (comment)