DEV Community

Cover image for Hot Reload Fails, DOM adds an additional iframe
Atul Bhatt
Atul Bhatt

Posted on

6 4

Hot Reload Fails, DOM adds an additional iframe

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)
Enter fullscreen mode Exit fullscreen mode

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đź‘Ť

Heroku

This site is built on Heroku

Join the ranks of developers at Salesforce, Airbase, DEV, and more who deploy their mission critical applications on Heroku. Sign up today and launch your first app!

Get Started

Top comments (4)

Collapse
 
pedromiotti profile image
Pedro Miotti Arribamar •

Wow, that was exactly what i was looking for, saved me so much headache. Thank you for taking the time to write this post !!!

Collapse
 
atulbhattsystem32 profile image
Atul Bhatt •

Good to know🙂

Collapse
 
karthikmurakonda profile image
karthik mv •

helped our team!
Thanks.

Collapse
 
atulbhattsystem32 profile image
Atul Bhatt •

My purpose of sharing this got fulfilled then.🙂

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up