smb
smb

Reputation: 589

React hot reload adding iFrame with high z-index, nothing clickable unless dom element deleted

Whenever I make a save and React hot reloads the app, an iframe with a high z-index gets injected which makes the UI un-clickable.

I have to either open up dev tools and delete the element OR I have to refresh the UI for things to work correctly again.

If I delete the dom element, it doesn't attempt to add again into the UI unless I refresh and there's another hot reload. Using incognito or no extensions gives the same result.

iframe and code that's being injected

Upvotes: 5

Views: 1718

Answers (1)

Pawan
Pawan

Reputation: 142

To solve this issue you need to add the following to your package.json file:

"resolutions": {
  "react-error-overlay": "6.0.9"
},

Then install react-error-overlay as a dev dependency with npm i --save-dev [email protected]. Then remove your node_modules folder and package-lock.json file. Run npm install and check if that works.

If the issue is not resolved, run npm install [email protected] again it will solve the issue. More information is available here.

Upvotes: 3

Related Questions