cypress: Cypress unable to run test (Uncaught Uncaught TypeError: Cannot read property 'bind' of null)

Running tests fail with the following error. Although the image attached does say the error is generated in the application, there is nothing to indicate from the application itself.

I’ve added this to the support index to catch errors but test not timeout

Cypress.on('uncaught:exception', (err, runnable) => {
  // returning false here prevents Cypress from
  // failing the test
  return false
})

What I have noticed is that none of the button click work within the Cypress interface. No errors are fired when clicking either. But if I open the same link in the browser, the buttons work fine.

Desired behavior:

Tests should run as normal without any failure or provide better stack tracing of this issue so that I can debug it better.

Steps to reproduce: (app code and test code)

I have a monorepo setup and the frontend is using nextjs 9 with babel 7. Prior the this I was using nextjs 7 with babel 7 bridge and all worked fine before the upgrade to next 9. I’ve just gone through the upgrade steps for next js 9 and started receiving the abou

Versions

Cypress: 3.4.1 & 3.6.1 Chrome v78 Mac OS v10.13.6

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 5
Comments: 15 (2 by maintainers)

Most upvoted comments

This problem feels a lot like combining Mentos and Coca-Cola. Cypress maintainers will say that you should patch nextjs and vice-versa.

The simplest workaround I came up with is this:

Cypress.on('window:before:load', win => {
  fetch('https://unpkg.com/unfetch/dist/unfetch.umd.js')
    .then(stream => stream.text())
    .then(response => {
      win.eval(response)
      win.fetch = win.unfetch
    })
})

Make sure you use the snippet above instead of win.fetch = null. Other than that, there is not much that can be done until https://github.com/cypress-io/cypress/issues/687 is done. Thus, this issue should probably be closed.

zvictor on Dec 18, 2019

Closing as resolved.

Additionally, the experimentalFetchPolyfill configuration option has been released as part of 4.9.0. When this option is true, Cypress will automatically replace window.fetch with a polyfill that Cypress can spy on and stub.

You should be able to remove any of the following code:

Cypress.on('window:before:load', (win) => {	
  delete win.fetch	
})

cy.visit('/', {	
  onBeforeLoad (win) {	
    delete win.fetch	
  },	
})

And replace it with the below in your configuration file (cypress.json)

{
  "experimentalFetchPolyfill": true
}

You can see a full example of this in use here: https://github.com/cypress-io/cypress-example-recipes/tree/master/examples/stubbing-spying__window-fetch

If you encounter any issues with the new experimentalFetchPolyfill, please open a new issue with a reproducible example.

If you’re experiencing a bug similar to this in Cypress, please open a new issue with a fully reproducible example that we can run. There may be a specific edge case with the issue that we need more detail to fix.

jennifer-shehane on Jul 14, 2020

@RichieMerchant Can you open your Chrome DevTools and click the yellow error? Can you share what is printed to the console (including the stacktrace) - this should give more indication of where the error is being thrown from.

jennifer-shehane on Nov 27, 2019