Fixes Polymer#2334: when composing nodes in shady dom, check if a node is where we expect it to be before removing it from its distributed position. We do this because the node may have been moved by Polymer.dom in a way that triggered distribution of its previous location. The node is already where it needs to be so removing it from its parent when it's no longer distributed is destructive.

Author: Steven Orvell

src/mini/shady.html

@@ -300,7 +300,13 @@
         // process removals
         for (var i=0, d=0, s; (i<splices.length) && (s=splices[i]); i++) {
           for (var j=0, n; (j < s.removed.length) && (n=s.removed[j]); j++) {
-            remove(n);
+            // check if the node is still where we expect it is before trying
+            // to remove it; this can happen if Polymer.dom moves a node and 
+            // then schedules its previous host for distribution resulting in
+            // the node being removed here.
+            if (getComposedParent(n) === container) {
+              remove(n);
+            }
             composed.splice(s.index + d, 1);
           }
           d -= s.addedCount;

test/unit/polymer-dom-content.html

@@ -29,6 +29,17 @@
   </script>
 </dom-module>
 
+<dom-module id="x-dist-simple">
+  <template>
+    <content id="content"></content>
+  </template>
+  <script>
+  HTMLImports.whenReady(function() {
+    Polymer({is: 'x-dist-simple'});
+  });
+  </script>
+</dom-module>
+
 <dom-module id="x-dist-inside-deep-tree">
   <template>
     x-dist-inside-deep-tree
@@ -1171,6 +1182,73 @@
       document.body.removeChild(h1);
     });
 
+    test('moving children between distributing host with shallow insertion and fragment', function() {
+      var h1 = document.createElement('x-dist-simple');
+      var h2 = document.createDocumentFragment();;
+      document.body.appendChild(h1);
+      Polymer.dom.flush();
+      var d = document.createElement('div');
+      Polymer.dom(h1).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h1).childNodes.length, 1);
+      assert.equal(Polymer.dom(h1).firstElementChild, d);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes(), [d]);
+      assert.equal(Polymer.dom(h2).childNodes.length, 0);
+      Polymer.dom(h2).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h2).childNodes.length, 1);
+      assert.equal(Polymer.dom(h2).firstElementChild, d);
+      assert.equal(Polymer.dom(h1).childNodes.length, 0);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes().length, 0);
+      Polymer.dom(h1).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h1).childNodes.length, 1);
+      assert.equal(Polymer.dom(h1).firstElementChild, d);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes(), [d]);
+      assert.equal(Polymer.dom(h2).childNodes.length, 0);
+      Polymer.dom(h2).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h2).childNodes.length, 1);
+      assert.equal(Polymer.dom(h2).firstElementChild, d);
+      assert.equal(Polymer.dom(h1).childNodes.length, 0);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes().length, 0);
+      document.body.removeChild(h1);
+    });
+
+    test('moving children between distributing host with shallow insertion and fragment (parsed child)', function() {
+      var div = document.createElement('div');
+      div.innerHTML = '<x-dist-simple><div></div></x-dist-simple>';
+      var h1 = div.firstChild;
+      var h2 = document.createDocumentFragment();;
+      document.body.appendChild(h1);
+      Polymer.dom.flush();
+      var d = Polymer.dom(h1).firstElementChild;
+      assert.equal(d.localName, 'div');
+      assert.equal(Polymer.dom(h1).childNodes.length, 1);
+      assert.equal(Polymer.dom(h1).firstElementChild, d);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes(), [d]);
+      assert.equal(Polymer.dom(h2).childNodes.length, 0);
+      Polymer.dom(h2).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h2).childNodes.length, 1);
+      assert.equal(Polymer.dom(h2).firstElementChild, d);
+      assert.equal(Polymer.dom(h1).childNodes.length, 0);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes().length, 0);
+      Polymer.dom(h1).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h1).childNodes.length, 1);
+      assert.equal(Polymer.dom(h1).firstElementChild, d);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes(), [d]);
+      assert.equal(Polymer.dom(h2).childNodes.length, 0);
+      Polymer.dom(h2).appendChild(d);
+      Polymer.dom.flush();
+      assert.equal(Polymer.dom(h2).childNodes.length, 1);
+      assert.equal(Polymer.dom(h2).firstElementChild, d);
+      assert.equal(Polymer.dom(h1).childNodes.length, 0);
+      assert.deepEqual(Polymer.dom(h1.$.content).getDistributedNodes().length, 0);
+      document.body.removeChild(h1);
+    });
+
     test('moving an element containing a dom-repeat that distributes items', function() {
       var x1 = document.createElement('x-repeat');
       var div = document.createElement('div');