cypress: Getting the error in CircleCI "CypressError: Cypress detected a cross origin error happened on page load" for same domain

@jennifer-shehane same thing happening to me 😦 cypress.json

{
  "baseUrl": "http://localhost:3002",
  "defaultCommandTimeout": 10000,
  "chromeWebSecurity": false
}

Let me know if there is anything I can do to help debug this.

We were also running into this with a login form. We discovered that when the form was submitted, the POST request redirected to http://localhost:5000/__/ (the Cypress test runner) when it should have redirected to http://localhost:5000/ (our app). When we fixed the redirect location, this issue disappeared.

Perhaps Cypress could improve the way this error is displayed. Reading the error and the docs, it doesn’t make any sense why we would get a cross origin error when the origins are actually the same.

We were seeing seemingly random, intermittent CORS errors with the same domain listed, much like the original issue here. I tried all the various solutions, nothing worked — we’d still see occasional CORS errors. Seemed like an obvious race condition having to do with our DB setup, and finally I tracked it down…

In our beforeEach we seed our DB, and I realized that in a few cases we were ending our tests with a .click() on an element that would trigger a navigation. However the test runner would move on to the next test, running beforeEach which would teardown the DB state before the page loaded from the prior click which in app caused an error when the page did load, resulting in a redirect! The solution for us was to ensure that tests didn’t end with an action that caused navigation.

This is probably an edge case, but figured I’d add it here in case it might be helpful to anyone, since we banged our heads against this for a long time.

Could you try to update to version 3.1.2 as we just fixed some cross origin error issues.

Otherwise we’ll have to close this issue if no reproducible example is provided. Can anyone provide a way to reproduce this?

Hello everyone, in my case the problem was as follows:

• Visit a page normally using Cypress
• Click a button that submits an HTML form (method post)
• The form returns a redirect response that redirects to another URL
  • This URL was in the same protocol, host and port
  • However, this URL was returning a JSON response instead of HTML response. After fixing this to have a redirect into a normal HTML page, the error vanished.

In short: the error message was misleading. It was not a “cross-origin” error. It was a redirect to a non-html page.

@jennifer-shehane same thing happening to me 😦 cypress.json

{
  "baseUrl": "http://localhost:3002",
  "defaultCommandTimeout": 10000,
  "chromeWebSecurity": false
}

Let me know if there is anything I can do to help debug this.

Thank you! This helps for me) I have successfully implemented login and logout with cypress + keycloak ❤️

Strange thing, but it seems, I’ve managed to fix this issue for my case by just cleaning site data in “cypress Chrome”.

I’ve been working on the separate simple static server for CI (which meant to replace webpack-dev-server). So each time when I’ve been switching to a new server (which served from the same URL “http://localhost:3000” as webpack-dev-server) and rerun tests, I’ve encountered issue described here (CypressError: Cypress detected a cross-origin error happened on page load) It happened when tests were trying to get fallback for SPA paths. Something like this:

app.use('*', (req, res) => {  res.sendFile('index.html') })

I thought the problem was in fallback implementation. But after cleaning site data issue just disappeared. I’ve been trying to reproduce it to find out the reason, but without success.

Unfortunately we have to close this issue as there is not enough information to reproduce the problem.

Please comment in this issue with a reproducible example and we will reopen the issue. 🙏