ResizeObserver loop completed with undelivered notifications /bokeh charts with reactgridlayout for dragable,resizable bokeh charts

Question

I am using bokeh charts inside the React grid layout library, The React grid layout has the features resizable, draggable,rearrangable, The normal div is working fine for the React grid layout when I use the bokeh chart inside the div that time I got the following error ResizeObserver loop completed with undelivered notifications. At handleError http://localhost:3000/static/js/bundle.js:320493:58 at http://localhost:3000/static/js/bundle.js:320512:7, how can I resolve this?my browser error message

I try to implement the dragable,resizavle, bokeh chart .I have the controls,when i was drag and drop the controls based on the condtion it drop the bokeh chart ,i bind the boeh chart inside the react-grid-layout , for this i faced this issue.

Answer 1

iframe#webpack-dev-server-client-overlay{ display:none!important }

Add this to your CSS file,like app.css or app.scss ,you need to add this in the root css or scss file

Answer 2

I encountered a similar issue. The problem might stem from a version compatibility issue between react-grid-layout and React.

In my setup, I had React version 17.0.2 with the latest react-grid-layout version 1.4.2. I resolved the issue by downgrading react-grid-layout to 1.3.4:

npm install [email protected] --save

It might be worth giving this a try.