ResizeObserver loop completed with undelivered notifications

[thomfoolery]

Describe the issue

We're receiving quite a lot of error's from bugsnag reporting the below error.

ResizeObserver loop completed with undelivered notifications

Our investigations of the impacted pages turned up the only usage of ResizeObserver to be in @codemirror/view.

We are on the latest version v6.21.3

I'm posting this to see if others have encountered this error,
and if there is a way to catch or silence the error.

Browser and platform

Error reports seem to be just coming from chrome

Reproduction link

No response

[mtalebian]

Hi,
I also experienced this error when switching focus from an HTML input to the CodeMirror component.

[marijnh]

I haven't found a way to reproduce this, so I cannot confirm the fix, but I think attached patch, which removes the only resize observer that immediately causes an action, is likely to fix this issue.

[mtalebian]

I solved my problem. For me, this problem happened because of installing an extension in Chrome. When I removed the extension, the problem was solved.

If you want to reproduce this error, install the Sider.ai extension in chrome and in your React 18 project add Html input
and CodeMirror component. when switching focus from HTML input to the CodeMirror component a black warning page with following message appears:

Uncaught runtime errors:
ERROR
ResizeObserver loop completed with undelivered notifications.
at handleError (https://localhost:3000/static/js/bundle.js:94032:58)
at https://localhost:3000/static/js/bundle.js:94051:7

Thanks for your attention.

[marijnh]

Thanks for getting back on that. I'd say that is misbehavior on the part of the extension, and not something CodeMirror is really responsible for, but regardless, I expect the current version of the library will avoid the problem.

[thomfoolery]

I think attached patch, which removes the only resize observer that immediately causes an action, is likely to fix this issue.

@marijnh Thank you for your response, was there a recent patch update?
We were on latest at the time I wrote the issue AFAIK.

[marijnh]

Yes, @codemirror/view 6.21.4 has this patch.

[thomfoolery]

@marijnh I'm still investigating,
but my preliminary findings are that upgrading to this patch (from 6.21.3) breaks our syntax highlighting using classHighlighter from @lezer/highlight.

I'll see if I can find some time to reproduce it stackblitz.

[marijnh]

Older versions of npm duplicate packages when you upgrade a single package. Remove your package lock and reinstall all dependencies.

And upgrade npm. Or, if you're using yarn, which is broken in a similar way, I'd recommend you dump that and switch to a recent npm.

[thomfoolery]

@marijnh Thank you for your help with this,

We've updated to @codemirror/view v6.21.4 but we're still getting ResizeObserver loop completed with undelivered notifications in bugsnag. The only usage of ResizeObserver on these pages reporting this error are from this file.

We haven't been able to replicate this error either and I'm not sure if this is the result of a memory leak on our end,
but I just wanted to share our findings incase you had additional context to share.