Polymer/polymer

`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