Fix for detached Node element exception #389
Conversation
Insert the virtual component bound back to make sure Glimmer is not confused about the state of the DOM resulting in `DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.` I was unable to add a failing test for this but I have added a few test cases to improve test coverage and verified the fix in a consuming application.
| @@ -539,6 +539,9 @@ export default class Radar { | |||
| if (item) { | |||
| insertRangeBefore(this._domPool, null, component.realUpperBound, component.realLowerBound); | |||
| } else { | |||
| // Insert the virtual component bound back to make sure Glimmer is | |||
| // not confused about the state of the DOM. | |||
| insertRangeBefore(this._itemContainer, null, component.realUpperBound, component.realLowerBound); | |||
There was a problem hiding this comment.
We tracked this down in our app. Specifically the fail case is as follows:
A virtual component is still in the buffer pool at the point it is removed but has been scrolled out of the rendered area. So for instance if you have a collapsible tree structure and scroll up to the top of an open section some items in the lower portion of the section might be de-rendered but still in the pool. If you then collapse the tree this error will be triggered.
While this fix seems good enough, there's probably a more correct fix to be found here that addresses both this and the original issue the run below is papering over. I also suspect that run should be run.join.
At a minimum, I think we should follow up with a check for whether we are in the document-fragment or still in the DOM, if we are not in the fragment there's no reason to re-insert in this way.
There was a problem hiding this comment.
linking #358 which introduced this error as part of trying to fix a similar fail case elsewhere
…in release notes
Insert the virtual component bound back to make sure Glimmer is not confused about the state of the DOM resulting in
DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.I was unable to add a failing test for this but I have added a few test cases to improve test coverage and verified the fix in a consuming application.