glimmerjs / glimmer-vm

MIT License
1.13k stars 190 forks source link

Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. #1372

Closed dbendaou closed 2 years ago

dbendaou commented 2 years ago

Hey,

I have a weird issue on sentry that pop a lot, related to clear(@glimmer/runtime.js:298:1)

NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
  at clear(@glimmer/runtime.js:298:1)
  at reset(@glimmer/runtime.js:1221:1)
  at resume(@glimmer/runtime.js:843:1)
  at handleException(@glimmer/runtime.js:5430:1)
  at handleException(@glimmer/runtime.js:5670:1)
  at throw(@glimmer/runtime.js:5365:1)
  at evaluate(@glimmer/runtime.js:2604:1)
  at _execute(@glimmer/runtime.js:5348:1)
  at execute(@glimmer/runtime.js:5329:1)
  at rerender(@glimmer/runtime.js:5699:1)
  at render(@ember/-internals/glimmer/index.js:6546:1)
  at cb(@ember/-internals/glimmer/index.js:6864:1)
  at inTransaction(@glimmer/runtime.js:5137:1)
  at _renderRoots(@ember/-internals/glimmer/index.js:6844:1)
  at _renderRootsTransaction(@ember/-internals/glimmer/index.js:6896:1)
  at call(@ember/-internals/glimmer/index.js:6938:1)
  at invoke(backburner.js:360:1)
  at flush(backburner.js:241:1)
  at flush(backburner.js:447:1)
  at _end(backburner.js:1001:1)
  at I._boundAutorunEnd(backburner.js:650:1)

I neither achieve to reproduce nor to understand from which component it's from, therefore, I think there's a bug maybe a bug in glimmer?

The issue seems to occur on all browsers, even the last version of Chrome (97)

Here's the complete stack trace on this gist https://gist.github.com/dbendaou/ec2cdd0b6808cb0182f70a5ec0a78a51

tansongyang commented 2 years ago

Bumping this. This happens rarely, but when it does happen, it generates thousands of errors in quick succesesion and floods our logs.

CvX commented 2 years ago

This happens usually when a browser extension (or built-in feature) modifies app's DOM tree. The most common suspect is Google Translate but there are many extensions that pull the rug out from under frameworks' feet 😃 See e.g. the lengthy discussion on this topic at react's repo: https://github.com/facebook/react/issues/11538 (and all the related issues)

dbendaou commented 2 years ago

Yeah indeed, in the end, my issue was mitigated by preventing google translation to translate the page 😄 Will close the issue

johanrd commented 1 year ago

I see this from time to time as well, and have yet to reproduce it when I try. It is not a very viable solution to tell users to uninstall various chrome extensions and/or not use google translate in order to not break the app.

Is it possible with a more resilient handling in clearElement?

https://github.com/glimmerjs/glimmer-vm/blob/4f1bef0d9a8a3c3ebd934c5b6e09de4c5f6e4468/packages/%40glimmer/util/lib/dom.ts#L4-L12

Perhaps a try-catch? Or will that anyways disturb some other inner workings?