knockout-fast-foreach
knockout-fast-foreach copied to clipboard
Nested fast-foreach
Nested elements can lead to a:
Uncaught TypeError: Cannot read property 'insertBefore' of null
ko.virtualElements.prepend
ko.virtualElements.insertAfter
FastForEach.insertAllAfter
FastForEach.added
...
Hello @brianmhunt, could you please provide me some sample codes which reproduces the issue? I'll try to have a look.
Thanks @cervengoc – I'll try and put together a test case, then we can sort out the issue. :)
The gist is that (using ko.punches syntax)
{{ fastForEach: x }}
{{ fastForEach: y }}
<div> Node </div>
{{ /fastForEach }}
{{ /fastForEach }}
will error when x has items that are disposed. It seems that the node-removal logic of y continues even after it has been detached from the DOM.
It should be a simple fix, but obviously it'd be right to nail down a test case that covers the failure.
I'll do that as soon as I can, but feel free to give the above a whirl just to see if it reproduces regularly on that simple case.
Thanks @cervengoc ! p.s. Happy new year :)
@brianmhunt In my current fork last year I started to work on partitioned DOM insterts, probably you remember. Besides that code change, I've also added a little check where we remove nodes if the node is attached (ie. parentNode is not null). Could you please try to add that one line and try it like that too?
@brianmhunt Could you cooperate to prepare the failing test? I can get some time to deal with it then nowadays.
Checking the sourcecode it looks like sometimes the insertAfterNode.nextSibling is null.
// ...
} else {
// Children of start comments must always have a parent and at least one following sibling (the end comment)
containerNode.parentNode.insertBefore(nodeToInsert, insertAfterNode.nextSibling);
}
// ...
Couldn't we simply test for this?
// ...
} elseif (insertAfterNode.nextSibling) {
// Children of start comments must always have a parent and at least one following sibling (the end comment)
containerNode.parentNode.insertBefore(nodeToInsert, insertAfterNode.nextSibling);
}
// ...
@brianmhunt Any movement on this? I have multiple fastforEach in a template (both nested and un-nested) and once I call one, any subsequent calls are having the node cleared and don't display any results.
I haven't looked at this in a bit, but if you can nail down a test that'd certainly go a long way — and in any case, a PR is welcome.