Why the application works in Firefox, but breaks in Chrome?

Question

We have a web application embedded in an iframe inside a portal, and we're in the progress of changing the domain for the portal. When we test with the new domain, the portal works well in Firefox, but it does not load for Chrome.

One thing I notice in the console is that in both browser, there is a failed API call because of CORS. However, in Firefox, it logs TypeError: NetworkError when attempting to fetch resource. in Chrome: TypeError: Failed to fetch.

I wonder if this CORS Failed to fetch error could potentially break the application inside iframe in Chrome but not in Firefox? And why is that.

loic · Answer

Had a similar problem with my Angular web app; will work fine with firefox but then breaks in Chrome, in my case it was because of Adblock extension. Try to disable it and see if the problem is still there. Whenever Adblock detect some key word in my code like "Ads" it block it.

LudoGo · Answer

Sure Chrome and Firefox doesn't have the same behavior to manage iframe. If this is not due to ad blocker (as suggested above), have a look on https://developer.mozilla.org/fr/docs/Web/HTTP/Headers/X-Frame-Options and add them the web server that serve the page displayed into the iframe.

Why the application works in Firefox, but breaks in Chrome?

2 Answers