`getDistributedNodes()` returns nodes that are already removed under shady dom
zerodevx opened this issue · 0 comments
Hi, I'm not sure if this is expected behavior. Say I have an element <x-test>
that selects and inserts content from its parent,
<x-test>
<dom-module id="x-test">
<template>
<div>x-test's distributed nodes:</div><br>
<content id="content" select="[data-test]"></content>
</template>
</dom-module>
and from my parent, I call it like that,
<parent-element>
<dom-module id="parent-element">
<template>
...
<x-test id="app">
<template is="dom-repeat" items="{{list}}">
<div data-test>{{item.foo}}</div>
</template>
</x-test>
</template>
</dom-module>
where <parent-element>
's list
array looks like
this.push("list", { foo: "item 1" });
this.push("list", { foo: "item 2" });
this.push("list", { foo: "item 3" });
everything works like a champ so far. Calling Polymer.dom(content).getDistributedNodes()
returns the 3 items.
However, if I remove an item from the list,
this.splice("list", 2, 1);
while the template renders just fine, getDistributedNodes()
still returns the full 3 items - when I expect 2 items. This works correctly under native shadow dom behaviour and I thought it should be normalised.
Here is a repro: http://jsbin.com/xebelufika/edit?html,output
Try adding some items, log the nodes, remove some, log the nodes, then add again. It seems that adding an item corrects this behavior.
Thanks so much,
Jason