Continuous "ResizeObserver loop completed with undelivered notifications." Error in Grafana Logs (Vue app)

152 views Asked by At

I'm encountering a persistent error in my Grafana logs: Error: ResizeObserver loop completed with undelivered notifications. However, I cannot directly catch this error in the console; it only appears in the Grafana logs.

To remediate the error, I have tried the following approaches, but none have resolved the issue:

  1. Adding data-lpignore="true" to the inputs and autocomplete="off"----
  2. Testing both with and without the LastPass extension to check if the extension was the root cause. The issue persists regardless, indicating that the problem does not stem from this extension.
  3. Applying CSS to hide the iframe used by the webpack-dev-server client overlay: iframe#webpack-dev-server-client-overlay{display:none!important;}. This did not help.
  4. Attempting to manually handle the ResizeObserver by tracking entries and disconnecting the observer on component unmount. Here's an approximation of my approach:
let resizeObserverEntries = []
    
const observer = new ResizeObserver((entries)=>{
 resizeObserverEntries = entries
})

if(inputRef.current) observer.observe(inputRef.current)

return () => {
  resizeObserverEntries.forEach((entry)=>entry.target.remove())
  observer.disconnect()
}

inputRef can be just a ref<HTMLInputElement | null>() or I was selecting all elements from the component. It also didn't helped. 6) We're using Element-Plus library for most of the form components. Looked through each version update and saw that they had some problems regarding resize event, so decided to update the library to the latest version. Guess what? It also didn't help.

0

There are 0 answers