How should foreach binding deal with items mid-animation when updating afterwards

[mbest]

From: http://stackoverflow.com/q/14828688/1287183

When adding an item while the beforeRemove animation is running, the removed element is moved to the bottom of the list instead of staying in its position until the animation has finished and the element is removed.

Fiddle: http://jsfiddle.net/bPP5Q/8/

[mbest]

One option that will at least prevent the strangeness in the example would be to remove extra content on each update. (This made me think of #716.)

[WinstonFassett]

I'm seeing the same issues anytime the array is rerendered (renderTemplateForEach) while beforeRemove transitions are still executing.

I first learned about this from this post in the Greensock forum:
http://forums.greensock.com/topic/9183-animating-with-knockoutjs/
fiddle: http://jsfiddle.net/3ucVg/3/

Next I found issue #943, but it was closed, saying to look at the example at http://knockoutjs.com/examples/animatedTransitions.html

While that example "works", it can also produce this error in a number of ways, as shown in this fiddle: http://jsfiddle.net/WinstonF/8k8V5/2264/ (forked from RPN's fiddle: http://jsfiddle.net/rniemeyer/8k8V5/)

It seems like fixing this would require us to treat deleted items that have a beforeRemove callback more like moved or retained items until they are finally removed from the DOM at the end of the transition.

Any suggestions?

[mbest]

I've worked on a fix for this problem, which I've attached to this issue. The fixed version can be seen demonstrated here: http://jsfiddle.net/mbest/8k8V5/2734/

[mbest]

The fix is to have the foreach binding continue tracking the "removed" nodes until they are actually removed. This means that the beforeRemove handler must remove all of the nodes in order for the binding to stop tracking them. The original jsFiddle example didn't remove non-element nodes (such as text nodes) and so the binding would track all removed items forever.

[mbest]

@rniemeyer, Can you take a look at this and give me your thoughts?

[rniemeyer]

@mbest - sure, will probably be early next week, but happy to take a look

[rniemeyer]

@mbest - great fix. works very well.

[mbest]

Thanks!