Cypress "Cypress detected a cross origin error" in CI
The app navigated to a different superdomain (an OAuth/SSO provider, a payment page) and Cypress, sandboxed to one origin, threw a cross-origin error. Interacting with the other origin requires cy.origin().
What this error means
A test fails with "Cypress detected a cross origin error happened on page load" after a redirect to a different domain. The flow works manually, but Cypress blocks commands run against the foreign origin.
Cypress detected a cross origin error happened on page load:
> Blocked a frame with origin "http://localhost:3000" from accessing
a cross-origin frame.
A cross origin error happens when your application navigates to a new
URL which does not match the origin above.Common causes
Redirect to a different superdomain
Login redirects to an SSO/OAuth domain (e.g. accounts.google.com) different from baseUrl. Cypress isolates per superdomain and blocks commands there without cy.origin().
Interacting after a cross-origin navigation
Continuing to drive the page after it left your domain triggers the error because the commands target an origin Cypress is not attached to.
How to fix it
Wrap foreign-origin steps in cy.origin()
cy.visit('/login');
cy.contains('Sign in with SSO').click();
cy.origin('https://auth.example.com', () => {
cy.get('#username').type('user');
cy.get('#password').type('pass');
cy.contains('Continue').click();
});
cy.url().should('include', '/dashboard');Or avoid the cross-origin hop
- Programmatically log in via an API request and set the session, skipping the SSO UI.
- Use
cy.session()to cache auth so most specs never cross origins. - Reserve the full
cy.origin()flow for one dedicated auth spec.
How to prevent it
- Use
cy.session()+ API login to avoid repeated cross-origin flows. - Wrap unavoidable third-party origins in
cy.origin(). - Keep
baseUrlto your own app and isolate provider hops.