Test suite hard fails with Cannot read properties of undefined (reading 'send') when webpack process takes longer than CYPRESS_INTERNAL_BROWSER_CONNECT_TIMEOUT

[3rd-Eden]

Current behavior

As per title, when component testing in Cypress it's not uncommon that your components needs to be compiled by a variety of processes before it can be ran. The more transforms you need, the longer your webpack build takes. While working on component test suites I've noticed that there a couple of components that take up to 70, 80 seconds to compile with babel etc.. When these longer times happen the test suite is unable to run and dies with the following error:

TypeError: Cannot read properties of undefined (reading 'send')

Upon investigation by diving into the cypress code I've narrowed down the problem to the following timer:

https://github.com/cypress-io/cypress/blob/43af15aeadb7dec216bda6affb48030b3b917ab5/packages/server/lib/modes/run.ts#L465

process.env.CYPRESS_INTERNAL_BROWSER_CONNECT_TIMEOUT || 60000

After doubling this timeout the error goes away as the webpack processes no longer exceed the internal timeout:

CYPRESS_INTERNAL_BROWSER_CONNECT_TIMEOUT=180000 CYPRESS_CRASH_REPORTS=0 nyc --reporter=text --reporter=json-summary cypress run --component --headless

So there are multiple problems here

1. The retry logic that is in place isn't functioning as expected as the test suite dies with the above mentioned error instead of cleanly retrying increasing the browser attempts.
2. The timer is only controlled by an internal flag, CYPRESS_INTERNAL_BROWSER_CONNECT_TIMEOUT, and cannot be configured through Cypress's configuration.
3. This whole process should be launched after the compilation is done, not in parallel. There's no need to spin up a browser/poll for connections when webpack is still compiling and fights for resources in order to get the initial compilation done.

Desired behavior

1. The internal timer should be configured through the cypress config, as all other times can be configured as well.
2. There should be a clean retry loop when browser fails to connect within the set period of time.
3. Only start the browser bootstrapping process after webpack has completed

Test code to reproduce

I'm unable to provide you access to our test suites as they contain internal logic.

Cypress Version

12.17.4

Node version

18.11.0

Operating System

Mac 11.7.6 (20G1231)

Debug Logs

cypress:server:windows error removing all extensions { err: TypeError: Object has been destroyed at Object.j (<embedded>:4489:80391) at BrowserWindow.<anonymous> (<embedded>:4489:92897)     at Object.onceWrapper (node:events:642:26)     at BrowserWindow.emit (node:events:539:35) at T (<embedded>:4489:86380) at EventEmitter.kill (<embedded>:4489:93120) at <embedded>:4495:23562 at new Promise (<anonymous>) at h (<embedded>:4495:23394) at Object.open (<embedded>:4495:26111) at async v.relaunchBrowser (<embedded>:4561:147360), extensions: undefined } +0ms
  cypress:server:browsers browser process killed +1ms
  cypress:server:cypress exiting with err TypeError: Cannot read properties of undefined (reading 'send')
    at k._handlePausedRequests (<embedded>:4489:39434)
    at Object._launch (<embedded>:4489:90041)
    at async Object._render (<embedded>:4489:88935)
    at async Object.open (<embedded>:4489:92479)
    at async Object.open (<embedded>:4495:26043)
    at async v.relaunchBrowser (<embedded>:4561:147360) +1m
Cannot read properties of undefined (reading 'send')
TypeError: Cannot read properties of undefined (reading 'send')
    at k._handlePausedRequests (<embedded>:4489:39434)
    at Object._launch (<embedded>:4489:90041)
    at async Object._render (<embedded>:4489:88935)
    at async Object.open (<embedded>:4489:92479)
    at async Object.open (<embedded>:4495:26043)
    at async v.relaunchBrowser (<embedded>:4561:147360)

Other

No response

[jacobweberbowery]

Thanks for this — in the meantime, that environment variable is very helpful. Just adding this for SEO, since it's what I was initially searching for:

Timed out waiting for the browser to connect. Retrying again...
There was an error reconnecting to the Chrome DevTools protocol. Please restart the browser.

TypeError: Cannot read properties of undefined (reading 'webSocketDebuggerUrl')
    at _._fetchDebuggerURL (<embedded>:2466:520933)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async _._start (<embedded>:2466:520232)

The browser never connected. Something is wrong. The tests cannot run. Aborting...

[mankittens]

This issue is pushing my team to move to playwright.

[3rd-Eden]

This issue is pushing my team to move to playwright.

That would be my recommendation as well. As this is just one of the countless problems we've faced so far.

[cypress-app-bot]

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

[cypress-app-bot]

This issue has been closed due to inactivity.