Services Work About Team Blog Tutorials FAQ đź’¬ Chat on WhatsApp

Home / Blog / Hot Reload Fails, DOM adds an additional iframe

reacthelpdiscusswebpack

Hot Reload Fails, DOM adds an additional iframe

đź’ˇ
Cross-posted content: This article is also published on Dev.to. View original on Dev.to ↗

Hey React Developers🙋‍♂️, this your gateway to solving this problem if you’re still facing this. I’ve tested the solution in multiple React projects on various different devices with variety of OS and browsers. Why? Because everyone in my team was facing this issue but were not frustrated enough to solve it which I was.

I’ve gone through multiple github discussions and stackoverflow posts to finally reach this solution and then test it out.

Let’s see the symptoms you’re facing. Are they mentioned below:

  • Application becomes non-interactive, iframe is added to DOM.
  • Hot reload continues to work, but the page becomes unresponsive. Can’t click or do anything unless you do a manual refresh.
  • process is not defined
Uncaught ReferenceError: process is not defined
at Object.4043 (<anonymous>:2:13168)
at r (<anonymous>:2:306599)
at Object.8048 (<anonymous>:2:9496)
at r (<anonymous>:2:306599)
at Object.8641 (<anonymous>:2:1379)
at r (<anonymous>:2:306599)
at <anonymous>:2:315627
at <anonymous>:2:324225
at <anonymous>:2:324229
at HTMLIFrameElement.e.onload (index.js:1)

You might have started facing this problem either after updating your CRA or starting a new project using create-react-app which lead to the probable lead cause of it to be react-error-overlay.

You can check the issue reported on github here

SOLUTION

npm i -D react-error-overlay@6.0.9

If this doesn’t helps, check this out.

If this solution solves your problem, do like this post or comment down so that others can also get the benefit by reaching to it as early as possible. Till then safe debugging👍

Technical Blog

Explore more engineering articles

All Articles ↗

Looking for custom
Shopify engineering craft?

Let's build
your store right.

Let's start with a free 30-minute call. No commitment, no templates, no compromises.

Free 30-min call. No commitment. No templates.

Book your free call →

The craft in every click.