feat: (multi-domain) handle uncaught errors in the spec bridge (#19976)

packages/driver/cypress/integration/e2e/multi-domain/multi_domain_uncaught_errors_spec.ts

@@ -79,6 +79,26 @@ describe('multi-domain - uncaught errors', { experimentalSessionSupport: true, e
  })
 
  describe('async errors', () => {
+ it('fails the current test/command if async errors are thrown from the test code in switchToDomain while the callback window is still open', (done) => {
+ cy.on('fail', (err) => {
+ expect(err.name).to.eq('Error')
+ expect(err.message).to.include('setTimeout error')
+ expect(err.message).to.include('The following error originated from your test code, not from Cypress.')
+
+ done()
+ })
+
+ cy.switchToDomain('foobar.com', () => {
+ setTimeout(() => {
+ throw new Error('setTimeout error')
+ }, 50)
+
+ // add the cy.wait here to keep commands streaming in, forcing the
+ // switchToDomain callback window to be open long enough for the error to occur
+ cy.wait(250)
+ })
+ })
+
  it('fails the current test/command if async errors are thrown from the switchToDomain context while the callback window is still open', () => {
  const uncaughtExceptionSpy = cy.spy()
  const r = cy.state('runnable')
@@ -122,6 +142,25 @@ describe('multi-domain - uncaught errors', { experimentalSessionSupport: true, e
  expect(failureSpy).not.to.be.called
  })
  })
+
+ // FIXME: Remove skip once support is added for handling errors from switchToDomain after the callback windows closes
+ it.skip('fails the current test/command if async errors are thrown from the test code in switchToDomain while the callback window is now closed', (done) => {
+ cy.on('fail', (err) => {
+ expect(err.name).to.eq('Error')
+ expect(err.message).to.include('setTimeout error')
+ expect(err.message).to.include('The following error originated from your test code, not from Cypress.')
+
+ done()
+ })
+
+ cy.switchToDomain('foobar.com', () => {
+ setTimeout(() => {
+ throw new Error('setTimeout error')
+ }, 50)
+ })
+
+ cy.wait(250)
+ })
  })
 
  describe('unhandled rejections', () => {
@@ -155,6 +194,43 @@ describe('multi-domain - uncaught errors', { experimentalSessionSupport: true, e
  cy.get('.error-two').invoke('text').should('equal', 'promise rejection')
  })
  })
+
+ it('fails the current test/command if a promise is rejected from the test code in switchToDomain while the callback window is still open', (done) => {
+ cy.on('fail', (err) => {
+ expect(err.name).to.eq('Error')
+ expect(err.message).to.include('rejected promise')
+ expect(err.message).to.include('The following error originated from your test code, not from Cypress. It was caused by an unhandled promise rejection.')
+ expect(err.message).to.not.include('https://on.cypress.io/uncaught-exception-from-application')
+
+ done()
+ })
+
+ cy.switchToDomain('foobar.com', () => {
+ Promise.reject(new Error('rejected promise'))
+
+ // add the cy.wait here to keep commands streaming in, forcing the
+ // switchToDomain callback window to be open long enough for the error to occur
+ cy.wait(250)
+ })
+ })
+
+ // FIXME: Remove skip once support is added for handling errors from switchToDomain after the callback windows closes
+ it.skip('fails the current test/command if a promise is rejected from the test code in switchToDomain while the callback window is now closed', (done) => {
+ cy.on('fail', (err) => {
+ expect(err.name).to.eq('Error')
+ expect(err.message).to.include('rejected promise')
+ expect(err.message).to.include('The following error originated from your test code, not from Cypress. It was caused by an unhandled promise rejection.')
+ expect(err.message).to.not.include('https://on.cypress.io/uncaught-exception-from-application')
+
+ done()
+ })
+
+ cy.switchToDomain('foobar.com', () => {
+ Promise.reject(new Error('rejected promise'))
+ })
+
+ cy.wait(250)
+ })
  })
 
  it('does not fail if thrown custom error with readonly name', (done) => {

packages/driver/src/cy/multi-domain/commands_manager.ts

@@ -27,6 +27,7 @@ export class CommandsManager {
  }
 
  listen () {
+ this.communicator.on('reject', this.reject)
  this.communicator.on('command:enqueued', this.addCommand)
  this.communicator.on('command:end', this.endCommand)
  }
@@ -69,7 +70,7 @@ export class CommandsManager {
  }
 
  // If the command has failed, cast the error back to a proper Error object
- let parsedError = correctStackForCrossDomainError(err, this.userInvocationStack)
+ const parsedError = correctStackForCrossDomainError(err, this.userInvocationStack)
 
  if (logId) {
  // Then, look up the logId associated with the failed command and stub out the onFail handler
@@ -85,7 +86,24 @@ export class CommandsManager {
  this.cleanup()
  }
 
+ reject = ({ err }) => {
+ // parse the error back to a proper Error object
+ const parsedError = correctStackForCrossDomainError(err, this.userInvocationStack)
+
+ delete parsedError.onFail
+
+ const r = cy.state('reject')
+
+ if (r) {
+ r(parsedError)
+ }
+
+ // finally, free up any memory and unbind any handlers now that the test has failed
+ this.cleanup()
+ }
+
  async cleanup () {
+ this.communicator.off('reject', this.reject)
  this.communicator.off('command:enqueued', this.addCommand)
 
  // don't allow for new commands to be enqueued, but wait for commands

packages/driver/src/multi-domain/cypress.ts

@@ -8,13 +8,14 @@ import $Cypress from '../cypress'
 import { $Cy } from '../cypress/cy'
 import $Commands from '../cypress/commands'
 import $Log from '../cypress/log'
-import $errUtils, { ErrorFromProjectRejectionEvent } from '../cypress/error_utils'
 import { bindToListeners } from '../cy/listeners'
 import { SpecBridgeDomainCommunicator } from './communicator'
 import { handleDomainFn } from './domain_fn'
 import { handleCommands } from './commands'
 import { handleLogs } from './logs'
 import { handleSocketEvents } from './socket'
+import { handleSpecWindowEvents } from './spec_window_events'
+import { handleErrorEvent } from './errors'
 
 const specBridgeCommunicator = new SpecBridgeDomainCommunicator()
 
@@ -64,6 +65,7 @@ const setup = () => {
  handleCommands(Cypress, cy, specBridgeCommunicator)
  handleLogs(Cypress, specBridgeCommunicator)
  handleSocketEvents(Cypress)
+ handleSpecWindowEvents(cy)
 
  cy.onBeforeAppWindowLoad = onBeforeAppWindowLoad(Cypress, cy)
 
@@ -82,32 +84,7 @@ const onBeforeAppWindowLoad = (Cypress: Cypress.Cypress, cy: $Cy) => (autWindow:
  cy.overrides.wrapNativeMethods(autWindow)
  // TODO: DRY this up with the mostly-the-same code in src/cypress/cy.js
  bindToListeners(autWindow, {
- onError: (handlerType) => {
- return (event) => {
- const { originalErr, err, promise } = $errUtils.errorFromUncaughtEvent(handlerType, event) as ErrorFromProjectRejectionEvent
- const handled = cy.onUncaughtException({
- err,
- promise,
- handlerType,
- frameType: 'app',
- })
-
- $errUtils.logError(cy.Cypress, handlerType, originalErr, handled)
-
- if (!handled) {
- // if unhandled, fail the current command to fail the current test in the primary domain
- // a current command may not exist if an error occurs in the spec bridge after the test is over
- const command = cy.state('current')
- const log = command?.getLastLog()
-
- if (log) log.error(err)
- }
-
- // return undefined so the browser does its default
- // uncaught exception behavior (logging to console)
- return undefined
- }
- },
+ onError: handleErrorEvent(cy, 'app'),
  onHistoryNav () {},
  onSubmit (e) {
  return Cypress.action('app:form:submitted', e)

packages/driver/src/multi-domain/domain_fn.ts

@@ -75,6 +75,12 @@ export const handleDomainFn = (cy: $Cy, specBridgeCommunicator: SpecBridgeDomain
 
  cy.state('onFail', (err) => {
  const command = cy.state('current')
+
+ // If there isn't a current command, just reject to fail the test
+ if (!command) {
+ return specBridgeCommunicator.toPrimary('reject', { err })
+ }
+
  const id = command.get('id')
  const name = command.get('name')
  const logId = command.getLastLog()?.get('id')

packages/driver/src/multi-domain/errors.ts

@@ -0,0 +1,31 @@
+import type { $Cy } from '../cypress/cy'
+import $errUtils, { ErrorFromProjectRejectionEvent } from '../cypress/error_utils'
+
+export const handleErrorEvent = (cy: $Cy, frameType: 'spec' | 'app') => {
+ return (handlerType: string) => {
+ return (event) => {
+ const { originalErr, err, promise } = $errUtils.errorFromUncaughtEvent(handlerType, event) as ErrorFromProjectRejectionEvent
+ const handled = cy.onUncaughtException({
+ err,
+ promise,
+ handlerType,
+ frameType,
+ })
+
+ $errUtils.logError(Cypress, handlerType, originalErr, handled)
+
+ if (!handled) {
+ // if unhandled, fail the current command to fail the current test in the primary domain
+ // a current command may not exist if an error occurs in the spec bridge after the test is over
+ const command = cy.state('current')
+ const log = command?.getLastLog()
+
+ if (log) log.error(err)
+ }
+
+ // return undefined so the browser does its default
+ // uncaught exception behavior (logging to console)
+ return undefined
+ }
+ }
+}

packages/driver/src/multi-domain/spec_window_events.ts

@@ -0,0 +1,17 @@
+import type { $Cy } from '../cypress/cy'
+import { handleErrorEvent } from './errors'
+
+export const handleSpecWindowEvents = (cy: $Cy) => {
+ const handleWindowErrorEvent = handleErrorEvent(cy, 'spec')('error')
+ const handleWindowUnhandledRejectionEvent = handleErrorEvent(cy, 'spec')('unhandledrejection')
+
+ const handleUnload = () => {
+ window.removeEventListener('unload', handleUnload)
+ window.removeEventListener('error', handleWindowErrorEvent)
+ window.removeEventListener('unhandledrejection', handleWindowUnhandledRejectionEvent)
+ }
+
+ window.addEventListener('unload', handleUnload)
+ window.addEventListener('error', handleWindowErrorEvent)
+ window.addEventListener('unhandledrejection', handleWindowUnhandledRejectionEvent)
+}