Angular Cypress.io test with Google Login popup window

Question

Is it possible to login to a Google account with Cypress.io using the Google authentication pop-up window?

I can get the window to open, but then Cypress can't detect the ID for the email input field.

The error is: "CypressError: Timed out retrying: Expected to find element: '#identifierId', but never found it."

it('Login', function() {
    cy.visit('home')
    cy.get('#signin-button').click()
    cy.get('#google-login-button').click()
    // cy.wait(1500) // wait doesn't help
    cy.get('#identifierId')
    .type('[email protected]') // <<-- error here
  })

Answer 1

This does not work due to Cypress not having fully implemented iframe support.

However, Cypress does not suggest visiting 3rd party applications within your tests. There are many reasons for this including:

• It is incredibly time consuming and slows down your tests.
• The 3rd party site may have changed or updated its content.
• The 3rd party site may be having issues outside of your control.
• The 3rd party site may detect you are testing via a script and block you.
• The 3rd party site may be running A/B campaigns.

Cypress has outlined the downsides to visiting 3rd party sites you do not control and some workarounds in their docs. I suggest reading the full explanation here.