Items pushed on lists don't get removed from the DOM in some cases

[daffl]

In certain cases elements pushed to a list that is rendered with each stay in the DOM even if the parent element has been removed (interestingly enough all wrapping DOM will be gone as well). Using a template like:

<div>
{{#data}}
    <p>This is the item:</p>
    {{#item}}
        {{#each subitems}}
            <div class="item">
                {{test}}
            </div>
        {{/each}}
    {{/item}}
{{/data}}
</div>

And this component:

can.Component.extend({
    tag: 'editor',
    template: can.view('editor'),
    scope: {
        data: {
            item: {
                name: "My Name",
                subitems: [{
                    test: 'first'
                }]
            }
        }
    },
    events: {
        inserted: function() {
            var scope = this.scope;
            scope.attr('data.item.subitems').push({
                test: 'Pushed item'
            });
            setTimeout(function() {
                scope.attr('data').removeAttr('item');
            }, 3000);
        }
    }
});

$('#container').html(can.view('tpl', {}));

The fragment for the dynamically added Pushed item will remain in the DOM after calling .removeAttr('item').

Fiddle demonstrating the issue: http://jsfiddle.net/Cjsqz/1/

[justinbmeyer]

This means the items added are not properly registering themselves in node_list.

[matthewp]

Hey @justinbmeyer I took a look at this bug a little bit and the item does call nodeLists.register, although I'm not sure what that actually achieves as far as node removal. The first item gets removed through live.html's makeAndPut function. Should both items be removed at that time?

[justinbmeyer]

Closing because of pull request #614