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

[dbendaou]

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]

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

[CvX]

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: facebook/react#11538 (and all the related issues)

[dbendaou]

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

[johanrd]

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?

glimmer-vm/packages/@glimmer/util/lib/dom.ts

Lines 4 to 12 in 4f1bef0

	export function clearElement(parent: SimpleElement) {
	let current: Option<SimpleNode> = parent.firstChild;
	while (current) {
	let next = current.nextSibling;
	parent.removeChild(current);
	current = next;
	}
	}

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