[MD settings] handle being detached on cr-lazy-render and settings-idle-render

chrome/browser/resources/settings/controls/settings_idle_render.js

 // Copyright 2017 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview
  * settings-idle-render is a simple variant of dom-if designed for lazy
  * rendering of elements that are accessed imperatively.
  * If a use for idle time expansion is found outside of settings, this code
  * should be replaced by cr-lazy-render after that feature is merged into
@@ skipping 11 matching lines @@
 
   /** @private {number} */
   idleCallback_: 0,
 
   /** @override */
   attached: function() {
     this.idleCallback_ = requestIdleCallback(this.render_.bind(this));
   },
 
   /** @override */
   detached: function() {

[Dan Beam, 2017/02/08 05:31:36]

because you have a detached method, I assume this element can be removed from
the DOM.

if it's removed from the DOM, this.parentNode may be null.

get() may call render_(), which requires this.parentNode to be non-null.

so I think:

document.createElement('template', 'settings-idle-render').get()

would assert.  am I right?  can we change to return undefined if !parentNode
when calling render_() the first time?  or at least document this requirement?

relevant: same issue in dom-if https://github.com/Polymer/polymer/pull/2696

[dschuyler, 2017/02/09 00:42:47]

That makes sense. Rather than checking !parentNode, the child_ can be set to
null on detach and the rest of the logic looks like it works.
Since this situation could also occur with cr-lazy-render, a child_ = null has
been added there as well.

     // No-op if callback already fired.
     cancelIdleCallback(this.idleCallback_);
   },
 
   /**
    * Stamp the template into the DOM tree synchronously
    * @return {Element} Child element which has been stamped into the DOM tree.
    */
   get: function() {
     if (!this.child_)
       this.render_();
     return this.child_;
   },
 
   /** @private */
   render_: function() {
-    if (!this.ctor)
-      this.templatize(this);
-    var parentNode = this.parentNode;
-    if (parentNode && !this.child_) {
-      var instance = this.stamp({});
-      this.child_ = instance.root.firstElementChild;
-      parentNode.insertBefore(instance.root, this);
-    }
+    // Only initialize once.
+    assert(!this.ctor);
+    cancelIdleCallback(this.idleCallback_);
+
+    // Must have a parent and child in order to add child to parent.
+    assert(this.parentNode && !this.child_);
+    this.templatize(this);
+    var instance = this.stamp({});
+    this.child_ = instance.root.firstElementChild;
+    this.parentNode.insertBefore(instance.root, this);
   },
 
   /**
    * @param {string} prop
    * @param {Object} value
    */
   _forwardParentProp: function(prop, value) {
     if (this.child_)
       this.child_._templateInstance[prop] = value;
   },
 
   /**
    * @param {string} path
    * @param {Object} value
    */
   _forwardParentPath: function(path, value) {
     if (this.child_)
       this.child_._templateInstance.notifyPath(path, value, true);
   }
 });