chore: [Multi-domain] Improve timeout error message. (#20671)

* Better timeout error handling

* quick fix, should re-visit

* cancel dangling timeouts

* re-broadcast the window load event.

* clean up code and comment more

* ignore better

* PR updates

* oops, didn't mean to enable this

* Apply suggestions from code review

Co-authored-by: Bill Glesias <bglesias@gmail.com>

* moar pr updates

* Apply suggestions from code review

Co-authored-by: Chris Breiding <chrisbreiding@users.noreply.github.com>
Co-authored-by: Bill Glesias <bglesias@gmail.com>

* Fix test

* message changes

* message update

Co-authored-by: Bill Glesias <bglesias@gmail.com>
Co-authored-by: Chris Breiding <chrisbreiding@users.noreply.github.com>

Author: 3 people

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

@@ -265,201 +265,3 @@ describe('Multi-step Auth', { experimentalSessionSupport: true }, () => {
     .should('equal', 'Welcome MarkyMark')
   })
 })
-
-describe('errors', { experimentalSessionSupport: true }, () => {
-  it('reset top', () => {
-    cy.visit('http://www.foobar.com:3500/fixtures/auth/index.html')
-  })
-
-  // This test will fail primary domain not established
-  it('logs in with no primary - fail', { baseUrl: undefined, pageLoadTimeout: 5000 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out after waiting \`5000ms\` for your remote page to load.`)
-      done()
-    })
-
-    cy.switchToDomain('http://idp.com:3500', () => { // Implicitly primary domain is foobar since the previous test set it to foobar. This command times out because we return to localhost, not foobar.
-      cy.visit('http://www.idp.com:3500/fixtures/auth/idp.html')
-      cy.get('[data-cy="username"]').type('FJohnson')
-      cy.get('[data-cy="login"]').click() // Redirects to localhost
-    })
-
-    cy.get('[data-cy="welcome"]') // Timeout on command, cannot find element (sorry, your element is in another domain)
-    .invoke('text')
-    .should('equal', 'Welcome FJohnson')
-  })
-
-  it('never redirects to the subdomain', { defaultCommandTimeout: 50 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out retrying after 50ms: Expected to find element: \`[data-cy="username"]\`, but never found it`)
-      //  make sure that the secondary domain failures do NOT show up as spec failures or AUT failures
-      expect(err.message).not.to.include(`The following error originated from your test code, not from Cypress`)
-      expect(err.message).not.to.include(`The following error originated from your application code, not from Cypress`)
-      done()
-    })
-
-    cy.visit('/fixtures/auth/index.html')
-    cy.get('[data-cy="login-idp"]')
-    cy.switchToDomain('http://idp.com:3500', () => {
-      cy.get('[data-cy="username"]').type('BJohnson') // Timeout here on command, cannot find element
-      cy.get('[data-cy="login"]').click()
-    })
-
-    cy.get('[data-cy="welcome"]')
-    .invoke('text')
-    .should('equal', 'Welcome BJohnson')
-  })
-
-  it('redirects to the wrong subdomain', { pageLoadTimeout: 5000 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out after waiting \`5000ms\` for your remote page to load.`)
-      done()
-    })
-
-    cy.visit('/fixtures/auth/index.html')
-    cy.get('[data-cy="login-foobar"]').click() // Timeout on page load here, we never reach the expected domain
-    cy.switchToDomain('http://idp.com:3500', () => {
-      cy.get('[data-cy="username"]').type('BJohnson')
-      cy.get('[data-cy="login"]').click()
-    })
-
-    // Verify that the user has logged in on localhost
-    cy.get('[data-cy="welcome"]')
-    .invoke('text')
-    .should('equal', 'Welcome BJohnson')
-  })
-
-  it('never returns to the primary domain', { defaultCommandTimeout: 50 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out retrying after 50ms: Expected to find element: \`[data-cy="welcome"]\`, but never found it`)
-      //  make sure that the secondary domain failures do NOT show up as spec failures or AUT failures
-      expect(err.message).not.to.include(`The following error originated from your test code, not from Cypress`)
-      expect(err.message).not.to.include(`The following error originated from your application code, not from Cypress`)
-      done()
-    })
-
-    cy.visit('/fixtures/auth/index.html')
-    cy.get('[data-cy="login-idp"]').click()
-    cy.switchToDomain('http://idp.com:3500', () => {
-      cy.get('[data-cy="username"]').type('BJohnson')
-    }) // switchToDomain is stable so the command exits
-
-    // Verify that the user has logged in on localhost
-    cy.get('[data-cy="welcome"]') // Timeout here on command, cannot find element
-    .invoke('text')
-    .should('equal', 'Welcome BJohnson')
-  })
-
-  it('redirects to an unexpected subdomain', { pageLoadTimeout: 5000 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out after waiting \`5000ms\` for your remote page to load.`)
-      done()
-    })
-
-    cy.visit('/fixtures/auth/index.html')
-    cy.get('[data-cy="login-idp"]').click()
-    cy.switchToDomain('http://idp.com:3500', () => {
-      cy.get('[data-cy="username"]').type('BJohnson')
-      cy.window().then((win) => {
-        win.location.href = 'http://www.foobar.com:3500/fixtures/auth/index.html'
-      })
-    })
-
-    // Verify that the user has logged in on localhost
-    cy.get('[data-cy="welcome"]') // Timeout here on command, cannot find element
-    .invoke('text')
-    .should('equal', 'Welcome BJohnson')
-  })
-
-  // TODO: run in firefox too after we fix error serialization for firefox.
-  it.skip('fails in switchToDomain when a command is run after we return to localhost', { browser: '!firefox', defaultCommandTimeout: 50 }, (done) => {
-    cy.on('fail', (err) => {
-      expect(err.message).to.include(`Timed out retrying after 50ms: Expected to find element: \`[data-cy="cannot_find"]\`, but never found it`)
-      //  make sure that the secondary domain failures do NOT show up as spec failures or AUT failures
-      expect(err.message).not.to.include(`The following error originated from your test code, not from Cypress`)
-      expect(err.message).not.to.include(`The following error originated from your application code, not from Cypress`)
-      done()
-    })
-
-    cy.visit('/fixtures/auth/index.html') // Establishes Primary Domain
-    cy.get('[data-cy="login-idp"]').click() // Takes you to idp.com
-    cy.switchToDomain('http://idp.com:3500', () => {
-      cy.get('[data-cy="username"]').type('BJohnson')
-      cy.get('[data-cy="login"]').click()
-      cy.get('[data-cy="cannot_find"]') // Timeout here on command stability achieved by primary domain, this command times out.
-    })
-
-    // Verify that the user has logged in on localhost
-    cy.get('[data-cy="welcome"]') // Stability is false, this command is prevented from running until stability is achieved.
-    .invoke('text')
-    .should('equal', 'Welcome BJohnson')
-  })
-
-  describe('Pre established spec bridge', () => {
-    // These next three tests test and edge case where we want to prevent a load event from an established spec bridge that is not part of the test.
-    // This test removes the foobar spec bridge, navigates to idp, then navigates to foobar and attempts to access selectors on localhost.
-    it('times out in switchToDomain with foobar spec bridge undefined', { pageLoadTimeout: 5000 }, (done) => {
-      cy.on('fail', (err) => {
-        expect(err.message).to.include(`Timed out after waiting \`5000ms\` for your remote page to load.`)
-        done()
-      })
-
-      cy.visit('/fixtures/auth/index.html') // Establishes Primary Domain
-      cy.window().then(() => {
-      // Force remove the spec bridge
-        window?.top?.document.getElementById('Spec Bridge: foobar.com')?.remove()
-      })
-
-      cy.get('[data-cy="login-idp"]').click() // Takes you to idp.com
-      cy.switchToDomain('http://idp.com:3500', () => {
-        cy.get('[data-cy="username"]').type('BJohnson')
-        cy.window().then((win) => {
-          win.location.href = 'http://www.foobar.com:3500/fixtures/auth/index.html'
-        })//
-      })
-
-      // Verify that the user has logged in on localhost
-      cy.get('[data-cy="welcome"]') // Stability is false, this command is prevented from running until stability is achieved.
-      .invoke('text')
-      .should('equal', 'Welcome BJohnson')
-    })
-
-    // this test just needs to establish the foobar spec bridge.
-    it('establishes foobar spec bridge', () => {
-      cy.visit('/fixtures/auth/index.html') // Establishes Primary Domain
-      cy.get('[data-cy="login-foobar"]').click() // Takes you to idp.com
-      cy.switchToDomain('http://foobar.com:3500', () => {
-        cy.get('[data-cy="username"]').type('BJohnson')
-        cy.get('[data-cy="login"]').click()
-      })
-
-      // Verify that the user has logged in on localhost
-      cy.get('[data-cy="welcome"]')
-      .invoke('text')
-      .should('equal', 'Welcome BJohnson')
-    })
-
-    // This test is the same as the first test but the foobar spec bridge has been established and we expect it to behave the same as the first test.
-    // The primary domain should ignore the load event from the foobar spec bridge and load should timeout in the idp switchToDomain command..
-    it('times out in switchToDomain with foobar spec bridge defined', { pageLoadTimeout: 5000 }, (done) => {
-      cy.on('fail', (err) => {
-        expect(err.message).to.include(`Timed out after waiting \`5000ms\` for your remote page to load.`)
-        done()
-      })
-
-      cy.visit('/fixtures/auth/index.html') // Establishes Primary Domain
-      cy.get('[data-cy="login-idp"]').click() // Takes you to idp.com
-      cy.switchToDomain('http://idp.com:3500', () => {
-        cy.get('[data-cy="username"]').type('BJohnson')
-        cy.window().then((win) => {
-          win.location.href = 'http://www.foobar.com:3500/fixtures/auth/index.html'
-        })
-      })
-
-      // Verify that the user has logged in on localhost
-      cy.get('[data-cy="welcome"]') // Stability is false, this command is prevented from running until stability is achieved.
-      .invoke('text')
-      .should('equal', 'Welcome BJohnson')
-    })
-  })
-})