From b967c5ee48be305a544f6bb63d7b07e5a3d89aeb Mon Sep 17 00:00:00 2001
From: Steven Orvell <sorvell@google.com>
Date: Wed, 17 May 2017 16:02:05 -0700
Subject: [PATCH] =?UTF-8?q?Fixes=20#4550.=20Ensure=20that=20`detached`=20c?=
 =?UTF-8?q?annot=20run=20before=20an=20element=20is=20=E2=80=9Creadied.?=
 =?UTF-8?q?=E2=80=9D=20This=20fixes=20an=20issue=20that=20allowed=20an=20e?=
 =?UTF-8?q?lement=20with=20`disable-upgrade`=20to=20process=20the=20`detac?=
 =?UTF-8?q?hed`=20callback.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/mini/ready.html                    | 25 ++++++++++
 test/unit/element-disable-upgrade.html | 64 ++++++++++++++++++++++++++
 2 files changed, 89 insertions(+)

diff --git a/src/mini/ready.html b/src/mini/ready.html
index 38c6586a3d..f1e72499a8 100644
--- a/src/mini/ready.html
+++ b/src/mini/ready.html
@@ -32,6 +32,7 @@
 (function() {
 
   var baseAttachedCallback = Polymer.Base.attachedCallback;
+  var baseDetachedCallback = Polymer.Base.detachedCallback;
 
   Polymer.Base._addFeature({
 
@@ -152,6 +153,11 @@
         this._attachedPending = false;
         this.attachedCallback();
       }
+      // only call detached if the element is actually detached
+      if (this._detachedPending && !Polymer.dom(document.body).deepContains(this)) {
+        this._attachedPending = false;
+        this.detachedCallback();
+      }
     },
 
     // for system overriding
@@ -175,8 +181,27 @@
       } else {
         this._attachedPending = true;
       }
+    },
+
+    /**
+     * Polymer library implementation of the Custom Elements `detachedCallback`.
+     *
+     * Note, users should not override `detachedCallback`, and instead should
+     * implement the `detached` method on Polymer elements to receive
+     * detached-time callbacks.
+     *
+     * @protected
+     */
+    detachedCallback: function() {
+      if (this._readied) {
+        baseDetachedCallback.call(this);
+      } else {
+        this._detachedPending = true;
+      }
     }
 
+
+
   });
 
 })();
diff --git a/test/unit/element-disable-upgrade.html b/test/unit/element-disable-upgrade.html
index c82fc47b81..cc529ffa25 100644
--- a/test/unit/element-disable-upgrade.html
+++ b/test/unit/element-disable-upgrade.html
@@ -32,12 +32,42 @@
   </script>
 </dom-module>
 
+<dom-module id="x-attach">
+  <template>
+    <style>
+    :host {
+      display: block;
+    }
+    </style>
+    <div id="child">Live!</div>
+  </template>
+  <script>
+  HTMLImports.whenReady(function() {
+    Polymer({
+      is: 'x-attach',
+      attached: function() {
+        this._wasAttached = true;
+      },
+      detached: function() {
+        this._wasDetached = true;
+      }
+    });
+  });
+  </script>
+</dom-module>
+
 <test-fixture id="simple">
   <template>
     <x-lazy disable-upgrade></x-lazy>
   </template>
 </test-fixture>
 
+<test-fixture id="attach">
+  <template>
+    <x-attach disable-upgrade></x-attach>
+  </template>
+</test-fixture>
+
 <dom-module id="x-complicated-child">
   <script>
   HTMLImports.whenReady(function() {
@@ -141,6 +171,40 @@
       assert.ok(el.$.child);
     });
   });
+  suite('disableUpgrade attach/detach', function() {
+    var el;
+    setup(function() {
+      el = fixture('attach');
+    });
+    test('attached does not fire when element is not yet enabled', function() {
+      assert.notOk(el._wasAttached);
+      el.removeAttribute('disable-upgrade');
+      assert.ok(el._wasAttached);
+    });
+    test('detached does not fire when element is not yet enabled', function() {
+      el.parentNode.removeChild(el);
+      Polymer.dom.flush();
+      assert.notOk(el._wasAttached);
+      assert.notOk(el._wasDetached);
+      el.removeAttribute('disable-upgrade');
+      assert.ok(el._wasAttached);
+      assert.ok(el._wasDetached);
+    });
+    test('detached does not fire when element is detached/attached when not yet enabled', function() {
+      var parent = el.parentNode;
+      parent.removeChild(el);
+      Polymer.dom.flush();
+      assert.notOk(el._wasAttached);
+      assert.notOk(el._wasDetached);
+      parent.appendChild(el);
+      Polymer.dom.flush();
+      assert.notOk(el._wasAttached);
+      assert.notOk(el._wasDetached);
+      el.removeAttribute('disable-upgrade');
+      assert.ok(el._wasAttached);
+      assert.notOk(el._wasDetached);
+    });
+  });
   suite('disableUpgrade and Databinding', function() {
     test('binding to disable-upgrade with true', function() {
       var el = fixture('databind-lazy');