diff --git a/externs/polymer-externs.js b/externs/polymer-externs.js
index 06c7d6e9ba..f49bf21e0a 100644
--- a/externs/polymer-externs.js
+++ b/externs/polymer-externs.js
@@ -135,6 +135,30 @@ Polymer.legacyOptimizations;
 /** @type {boolean} */
 Polymer.syncInitialRender;
 
+/** @type {boolean} */
+Polymer.legacyUndefined;
+
+/** @type {boolean} */
+Polymer.legacyNoBatch;
+
+/** @type {boolean} */
+Polymer.legacyWarnings;
+
+/** @type {boolean} */
+Polymer.legacyNotifyOrder;
+
+/** @type {boolean} */
+Polymer.orderedComputed;
+
+/** @type {boolean} */
+Polymer.fastDomIf;
+
+/** @type {boolean} */
+Polymer.removeNestedTemplates;
+
+/** @type {boolean} */
+Polymer.suppressTemplateNotifications;
+
 // nb. This is explicitly 'var', as Closure Compiler checks that this is the case.
 /**
  * @constructor
diff --git a/externs/polymer-internal-shared-types.js b/externs/polymer-internal-shared-types.js
index fd954c1180..8fd9637e6f 100644
--- a/externs/polymer-internal-shared-types.js
+++ b/externs/polymer-internal-shared-types.js
@@ -61,9 +61,13 @@ TemplateInfo.prototype.hostProps;
 /** @type {!Object} */
 TemplateInfo.prototype.propertyEffects;
 /** @type {TemplateInfo | undefined} */
-TemplateInfo.prototype.nextTemplateInfo;
+TemplateInfo.prototype.nextSibling;
 /** @type {TemplateInfo | undefined} */
-TemplateInfo.prototype.previousTemplateInfo;
+TemplateInfo.prototype.previousSibling;
+/** @type {TemplateInfo | undefined} */
+TemplateInfo.prototype.firstChild;
+/** @type {TemplateInfo | undefined} */
+TemplateInfo.prototype.parent;
 /** @type {!Array<!Node>} */
 TemplateInfo.prototype.childNodes;
 /** @type {boolean} */
diff --git a/externs/webcomponents-externs.js b/externs/webcomponents-externs.js
index 1d796ded48..b773a92834 100644
--- a/externs/webcomponents-externs.js
+++ b/externs/webcomponents-externs.js
@@ -1,6 +1,7 @@
 /**
  * @fileoverview Externs for webcomponents polyfills
  * @externs
+ * @suppress {duplicate}
  *
  * @license
  * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -12,42 +13,49 @@
  */
 /* eslint-disable */
 
-var HTMLImports = {
-  /**
-   * @param {function()} callback
-   */
-  whenReady(callback) {},
-  /**
-   * @param {!Node} element
-   * @return {?HTMLLinkElement|?Document|undefined}
-   */
-  importForElement(element) {}
-};
+var HTMLImports = {};
+
+/**
+ * @param {function()=} callback
+ */
+HTMLImports.whenReady = function(callback) {};
+
+/**
+ * Returns the import document containing the element.
+ * @param {!Node} element
+ * @return {?HTMLLinkElement|?Document|undefined}
+ */
+HTMLImports.importForElement = function(element) {};
 
 window.HTMLImports = HTMLImports;
 
-var ShadyDOM = {
-  inUse: false,
-  flush() {},
-  /**
-   * @param {!Node} target
-   * @param {function(Array<MutationRecord>, MutationObserver)} callback
-   * @return {MutationObserver}
-   */
-  observeChildren(target, callback) {},
-  /**
-   * @param {MutationObserver} observer
-   */
-  unobserveChildren(observer) {},
-  /**
-   * @param {Node} node
-   */
-  patch(node) {},
-  /**
-   * @param {!ShadowRoot} shadowroot
-   */
-  flushInitial(shadowroot) {}
-};
+var ShadyDOM = {};
+
+ShadyDOM.inUse;
+
+ShadyDOM.flush = function() {};
+
+/**
+ * @param {!Node} target
+ * @param {function(Array<MutationRecord>, MutationObserver)} callback
+ * @return {MutationObserver}
+ */
+ShadyDOM.observeChildren = function(target, callback) {};
+
+/**
+ * @param {MutationObserver} observer
+ */
+ShadyDOM.unobserveChildren = function(observer) {};
+
+/**
+ * @param {Node} node
+ */
+ShadyDOM.patch = function(node) {};
+
+/**
+ * @param {!ShadowRoot} shadowroot
+ */
+ShadyDOM.flushInitial = function(shadowroot) {};
 
 window.ShadyDOM = ShadyDOM;
 
@@ -66,3 +74,8 @@ HTMLTemplateElement.decorate = function(template){};
  * @param {function(function())} cb callback
  */
 CustomElementRegistry.prototype.polyfillWrapFlushCallback = function(cb){};
+
+/**
+ * @param {string} cssText
+ */
+CSSStyleSheet.prototype.replaceSync = function(cssText) {};
diff --git a/interfaces.d.ts b/interfaces.d.ts
index 5c04d71619..a72ed6487a 100644
--- a/interfaces.d.ts
+++ b/interfaces.d.ts
@@ -116,8 +116,6 @@ export interface TemplateInfo {
   hasInsertionPoint?: boolean;
   hostProps: Object;
   propertyEffects: Object;
-  nextTemplateInfo?: TemplateInfo;
-  previousTemplateInfo?: TemplateInfo;
   childNodes: Node[];
   wasPreBound: boolean;
 }
diff --git a/lib/elements/dom-if.js b/lib/elements/dom-if.js
index 2b4f23c70d..729833a32c 100644
--- a/lib/elements/dom-if.js
+++ b/lib/elements/dom-if.js
@@ -9,36 +9,23 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 */
 import { PolymerElement } from '../../polymer-element.js';
 
-import { templatize } from '../utils/templatize.js';
 import { Debouncer } from '../utils/debounce.js';
 import { enqueueDebouncer, flush } from '../utils/flush.js';
 import { microTask } from '../utils/async.js';
 import { root } from '../utils/path.js';
 import { wrap } from '../utils/wrap.js';
 import { hideElementsGlobally } from '../utils/hide-template-controls.js';
+import { fastDomIf, strictTemplatePolicy, suppressTemplateNotifications } from '../utils/settings.js';
+import { showHideChildren, templatize } from '../utils/templatize.js';
 
 /**
- * The `<dom-if>` element will stamp a light-dom `<template>` child when
- * the `if` property becomes truthy, and the template can use Polymer
- * data-binding and declarative event features when used in the context of
- * a Polymer element's template.
- *
- * When `if` becomes falsy, the stamped content is hidden but not
- * removed from dom. When `if` subsequently becomes truthy again, the content
- * is simply re-shown. This approach is used due to its favorable performance
- * characteristics: the expense of creating template content is paid only
- * once and lazily.
- *
- * Set the `restamp` property to true to force the stamped content to be
- * created / destroyed when the `if` condition changes.
- *
  * @customElement
  * @polymer
  * @extends PolymerElement
- * @summary Custom element that conditionally stamps and hides or removes
- *   template content based on a boolean flag.
+ * @summary Base class for dom-if element; subclassed into concrete
+ *   implementation.
  */
-export class DomIf extends PolymerElement {
+class DomIfBase extends PolymerElement {
 
   // Not needed to find template; can be removed once the analyzer
   // can find the tag name from customElements.define call
@@ -76,8 +63,16 @@ export class DomIf extends PolymerElement {
       restamp: {
         type: Boolean,
         observer: '__debounceRender'
-      }
+      },
 
+      /**
+       * When the global `suppressTemplateNotifications` setting is used, setting
+       * `notifyDomChange: true` will enable firing `dom-change` events on this
+       * element.
+       */
+      notifyDomChange: {
+        type: Boolean
+      }
     };
 
   }
@@ -85,11 +80,12 @@ export class DomIf extends PolymerElement {
   constructor() {
     super();
     this.__renderDebouncer = null;
-    this.__invalidProps = null;
-    this.__instance = null;
     this._lastIf = false;
-    this.__ctor = null;
     this.__hideTemplateChildren__ = false;
+    /** @type {!HTMLTemplateElement|undefined} */
+    this.__template;
+    /** @type {!TemplateInfo|undefined} */
+    this._templateInfo;
   }
 
   __debounceRender() {
@@ -143,32 +139,121 @@ export class DomIf extends PolymerElement {
     }
   }
 
+  /**
+   * Ensures a template has been assigned to `this.__template`.  If it has not
+   * yet been, it querySelectors for it in its children and if it does not yet
+   * exist (e.g. in parser-generated case), opens a mutation observer and
+   * waits for it to appear (returns false if it has not yet been found,
+   * otherwise true).  In the `removeNestedTemplates` case, the "template" will
+   * be the `dom-if` element itself.
+   *
+   * @return {boolean} True when a template has been found, false otherwise
+   */
+  __ensureTemplate() {
+    if (!this.__template) {
+      // When `removeNestedTemplates` is true, the "template" is the element
+      // itself, which has been given a `_templateInfo` property
+      const thisAsTemplate = /** @type {!HTMLTemplateElement} */ (
+          /** @type {!HTMLElement} */ (this));
+      let template = thisAsTemplate._templateInfo ?
+          thisAsTemplate :
+          /** @type {!HTMLTemplateElement} */
+          (wrap(thisAsTemplate).querySelector('template'));
+      if (!template) {
+        // Wait until childList changes and template should be there by then
+        let observer = new MutationObserver(() => {
+          if (wrap(this).querySelector('template')) {
+            observer.disconnect();
+            this.__render();
+          } else {
+            throw new Error('dom-if requires a <template> child');
+          }
+        });
+        observer.observe(this, {childList: true});
+        return false;
+      }
+      this.__template = template;
+    }
+    return true;
+  }
+
+  /**
+   * Ensures a an instance of the template has been created and inserted. This
+   * method may return false if the template has not yet been found or if
+   * there is no `parentNode` to insert the template into (in either case,
+   * connection or the template-finding mutation observer firing will queue
+   * another render, causing this method to be called again at a more
+   * appropriate time).
+   *
+   * Subclasses should implement the following methods called here:
+   * - `__hasInstance`
+   * - `__createAndInsertInstance`
+   * - `__getInstanceNodes`
+   *
+   * @return {boolean} True if the instance was created, false otherwise.
+   */
+  __ensureInstance() {
+    let parentNode = wrap(this).parentNode;
+    if (!this.__hasInstance()) {
+      // Guard against element being detached while render was queued
+      if (!parentNode) {
+        return false;
+      }
+      // Find the template (when false, there was no template yet)
+      if (!this.__ensureTemplate()) {
+        return false;
+      }
+      this.__createAndInsertInstance(parentNode);
+    } else {
+      // Move instance children if necessary
+      let children = this.__getInstanceNodes();
+      if (children && children.length) {
+        // Detect case where dom-if was re-attached in new position
+        let lastChild = wrap(this).previousSibling;
+        if (lastChild !== children[children.length-1]) {
+          for (let i=0, n; (i<children.length) && (n=children[i]); i++) {
+            wrap(parentNode).insertBefore(n, this);
+          }
+        }
+      }
+    }
+    return true;
+  }
+
   /**
    * Forces the element to render its content. Normally rendering is
    * asynchronous to a provoking change. This is done for efficiency so
    * that multiple changes trigger only a single render. The render method
    * should be called if, for example, template rendering is required to
    * validate application state.
+   *
    * @return {void}
    */
   render() {
     flush();
   }
 
+  /**
+   * Performs the key rendering steps:
+   * 1. Ensure a template instance has been stamped (when true)
+   * 2. Remove the template instance (when false and restamp:true)
+   * 3. Sync the hidden state of the instance nodes with the if/restamp state
+   * 4. Fires the `dom-change` event when necessary
+   *
+   * @return {void}
+   */
   __render() {
     if (this.if) {
       if (!this.__ensureInstance()) {
         // No template found yet
         return;
       }
-      this._showHideChildren();
     } else if (this.restamp) {
       this.__teardownInstance();
     }
-    if (!this.restamp && this.__instance) {
-      this._showHideChildren();
-    }
-    if (this.if != this._lastIf) {
+    this._showHideChildren();
+    if ((!suppressTemplateNotifications || this.notifyDomChange)
+        && this.if != this._lastIf) {
       this.dispatchEvent(new CustomEvent('dom-change', {
         bubbles: true,
         composed: true
@@ -177,81 +262,323 @@ export class DomIf extends PolymerElement {
     }
   }
 
-  __ensureInstance() {
-    let parentNode = wrap(this).parentNode;
-    // Guard against element being detached while render was queued
-    if (parentNode) {
-      if (!this.__ctor) {
-        let template = /** @type {HTMLTemplateElement} */(wrap(this).querySelector('template'));
-        if (!template) {
-          // Wait until childList changes and template should be there by then
-          let observer = new MutationObserver(() => {
-            if (wrap(this).querySelector('template')) {
-              observer.disconnect();
-              this.__render();
-            } else {
-              throw new Error('dom-if requires a <template> child');
-            }
-          });
-          observer.observe(this, {childList: true});
-          return false;
-        }
-        this.__ctor = templatize(template, this, {
-          // dom-if templatizer instances require `mutable: true`, as
-          // `__syncHostProperties` relies on that behavior to sync objects
-          mutableData: true,
-          /**
-           * @param {string} prop Property to forward
-           * @param {*} value Value of property
-           * @this {DomIf}
-           */
-          forwardHostProp: function(prop, value) {
-            if (this.__instance) {
-              if (this.if) {
-                this.__instance.forwardHostProp(prop, value);
-              } else {
-                // If we have an instance but are squelching host property
-                // forwarding due to if being false, note the invalidated
-                // properties so `__syncHostProperties` can sync them the next
-                // time `if` becomes true
-                this.__invalidProps = this.__invalidProps || Object.create(null);
-                this.__invalidProps[root(prop)] = true;
-              }
-            }
-          }
-        });
+  // Ideally these would be annotated as abstract methods in an abstract class,
+  // but closure compiler is finnicky
+  /* eslint-disable valid-jsdoc */
+  /**
+   * Abstract API to be implemented by subclass: Returns true if a template
+   * instance has been created and inserted.
+   *
+   * @protected
+   * @return {boolean} True when an instance has been created.
+   */
+  __hasInstance() { }
+
+  /**
+   * Abstract API to be implemented by subclass: Returns the child nodes stamped
+   * from a template instance.
+   *
+   * @protected
+   * @return {Array<Node>} Array of child nodes stamped from the template
+   * instance.
+   */
+  __getInstanceNodes() { }
+
+  /**
+   * Abstract API to be implemented by subclass: Creates an instance of the
+   * template and inserts it into the given parent node.
+   *
+   * @protected
+   * @param {Node} parentNode The parent node to insert the instance into
+   * @return {void}
+   */
+  __createAndInsertInstance(parentNode) { } // eslint-disable-line no-unused-vars
+
+  /**
+   * Abstract API to be implemented by subclass: Removes nodes created by an
+   * instance of a template and any associated cleanup.
+   *
+   * @protected
+   * @return {void}
+   */
+  __teardownInstance() { }
+
+  /**
+   * Abstract API to be implemented by subclass: Shows or hides any template
+   * instance childNodes based on the `if` state of the element and its
+   * `__hideTemplateChildren__` property.
+   *
+   * @protected
+   * @return {void}
+   */
+  _showHideChildren() { }
+  /* eslint-enable valid-jsdoc */
+}
+
+/**
+ * The version of DomIf used when `fastDomIf` setting is in use, which is
+ * optimized for first-render (but adds a tax to all subsequent property updates
+ * on the host, whether they were used in a given `dom-if` or not).
+ *
+ * This implementation avoids use of `Templatizer`, which introduces a new scope
+ * (a non-element PropertyEffects instance), which is not strictly necessary
+ * since `dom-if` never introduces new properties to its scope (unlike
+ * `dom-repeat`). Taking advantage of this fact, the `dom-if` reaches up to its
+ * `__dataHost` and stamps the template directly from the host using the host's
+ * runtime `_stampTemplate` API, which binds the property effects of the
+ * template directly to the host. This both avoids the intermediary
+ * `Templatizer` instance, but also avoids the need to bind host properties to
+ * the `<template>` element and forward those into the template instance.
+ *
+ * In this version of `dom-if`, the `this.__instance` method is the
+ * `DocumentFragment` returned from `_stampTemplate`, which also serves as the
+ * handle for later removing it using the `_removeBoundDom` method.
+ */
+class DomIfFast extends DomIfBase {
+
+  constructor() {
+    super();
+    this.__instance = null;
+    this.__syncInfo = null;
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * @override
+   * @return {boolean} True when an instance has been created.
+   */
+  __hasInstance() {
+    return Boolean(this.__instance);
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * @override
+   * @return {Array<Node>} Array of child nodes stamped from the template
+   * instance.
+   */
+  __getInstanceNodes() {
+    return this.__instance.templateInfo.childNodes;
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * Stamps the template by calling `_stampTemplate` on the `__dataHost` of this
+   * element and then inserts the resulting nodes into the given `parentNode`.
+   *
+   * @override
+   * @param {Node} parentNode The parent node to insert the instance into
+   * @return {void}
+   */
+  __createAndInsertInstance(parentNode) {
+    const host = this.__dataHost || this;
+    if (strictTemplatePolicy) {
+      if (!this.__dataHost) {
+        throw new Error('strictTemplatePolicy: template owner not trusted');
       }
-      if (!this.__instance) {
-        this.__instance = new this.__ctor();
-        wrap(parentNode).insertBefore(this.__instance.root, this);
+    }
+    // Pre-bind and link the template into the effects system
+    const templateInfo = host._bindTemplate(
+        /** @type {!HTMLTemplateElement} */ (this.__template), true);
+    // Install runEffects hook that prevents running property effects
+    // (and any nested template effects) when the `if` is false
+    templateInfo.runEffects = (runEffects, changedProps, hasPaths) => {
+      let syncInfo = this.__syncInfo;
+      if (this.if) {
+        // Mix any props that changed while the `if` was false into `changedProps`
+        if (syncInfo) {
+          // If there were properties received while the `if` was false, it is
+          // important to sync the hidden state with the element _first_, so that
+          // new bindings to e.g. `textContent` do not get stomped on by
+          // pre-hidden values if `_showHideChildren` were to be called later at
+          // the next render. Clearing `__invalidProps` here ensures
+          // `_showHideChildren`'s call to `__syncHostProperties` no-ops, so
+          // that we don't call `runEffects` more often than necessary.
+          this.__syncInfo = null;
+          this._showHideChildren();
+          changedProps = Object.assign(syncInfo.changedProps, changedProps);
+        }
+        runEffects(changedProps, hasPaths);
       } else {
-        this.__syncHostProperties();
-        let c$ = this.__instance.children;
-        if (c$ && c$.length) {
-          // Detect case where dom-if was re-attached in new position
-          let lastChild = wrap(this).previousSibling;
-          if (lastChild !== c$[c$.length-1]) {
-            for (let i=0, n; (i<c$.length) && (n=c$[i]); i++) {
-              wrap(parentNode).insertBefore(n, this);
+        // Accumulate any values changed while `if` was false, along with the
+        // runEffects method to sync them, so that we can replay them once `if`
+        // becomes true
+        if (this.__instance) {
+          if (!syncInfo) {
+            syncInfo = this.__syncInfo = { runEffects, changedProps: {} };
+          }
+          if (hasPaths) {
+            // Store root object of any paths; this will ensure direct bindings
+            // like [[obj.foo]] bindings run after a `set('obj.foo', v)`, but
+            // note that path notifications like `set('obj.foo.bar', v)` will
+            // not propagate. Since batched path notifications are not
+            // supported, we cannot simply accumulate path notifications. This
+            // is equivalent to the non-fastDomIf case, which stores root(p) in
+            // __invalidProps.
+            for (const p in changedProps) {
+              const rootProp = root(p);
+              syncInfo.changedProps[rootProp] = this.__dataHost[rootProp];
             }
+          } else {
+            Object.assign(syncInfo.changedProps, changedProps);
           }
         }
       }
-    }
-    return true;
+    };
+    // Stamp the template, and set its DocumentFragment to the "instance"
+    this.__instance = host._stampTemplate(
+        /** @type {!HTMLTemplateElement} */ (this.__template), templateInfo);
+    wrap(parentNode).insertBefore(this.__instance, this);
   }
 
+  /**
+   * Run effects for any properties that changed while the `if` was false.
+   *
+   * @return {void}
+   */
   __syncHostProperties() {
-    let props = this.__invalidProps;
-    if (props) {
-      for (let prop in props) {
-        this.__instance._setPendingProperty(prop, this.__dataHost[prop]);
-      }
-      this.__invalidProps = null;
-      this.__instance._flushProperties();
+    const syncInfo = this.__syncInfo;
+    if (syncInfo) {
+      this.__syncInfo = null;
+      syncInfo.runEffects(syncInfo.changedProps, false);
     }
   }
 
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * Remove the instance and any nodes it created.  Uses the `__dataHost`'s
+   * runtime `_removeBoundDom` method.
+   *
+   * @override
+   * @return {void}
+   */
+  __teardownInstance() {
+    const host = this.__dataHost || this;
+    if (this.__instance) {
+      host._removeBoundDom(this.__instance);
+      this.__instance = null;
+      this.__syncInfo = null;
+    }
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * Shows or hides the template instance top level child nodes. For
+   * text nodes, `textContent` is removed while "hidden" and replaced when
+   * "shown."
+   *
+   * @override
+   * @return {void}
+   * @protected
+   * @suppress {visibility}
+   */
+  _showHideChildren() {
+    const hidden = this.__hideTemplateChildren__ || !this.if;
+    if (this.__instance && Boolean(this.__instance.__hidden) !== hidden) {
+      this.__instance.__hidden = hidden;
+      showHideChildren(hidden, this.__instance.templateInfo.childNodes);
+    }
+    if (!hidden) {
+      this.__syncHostProperties();
+    }
+  }
+}
+
+/**
+ * The "legacy" implementation of `dom-if`, implemented using `Templatizer`.
+ *
+ * In this version, `this.__instance` is the `TemplateInstance` returned
+ * from the templatized constructor.
+ */
+class DomIfLegacy extends DomIfBase {
+
+  constructor() {
+    super();
+    this.__ctor = null;
+    this.__instance = null;
+    this.__invalidProps = null;
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * @override
+   * @return {boolean} True when an instance has been created.
+   */
+  __hasInstance() {
+    return Boolean(this.__instance);
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * @override
+   * @return {Array<Node>} Array of child nodes stamped from the template
+   * instance.
+   */
+  __getInstanceNodes() {
+    return this.__instance.children;
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * Stamps the template by creating a new instance of the templatized
+   * constructor (which is created lazily if it does not yet exist), and then
+   * inserts its resulting `root` doc fragment into the given `parentNode`.
+   *
+   * @override
+   * @param {Node} parentNode The parent node to insert the instance into
+   * @return {void}
+   */
+  __createAndInsertInstance(parentNode) {
+    // Ensure we have an instance constructor
+    if (!this.__ctor) {
+      this.__ctor = templatize(
+          /** @type {!HTMLTemplateElement} */ (this.__template), this, {
+            // dom-if templatizer instances require `mutable: true`, as
+            // `__syncHostProperties` relies on that behavior to sync objects
+            mutableData: true,
+            /**
+             * @param {string} prop Property to forward
+             * @param {*} value Value of property
+             * @this {DomIfLegacy}
+             */
+            forwardHostProp: function(prop, value) {
+              if (this.__instance) {
+                if (this.if) {
+                  this.__instance.forwardHostProp(prop, value);
+                } else {
+                  // If we have an instance but are squelching host property
+                  // forwarding due to if being false, note the invalidated
+                  // properties so `__syncHostProperties` can sync them the next
+                  // time `if` becomes true
+                  this.__invalidProps =
+                      this.__invalidProps || Object.create(null);
+                  this.__invalidProps[root(prop)] = true;
+                }
+              }
+            }
+          });
+    }
+    // Create and insert the instance
+    this.__instance = new this.__ctor();
+    wrap(parentNode).insertBefore(this.__instance.root, this);
+  }
+
+  /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
+   * Removes the instance and any nodes it created.
+   *
+   * @override
+   * @return {void}
+   */
   __teardownInstance() {
     if (this.__instance) {
       let c$ = this.__instance.children;
@@ -267,26 +594,74 @@ export class DomIf extends PolymerElement {
           }
         }
       }
+      this.__invalidProps = null;
       this.__instance = null;
+    }
+  }
+
+  /**
+   * Forwards any properties that changed while the `if` was false into the
+   * template instance and flushes it.
+   *
+   * @return {void}
+   */
+  __syncHostProperties() {
+    let props = this.__invalidProps;
+    if (props) {
       this.__invalidProps = null;
+      for (let prop in props) {
+        this.__instance._setPendingProperty(prop, this.__dataHost[prop]);
+      }
+      this.__instance._flushProperties();
     }
   }
 
   /**
+   * Implementation of abstract API needed by DomIfBase.
+   *
    * Shows or hides the template instance top level child elements. For
    * text nodes, `textContent` is removed while "hidden" and replaced when
    * "shown."
-   * @return {void}
+   *
+   * @override
    * @protected
+   * @return {void}
    * @suppress {visibility}
    */
   _showHideChildren() {
-    let hidden = this.__hideTemplateChildren__ || !this.if;
-    if (this.__instance) {
+    const hidden = this.__hideTemplateChildren__ || !this.if;
+    if (this.__instance && Boolean(this.__instance.__hidden) !== hidden) {
+      this.__instance.__hidden = hidden;
       this.__instance._showHideChildren(hidden);
     }
+    if (!hidden) {
+      this.__syncHostProperties();
+    }
   }
-
 }
 
+/**
+ * The `<dom-if>` element will stamp a light-dom `<template>` child when
+ * the `if` property becomes truthy, and the template can use Polymer
+ * data-binding and declarative event features when used in the context of
+ * a Polymer element's template.
+ *
+ * When `if` becomes falsy, the stamped content is hidden but not
+ * removed from dom. When `if` subsequently becomes truthy again, the content
+ * is simply re-shown. This approach is used due to its favorable performance
+ * characteristics: the expense of creating template content is paid only
+ * once and lazily.
+ *
+ * Set the `restamp` property to true to force the stamped content to be
+ * created / destroyed when the `if` condition changes.
+ *
+ * @customElement
+ * @polymer
+ * @extends DomIfBase
+ * @constructor
+ * @summary Custom element that conditionally stamps and hides or removes
+ *   template content based on a boolean flag.
+ */
+export const DomIf = fastDomIf ? DomIfFast : DomIfLegacy;
+
 customElements.define(DomIf.is, DomIf);
diff --git a/lib/elements/dom-repeat.js b/lib/elements/dom-repeat.js
index cd994da4b2..3a2c7d9175 100644
--- a/lib/elements/dom-repeat.js
+++ b/lib/elements/dom-repeat.js
@@ -17,6 +17,7 @@ import { matches, translate } from '../utils/path.js';
 import { timeOut, microTask } from '../utils/async.js';
 import { wrap } from '../utils/wrap.js';
 import { hideElementsGlobally } from '../utils/hide-template-controls.js';
+import { suppressTemplateNotifications } from '../utils/settings.js';
 
 /**
  * @constructor
@@ -239,20 +240,20 @@ export class DomRepeat extends domRepeatBase {
        */
       renderedItemCount: {
         type: Number,
-        notify: true,
+        notify: !suppressTemplateNotifications,
         readOnly: true
       },
 
       /**
-       * Defines an initial count of template instances to render after setting
-       * the `items` array, before the next paint, and puts the `dom-repeat`
-       * into "chunking mode".  The remaining items will be created and rendered
-       * incrementally at each animation frame therof until all instances have
-       * been rendered.
+       * When greater than zero, defines an initial count of template instances
+       * to render after setting the `items` array, before the next paint, and
+       * puts the `dom-repeat` into "chunking mode".  The remaining items (and
+       * any future items as a result of pushing onto the array) will be created
+       * and rendered incrementally at each animation frame thereof until all
+       * instances have been rendered.
        */
       initialCount: {
-        type: Number,
-        observer: '__initializeChunking'
+        type: Number
       },
 
       /**
@@ -275,6 +276,34 @@ export class DomRepeat extends domRepeatBase {
       _targetFrameTime: {
         type: Number,
         computed: '__computeFrameTime(targetFramerate)'
+      },
+
+      /**
+       * When the global `suppressTemplateNotifications` setting is used, setting
+       * `notifyDomChange: true` will enable firing `dom-change` events on this
+       * element.
+       */
+      notifyDomChange: {
+        type: Boolean
+      },
+
+      /**
+       * When chunking is enabled via `initialCount` and the `items` array is
+       * set to a new array, this flag controls whether the previously rendered
+       * instances are reused or not.
+       *
+       * When `true`, any previously rendered template instances are updated in
+       * place to their new item values synchronously in one shot, and then any
+       * further items (if any) are chunked out.  When `false`, the list is
+       * returned back to its `initialCount` (any instances over the initial
+       * count are discarded) and the remainder of the list is chunked back in.
+       * Set this to `true` to avoid re-creating the list and losing scroll
+       * position, although note that when changing the list to completely
+       * different data the render thread will be blocked until all existing
+       * instances are updated to their new data.
+       */
+      reuseChunkedInstances: {
+        type: Boolean
       }
 
     };
@@ -288,12 +317,14 @@ export class DomRepeat extends domRepeatBase {
   constructor() {
     super();
     this.__instances = [];
-    this.__limit = Infinity;
-    this.__pool = [];
     this.__renderDebouncer = null;
     this.__itemsIdxToInstIdx = {};
     this.__chunkCount = null;
-    this.__lastChunkTime = null;
+    this.__renderStartTime = null;
+    this.__itemsArrayChanged = false;
+    this.__shouldMeasureChunk = false;
+    this.__shouldContinueChunking = false;
+    this.__chunkingId = 0;
     this.__sortFn = null;
     this.__filterFn = null;
     this.__observePaths = null;
@@ -301,6 +332,8 @@ export class DomRepeat extends domRepeatBase {
     this.__ctor = null;
     this.__isDetached = true;
     this.template = null;
+    /** @type {TemplateInfo} */
+    this._templateInfo;
   }
 
   /**
@@ -339,9 +372,15 @@ export class DomRepeat extends domRepeatBase {
     // until ready, since won't have its template content handed back to
     // it until then
     if (!this.__ctor) {
-      let template = this.template = /** @type {HTMLTemplateElement} */(this.querySelector('template'));
+      // When `removeNestedTemplates` is true, the "template" is the element
+      // itself, which has been given a `_templateInfo` property
+      const thisAsTemplate = /** @type {!HTMLTemplateElement} */ (
+          /** @type {!HTMLElement} */ (this));
+      let template = this.template = thisAsTemplate._templateInfo ?
+          thisAsTemplate :
+          /** @type {!HTMLTemplateElement} */ (this.querySelector('template'));
       if (!template) {
-        // // Wait until childList changes and template should be there by then
+        // Wait until childList changes and template should be there by then
         let observer = new MutationObserver(() => {
           if (this.querySelector('template')) {
             observer.disconnect();
@@ -427,57 +466,11 @@ export class DomRepeat extends domRepeatBase {
     return Math.ceil(1000/rate);
   }
 
-  __initializeChunking() {
-    if (this.initialCount) {
-      this.__limit = this.initialCount;
-      this.__chunkCount = this.initialCount;
-      this.__lastChunkTime = performance.now();
-    }
-  }
-
-  __tryRenderChunk() {
-    // Debounced so that multiple calls through `_render` between animation
-    // frames only queue one new rAF (e.g. array mutation & chunked render)
-    if (this.items && this.__limit < this.items.length) {
-      this.__debounceRender(this.__requestRenderChunk);
-    }
-  }
-
-  __requestRenderChunk() {
-    requestAnimationFrame(()=>this.__renderChunk());
-  }
-
-  __renderChunk() {
-    // Simple auto chunkSize throttling algorithm based on feedback loop:
-    // measure actual time between frames and scale chunk count by ratio
-    // of target/actual frame time
-    let currChunkTime = performance.now();
-    let ratio = this._targetFrameTime / (currChunkTime - this.__lastChunkTime);
-    this.__chunkCount = Math.round(this.__chunkCount * ratio) || 1;
-    this.__limit += this.__chunkCount;
-    this.__lastChunkTime = currChunkTime;
-    this.__debounceRender(this.__render);
-  }
-
   __observeChanged() {
     this.__observePaths = this.observe &&
       this.observe.replace('.*', '.').split(' ');
   }
 
-  __itemsChanged(change) {
-    if (this.items && !Array.isArray(this.items)) {
-      console.warn('dom-repeat expected array for `items`, found', this.items);
-    }
-    // If path was to an item (e.g. 'items.3' or 'items.3.foo'), forward the
-    // path to that instance synchronously (returns false for non-item paths)
-    if (!this.__handleItemPath(change.path, change.value)) {
-      // Otherwise, the array was reset ('items') or spliced ('items.splices'),
-      // so queue a full refresh
-      this.__initializeChunking();
-      this.__debounceRender(this.__render);
-    }
-  }
-
   __handleObservedPaths(path) {
     // Handle cases where path changes should cause a re-sort/filter
     if (this.__sortFn || this.__filterFn) {
@@ -496,6 +489,23 @@ export class DomRepeat extends domRepeatBase {
     }
   }
 
+  __itemsChanged(change) {
+    if (this.items && !Array.isArray(this.items)) {
+      console.warn('dom-repeat expected array for `items`, found', this.items);
+    }
+    // If path was to an item (e.g. 'items.3' or 'items.3.foo'), forward the
+    // path to that instance synchronously (returns false for non-item paths)
+    if (!this.__handleItemPath(change.path, change.value)) {
+      // Otherwise, the array was reset ('items') or spliced ('items.splices'),
+      // so queue a render.  Restart chunking when the items changed (for
+      // backward compatibility), unless `reuseChunkedInstances` option is set
+      if (change.path === 'items') {
+        this.__itemsArrayChanged = true;
+      }
+      this.__debounceRender(this.__render);
+    }
+  }
+
   /**
    * @param {function(this:DomRepeat)} fn Function to debounce.
    * @param {number=} delay Delay in ms to debounce by.
@@ -527,26 +537,36 @@ export class DomRepeat extends domRepeatBase {
       // No template found yet
       return;
     }
-    this.__applyFullRefresh();
-    // Reset the pool
-    // TODO(kschaaf): Reuse pool across turns and nested templates
-    // Now that objects/arrays are re-evaluated when set, we can safely
-    // reuse pooled instances across turns, however we still need to decide
-    // semantics regarding how long to hold, how many to hold, etc.
-    this.__pool.length = 0;
+    let items = this.items || [];
+    // Sort and filter the items into a mapping array from instance->item
+    const isntIdxToItemsIdx = this.__sortAndFilterItems(items);
+    // If we're chunking, increase the limit if there are new instances to
+    // create and schedule the next chunk
+    const limit = this.__calculateLimit(isntIdxToItemsIdx.length);
+    // Create, update, and/or remove instances
+    this.__updateInstances(items, limit, isntIdxToItemsIdx);
+    // If we're chunking, schedule a rAF task to measure/continue chunking.     
+    // Do this before any notifying events (renderedItemCount & dom-change)
+    // since those could modify items and enqueue a new full render which will
+    // pre-empt this measurement.
+    if (this.initialCount &&
+       (this.__shouldMeasureChunk || this.__shouldContinueChunking)) {
+      cancelAnimationFrame(this.__chunkingId);
+      this.__chunkingId = requestAnimationFrame(() => this.__continueChunking());
+    }
     // Set rendered item count
     this._setRenderedItemCount(this.__instances.length);
     // Notify users
-    this.dispatchEvent(new CustomEvent('dom-change', {
-      bubbles: true,
-      composed: true
-    }));
-    // Check to see if we need to render more items
-    this.__tryRenderChunk();
+    if (!suppressTemplateNotifications || this.notifyDomChange) {
+      this.dispatchEvent(new CustomEvent('dom-change', {
+        bubbles: true,
+        composed: true
+      }));
+    }
   }
 
-  __applyFullRefresh() {
-    let items = this.items || [];
+  __sortAndFilterItems(items) {
+    // Generate array maping the instance index to the items array index
     let isntIdxToItemsIdx = new Array(items.length);
     for (let i=0; i<items.length; i++) {
       isntIdxToItemsIdx[i] = i;
@@ -560,12 +580,69 @@ export class DomRepeat extends domRepeatBase {
     if (this.__sortFn) {
       isntIdxToItemsIdx.sort((a, b) => this.__sortFn(items[a], items[b]));
     }
+    return isntIdxToItemsIdx;
+  }
+
+  __calculateLimit(filteredItemCount) {
+    let limit = filteredItemCount;
+    const currentCount = this.__instances.length;
+    // When chunking, we increase the limit from the currently rendered count
+    // by the chunk count that is re-calculated after each rAF (with special
+    // cases for reseting the limit to initialCount after changing items)
+    if (this.initialCount) {
+      let newCount;
+      if (!this.__chunkCount ||
+        (this.__itemsArrayChanged && !this.reuseChunkedInstances)) {
+        // Limit next render to the initial count
+        limit = Math.min(filteredItemCount, this.initialCount);
+        // Subtract off any existing instances to determine the number of
+        // instances that will be created
+        newCount = Math.max(limit - currentCount, 0);
+        // Initialize the chunk size with how many items we're creating
+        this.__chunkCount = newCount || 1;
+      } else {
+        // The number of new instances that will be created is based on the
+        // existing instances, the new list size, and the chunk size
+        newCount = Math.min(
+          Math.max(filteredItemCount - currentCount, 0), 
+          this.__chunkCount);
+        // Update the limit based on how many new items we're making, limited
+        // buy the total size of the list
+        limit = Math.min(currentCount + newCount, filteredItemCount);
+      }
+      // Record some state about chunking for use in `__continueChunking`
+      this.__shouldMeasureChunk = newCount === this.__chunkCount;
+      this.__shouldContinueChunking = limit < filteredItemCount;
+      this.__renderStartTime = performance.now();
+    }
+    this.__itemsArrayChanged = false;
+    return limit;
+  }
+
+  __continueChunking() {
+    // Simple auto chunkSize throttling algorithm based on feedback loop:
+    // measure actual time between frames and scale chunk count by ratio of
+    // target/actual frame time.  Only modify chunk size if our measurement
+    // reflects the cost of a creating a full chunk's worth of instances; this
+    // avoids scaling up the chunk size if we e.g. quickly re-rendered instances
+    // in place
+    if (this.__shouldMeasureChunk) {
+      const renderTime = performance.now() - this.__renderStartTime;
+      const ratio = this._targetFrameTime / renderTime;
+      this.__chunkCount = Math.round(this.__chunkCount * ratio) || 1;
+    }
+    // Enqueue a new render if we haven't reached the full size of the list
+    if (this.__shouldContinueChunking) {
+      this.__debounceRender(this.__render);
+    }
+  }
+  
+  __updateInstances(items, limit, isntIdxToItemsIdx) {
     // items->inst map kept for item path forwarding
     const itemsIdxToInstIdx = this.__itemsIdxToInstIdx = {};
-    let instIdx = 0;
+    let instIdx;
     // Generate instances and assign items
-    const limit = Math.min(isntIdxToItemsIdx.length, this.__limit);
-    for (; instIdx<limit; instIdx++) {
+    for (instIdx=0; instIdx<limit; instIdx++) {
       let inst = this.__instances[instIdx];
       let itemIdx = isntIdxToItemsIdx[instIdx];
       let item = items[itemIdx];
@@ -602,10 +679,7 @@ export class DomRepeat extends domRepeatBase {
   }
 
   __detachAndRemoveInstance(idx) {
-    let inst = this.__detachInstance(idx);
-    if (inst) {
-      this.__pool.push(inst);
-    }
+    this.__detachInstance(idx);
     this.__instances.splice(idx, 1);
   }
 
@@ -618,17 +692,7 @@ export class DomRepeat extends domRepeatBase {
   }
 
   __insertInstance(item, instIdx, itemIdx) {
-    let inst = this.__pool.pop();
-    if (inst) {
-      // TODO(kschaaf): If the pool is shared across turns, hostProps
-      // need to be re-set to reused instances in addition to item
-      inst._setPendingProperty(this.as, item);
-      inst._setPendingProperty(this.indexAs, instIdx);
-      inst._setPendingProperty(this.itemsIndexAs, itemIdx);
-      inst._flushProperties();
-    } else {
-      inst = this.__stampInstance(item, instIdx, itemIdx);
-    }
+    const inst = this.__stampInstance(item, instIdx, itemIdx);
     let beforeRow = this.__instances[instIdx + 1];
     let beforeNode = beforeRow ? beforeRow.children[0] : this;
     wrap(wrap(this).parentNode).insertBefore(inst.root, beforeNode);
diff --git a/lib/legacy/class.js b/lib/legacy/class.js
index b623fa1b87..aee2511be1 100644
--- a/lib/legacy/class.js
+++ b/lib/legacy/class.js
@@ -175,6 +175,8 @@ function mergeProperties(target, source) {
   }
 }
 
+const LegacyElement = LegacyElementMixin(HTMLElement);
+
 /* Note about construction and extension of legacy classes.
   [Changed in Q4 2018 to optimize performance.]
 
@@ -530,8 +532,8 @@ export const Class = function(info, mixin) {
   if (!info) {
     console.warn('Polymer.Class requires `info` argument');
   }
-  let klass = mixin ? mixin(LegacyElementMixin(HTMLElement)) :
-      LegacyElementMixin(HTMLElement);
+  let klass = mixin ? mixin(LegacyElement) :
+      LegacyElement;
   klass = GenerateClassFromInfo(info, klass, info.behaviors);
   // decorate klass with registration info
   klass.is = klass.prototype.is = info.is;
diff --git a/lib/legacy/legacy-element-mixin.js b/lib/legacy/legacy-element-mixin.js
index dba9b298b0..8e38e62940 100644
--- a/lib/legacy/legacy-element-mixin.js
+++ b/lib/legacy/legacy-element-mixin.js
@@ -8,7 +8,7 @@ Code distributed by Google as part of the polymer project is also
 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 */
 import '@webcomponents/shadycss/entrypoints/apply-shim.js';
-import { ElementMixin } from '../mixins/element-mixin.js';
+import { ElementMixin, builtCSS } from '../mixins/element-mixin.js';
 import { GestureEventListeners } from '../mixins/gesture-event-listeners.js';
 import { DirMixin } from '../mixins/dir-mixin.js';
 import { dedupingMixin } from '../utils/mixin.js';
@@ -21,6 +21,11 @@ import { timeOut, microTask } from '../utils/async.js';
 import { get } from '../utils/path.js';
 import { wrap } from '../utils/wrap.js';
 import { scopeSubtree } from '../utils/scope-subtree.js';
+import { legacyOptimizations, legacyNoObservedAttributes } from '../utils/settings.js';
+import { findObservedAttributesGetter } from '../mixins/disable-upgrade-mixin.js';
+import { register } from '../utils/telemetry.js';
+
+const DISABLED_ATTR = 'disable-upgrade';
 
 let styleInterface = window.ShadyCSS;
 
@@ -34,11 +39,15 @@ let styleInterface = window.ShadyCSS;
  * @polymer
  * @appliesMixin ElementMixin
  * @appliesMixin GestureEventListeners
+ * @appliesMixin DirMixin
  * @property isAttached {boolean} Set to `true` in this element's
  *   `connectedCallback` and `false` in `disconnectedCallback`
  * @summary Element class mixin that provides Polymer's "legacy" API
  */
 export const LegacyElementMixin = dedupingMixin((base) => {
+
+  // TODO(kschaaf): Note, the `@implements {Polymer_DirMixin}` is required here
+  // (rather than on legacyElementBase) for unknown reasons.
   /**
    * @constructor
    * @implements {Polymer_ElementMixin}
@@ -47,7 +56,20 @@ export const LegacyElementMixin = dedupingMixin((base) => {
    * @extends {HTMLElement}
    * @private
    */
-  const legacyElementBase = DirMixin(GestureEventListeners(ElementMixin(base)));
+  const GesturesElement = GestureEventListeners(ElementMixin(base));
+
+  // Note, the DirMixin does nothing if css is built so avoid including it
+  // in that case.
+
+  /**
+   * @constructor
+   * @extends {GesturesElement}
+   * @private
+   */
+  const legacyElementBase = builtCSS ? GesturesElement :
+    DirMixin(GesturesElement);
+
+  const observedAttributesGetter = findObservedAttributesGetter(legacyElementBase);
 
   /**
    * Map of simple names to touch action names
@@ -77,6 +99,13 @@ export const LegacyElementMixin = dedupingMixin((base) => {
       this.__boundListeners;
       /** @type {?Object<string, ?Function>} */
       this._debouncers;
+      // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+      /** @type {boolean|undefined} */
+      this.__isUpgradeDisabled;
+      /** @type {boolean|undefined} */
+      this.__needsAttributesAtConnected;
+      /** @type {boolean|undefined} */
+      this._legacyForceObservedAttributes;
     }
 
     /**
@@ -100,6 +129,79 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      */
     created() {}
 
+    /**
+     * Processes an attribute reaction when the `legacyNoObservedAttributes`
+     * setting is in use.
+     * @param {string} name Name of attribute that changed
+     * @param {?string} old Old attribute value
+     * @param {?string} value New attribute value
+     * @return {void}
+     */
+    __attributeReaction(name, old, value) {
+      if ((this.__dataAttributes && this.__dataAttributes[name]) || name === DISABLED_ATTR) {
+        this.attributeChangedCallback(name, old, value, null);
+      }
+    }
+
+    /** @override */
+    setAttribute(name, value) {
+      if (legacyNoObservedAttributes && !this._legacyForceObservedAttributes) {
+        const oldValue = this.getAttribute(name);
+        super.setAttribute(name, value);
+        // value coerced to String for closure's benefit
+        this.__attributeReaction(name, oldValue, String(value));
+      } else {
+        super.setAttribute(name, value);
+      }
+    }
+
+    /** @override */
+    removeAttribute(name) {
+      if (legacyNoObservedAttributes && !this._legacyForceObservedAttributes) {
+        const oldValue = this.getAttribute(name);
+        super.removeAttribute(name);
+        this.__attributeReaction(name, oldValue, null);
+      } else {
+        super.removeAttribute(name);
+      }
+    }
+
+    // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+    static get observedAttributes() {
+      if (legacyNoObservedAttributes && !this.prototype._legacyForceObservedAttributes) {
+        // Ensure this element is property registered with the telemetry system.
+        if (!this.hasOwnProperty(JSCompiler_renameProperty('__observedAttributes', this))) {
+          this.__observedAttributes = [];
+          register(this.prototype);
+        }
+        return this.__observedAttributes;
+      } else {
+        return observedAttributesGetter.call(this).concat(DISABLED_ATTR);
+      }
+    }
+
+    // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+    // Prevent element from enabling properties when it's upgrade disabled.
+    // Normally overriding connectedCallback would be enough, but dom-* elements
+    /** @override */
+    _enableProperties() {
+      if (!this.__isUpgradeDisabled) {
+        super._enableProperties();
+      }
+    }
+
+    // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+    // If the element starts upgrade-disabled and a property is set for
+    // which an accessor exists, the default should not be applied.
+    // This additional check is needed because defaults are applied via
+    // `_initializeProperties` which is called after initial properties
+    // have been set when the element starts upgrade-disabled.
+    /** @override */
+    _canApplyPropertyDefault(property) {
+      return super._canApplyPropertyDefault(property) &&
+        !(this.__isUpgradeDisabled && this._isPropertyPending(property));
+    }
+
     /**
      * Provides an implementation of `connectedCallback`
      * which adds Polymer legacy API's `attached` method.
@@ -107,9 +209,15 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     connectedCallback() {
-      super.connectedCallback();
-      this.isAttached = true;
-      this.attached();
+      if (this.__needsAttributesAtConnected) {
+        this._takeAttributes();
+      }
+      // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+      if (!this.__isUpgradeDisabled) {
+        super.connectedCallback();
+        this.isAttached = true;
+        this.attached();
+      }
     }
 
     /**
@@ -127,9 +235,12 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     disconnectedCallback() {
-      super.disconnectedCallback();
-      this.isAttached = false;
-      this.detached();
+      // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+      if (!this.__isUpgradeDisabled) {
+        super.disconnectedCallback();
+        this.isAttached = false;
+        this.detached();
+      }
     }
 
     /**
@@ -152,8 +263,21 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      */
     attributeChangedCallback(name, old, value, namespace) {
       if (old !== value) {
-        super.attributeChangedCallback(name, old, value, namespace);
-        this.attributeChanged(name, old, value);
+        // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+        if (name == DISABLED_ATTR) {
+          // When disable-upgrade is removed, intialize properties and
+          // provoke connectedCallback if the element is already connected.
+          if (this.__isUpgradeDisabled && value == null) {
+            this._initializeProperties();
+            this.__isUpgradeDisabled = false;
+            if (wrap(this).isConnected) {
+              this.connectedCallback();
+            }
+          }
+        } else {
+          super.attributeChangedCallback(name, old, value, namespace);
+          this.attributeChanged(name, old, value);
+        }
       }
     }
 
@@ -178,20 +302,43 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @suppress {invalidCasts}
      */
     _initializeProperties() {
-      let proto = Object.getPrototypeOf(this);
-      if (!proto.hasOwnProperty(JSCompiler_renameProperty('__hasRegisterFinished', proto))) {
-        this._registered();
-        // backstop in case the `_registered` implementation does not set this
-        proto.__hasRegisterFinished = true;
+      // NOTE: Inlined for perf from version of DisableUpgradeMixin.
+      // Only auto-use disable-upgrade if legacyOptimizations is set.
+      if (legacyOptimizations && this.hasAttribute(DISABLED_ATTR)) {
+        this.__isUpgradeDisabled = true;
+      } else {
+        let proto = Object.getPrototypeOf(this);
+        if (!proto.hasOwnProperty(JSCompiler_renameProperty('__hasRegisterFinished', proto))) {
+          this._registered();
+          // backstop in case the `_registered` implementation does not set this
+          proto.__hasRegisterFinished = true;
+        }
+        super._initializeProperties();
+        this.root = /** @type {HTMLElement} */(this);
+        this.created();
+        // Pull all attribute values 1x if `legacyNoObservedAttributes` is set.
+        if (legacyNoObservedAttributes && !this._legacyForceObservedAttributes) {
+          if (this.hasAttributes()) {
+            this._takeAttributes();
+          // Element created from scratch or parser generated
+          } else if (!this.parentNode) {
+            this.__needsAttributesAtConnected = true;
+          }
+        }
+        // Ensure listeners are applied immediately so that they are
+        // added before declarative event listeners. This allows an element to
+        // decorate itself via an event prior to any declarative listeners
+        // seeing the event. Note, this ensures compatibility with 1.x ordering.
+        this._applyListeners();
+      }
+    }
+
+    _takeAttributes() {
+      const a = this.attributes;
+      for (let i=0, l=a.length; i < l; i++) {
+        const attr = a[i];
+        this.__attributeReaction(attr.name, null, attr.value);
       }
-      super._initializeProperties();
-      this.root = /** @type {HTMLElement} */(this);
-      this.created();
-      // Ensure listeners are applied immediately so that they are
-      // added before declarative event listeners. This allows an element to
-      // decorate itself via an event prior to any declarative listeners
-      // seeing the event. Note, this ensures compatibility with 1.x ordering.
-      this._applyListeners();
     }
 
     /**
@@ -1051,7 +1198,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      *
      * @param {string} methodName Method name to associate with message
      * @param {...*} args Array of strings or objects to log
-     * @return {Array} Array with formatting information for `console`
+     * @return {!Array} Array with formatting information for `console`
      *   logging.
      * @override
      */
diff --git a/lib/legacy/polymer-fn.js b/lib/legacy/polymer-fn.js
index de019be6a9..f5da53cb8a 100644
--- a/lib/legacy/polymer-fn.js
+++ b/lib/legacy/polymer-fn.js
@@ -39,6 +39,10 @@ const Polymer = function(info) {
   } else {
     klass = Polymer.Class(info);
   }
+  // Copy opt out for `legacyNoObservedAttributes` from info object to class.
+  if (info._legacyForceObservedAttributes) {
+    klass.prototype._legacyForceObservedAttributes = info._legacyForceObservedAttributes;
+  }
   customElements.define(klass.is, /** @type {!HTMLElement} */(klass));
   return klass;
 };
diff --git a/lib/legacy/polymer.dom.js b/lib/legacy/polymer.dom.js
index 22b863e0e7..2c89c56a35 100644
--- a/lib/legacy/polymer.dom.js
+++ b/lib/legacy/polymer.dom.js
@@ -113,7 +113,7 @@ class DomApiNative {
   /**
    * Returns the root node of this node.  Equivalent to `getRootNode()`.
    *
-   * @return {Node} Top most element in the dom tree in which the node
+   * @return {!Node} Top most element in the dom tree in which the node
    * exists. If the node is connected to a document this is either a
    * shadowRoot or the document; otherwise, it may be the node
    * itself or a node or document fragment containing it.
diff --git a/lib/mixins/disable-upgrade-mixin.js b/lib/mixins/disable-upgrade-mixin.js
index 8b2022a6eb..f6d380fc2f 100644
--- a/lib/mixins/disable-upgrade-mixin.js
+++ b/lib/mixins/disable-upgrade-mixin.js
@@ -10,11 +10,22 @@
  * rights grant found at http://polymer.github.io/PATENTS.txt
  */
 import { ElementMixin } from './element-mixin.js';
-
 import { dedupingMixin } from '../utils/mixin.js';
+import { wrap } from '../utils/wrap.js';
 
 const DISABLED_ATTR = 'disable-upgrade';
 
+export const findObservedAttributesGetter = (ctor) => {
+  while (ctor) {
+    const desc = Object.getOwnPropertyDescriptor(ctor, 'observedAttributes');
+    if (desc) {
+      return desc.get;
+    }
+    ctor = Object.getPrototypeOf(ctor.prototype).constructor;
+  }
+  return () => [];
+};
+
 /**
  * Element class mixin that allows the element to boot up in a non-enabled
  * state when the `disable-upgrade` attribute is present. This mixin is
@@ -51,6 +62,13 @@ export const DisableUpgradeMixin = dedupingMixin((base) => {
    */
   const superClass = ElementMixin(base);
 
+  // Work around for closure bug #126934458. Using `super` in a property
+  // getter does not work so instead we search the Base prototype for an
+  // implementation of observedAttributes so that we can override and call
+  // the `super` getter. Note, this is done one time ever because we assume
+  // that `Base` is always comes from `Polymer.LegacyElementMixn`.
+  let observedAttributesGetter = findObservedAttributesGetter(superClass);
+
   /**
    * @polymer
    * @mixinClass
@@ -58,11 +76,44 @@ export const DisableUpgradeMixin = dedupingMixin((base) => {
    */
   class DisableUpgradeClass extends superClass {
 
-    /**
-     * @suppress {missingProperties} go/missingfnprops
-     */
+    constructor() {
+      super();
+      /** @type {boolean|undefined} */
+      this.__isUpgradeDisabled;
+    }
+
     static get observedAttributes() {
-      return super.observedAttributes.concat(DISABLED_ATTR);
+      return observedAttributesGetter.call(this).concat(DISABLED_ATTR);
+    }
+
+    // Prevent element from initializing properties when it's upgrade disabled.
+    /** @override */
+    _initializeProperties() {
+      if (this.hasAttribute(DISABLED_ATTR)) {
+        this.__isUpgradeDisabled = true;
+      } else {
+        super._initializeProperties();
+      }
+    }
+
+    // Prevent element from enabling properties when it's upgrade disabled.
+    // Normally overriding connectedCallback would be enough, but dom-* elements
+    /** @override */
+    _enableProperties() {
+      if (!this.__isUpgradeDisabled) {
+        super._enableProperties();
+      }
+    }
+
+    // If the element starts upgrade-disabled and a property is set for
+    // which an accessor exists, the default should not be applied.
+    // This additional check is needed because defaults are applied via
+    // `_initializeProperties` which is called after initial properties
+    // have been set when the element starts upgrade-disabled.
+    /** @override */
+    _canApplyPropertyDefault(property) {
+      return super._canApplyPropertyDefault(property) &&
+        !(this.__isUpgradeDisabled && this._isPropertyPending(property));
     }
 
     /**
@@ -75,8 +126,14 @@ export const DisableUpgradeMixin = dedupingMixin((base) => {
      */
     attributeChangedCallback(name, old, value, namespace) {
       if (name == DISABLED_ATTR) {
-        if (!this.__dataEnabled && value == null && this.isConnected) {
-          super.connectedCallback();
+        // When disable-upgrade is removed, intialize properties and
+        // provoke connectedCallback if the element is already connected.
+        if (this.__isUpgradeDisabled && value == null) {
+          super._initializeProperties();
+          this.__isUpgradeDisabled = false;
+          if (wrap(this).isConnected) {
+            super.connectedCallback();
+          }
         }
       } else {
         super.attributeChangedCallback(
@@ -84,37 +141,21 @@ export const DisableUpgradeMixin = dedupingMixin((base) => {
       }
     }
 
-    /*
-      NOTE: cannot gate on attribute because this is called before
-      attributes are delivered. Therefore, we stub this out and
-      call `super._initializeProperties()` manually.
-    */
-    /** @override */
-    _initializeProperties() {}
-
-    // prevent user code in connected from running
+    // Prevent element from connecting when it's upgrade disabled.
+    // This prevents user code in `attached` from being called.
     /** @override */
     connectedCallback() {
-      if (this.__dataEnabled || !this.hasAttribute(DISABLED_ATTR)) {
+      if (!this.__isUpgradeDisabled) {
         super.connectedCallback();
       }
     }
 
-    // prevent element from turning on properties
-    /** @override */
-    _enableProperties() {
-      if (!this.hasAttribute(DISABLED_ATTR)) {
-        if (!this.__dataEnabled) {
-          super._initializeProperties();
-        }
-        super._enableProperties();
-      }
-    }
-
-    // only go if "enabled"
+    // Prevent element from disconnecting when it's upgrade disabled.
+    // This avoids allowing user code `detached` from being called without a
+    // paired call to `attached`.
     /** @override */
     disconnectedCallback() {
-      if (this.__dataEnabled) {
+      if (!this.__isUpgradeDisabled) {
         super.disconnectedCallback();
       }
     }
diff --git a/lib/mixins/element-mixin.js b/lib/mixins/element-mixin.js
index 6f8cd26e60..9dbc0fd965 100644
--- a/lib/mixins/element-mixin.js
+++ b/lib/mixins/element-mixin.js
@@ -11,7 +11,7 @@
  */
 import '../utils/boot.js';
 
-import { rootPath, strictTemplatePolicy, allowTemplateFromDomModule, legacyOptimizations, syncInitialRender } from '../utils/settings.js';
+import { rootPath, strictTemplatePolicy, allowTemplateFromDomModule, legacyOptimizations, legacyWarnings, syncInitialRender, supportsAdoptingStyleSheets, useAdoptedStyleSheetsWithBuiltCSS } from '../utils/settings.js';
 import { dedupingMixin } from '../utils/mixin.js';
 import { stylesFromTemplate, stylesFromModuleImports } from '../utils/style-gather.js';
 import { pathFromUrl, resolveCss, resolveUrl } from '../utils/resolve-url.js';
@@ -26,7 +26,7 @@ import { wrap } from '../utils/wrap.js';
  */
 export const version = '3.3.1';
 
-const builtCSS = window.ShadyCSS && window.ShadyCSS['cssBuild'];
+export const builtCSS = window.ShadyCSS && window.ShadyCSS['cssBuild'];
 
 /**
  * Element class mixin that provides the core API for Polymer's meta-programming
@@ -294,6 +294,30 @@ export const ElementMixin = dedupingMixin(base => {
     if (window.ShadyCSS) {
       window.ShadyCSS.prepareTemplate(template, is);
     }
+    // Support for `adoptedStylesheets` relies on using native Shadow DOM
+    // and built CSS. Built CSS is required because runtime transformation of
+    // `@apply` is not supported. This is because ShadyCSS relies on being able
+    // to update a `style` element in the element template and this is
+    // removed when using `adoptedStyleSheets`.
+    // Note, it would be more efficient to allow style includes to become
+    // separate stylesheets; however, because of `@apply` these are
+    // potentially not shareable and sharing the ones that could be shared
+    // would require some coordination. To keep it simple, all the includes
+    // and styles are collapsed into a single shareable stylesheet.
+    if (useAdoptedStyleSheetsWithBuiltCSS && builtCSS &&
+        supportsAdoptingStyleSheets) {
+      // Remove styles in template and make a shareable stylesheet
+      const styles = template.content.querySelectorAll('style');
+      if (styles) {
+        let css = '';
+        Array.from(styles).forEach(s => {
+          css += s.textContent;
+          s.parentNode.removeChild(s);
+        });
+        klass._styleSheet = new CSSStyleSheet();
+        klass._styleSheet.replaceSync(css);
+      }
+    }
   }
 
   /**
@@ -411,9 +435,13 @@ export const ElementMixin = dedupingMixin(base => {
     /**
      * Returns the template that will be stamped into this element's shadow root.
      *
-     * If a `static get is()` getter is defined, the default implementation
-     * will return the first `<template>` in a `dom-module` whose `id`
-     * matches this element's `is`.
+     * If a `static get is()` getter is defined, the default implementation will
+     * return the first `<template>` in a `dom-module` whose `id` matches this
+     * element's `is` (note that a `_template` property on the class prototype
+     * takes precedence over the `dom-module` template, to maintain legacy
+     * element semantics; a subclass will subsequently fall back to its super
+     * class template if neither a `prototype._template` or a `dom-module` for
+     * the class's `is` was found).
      *
      * Users may override this getter to return an arbitrary template
      * (in which case the `is` getter is unnecessary). The template returned
@@ -460,13 +488,20 @@ export const ElementMixin = dedupingMixin(base => {
       //     or set in registered(); once the static getter runs, a clone of it
       //     will overwrite it on the prototype as the working template.
       if (!this.hasOwnProperty(JSCompiler_renameProperty('_template', this))) {
+        const protoTemplate = this.prototype.hasOwnProperty(
+          JSCompiler_renameProperty('_template', this.prototype)) ?
+          this.prototype._template : undefined;
         this._template =
           // If user has put template on prototype (e.g. in legacy via registered
-          // callback or info object), prefer that first
-          this.prototype.hasOwnProperty(JSCompiler_renameProperty('_template', this.prototype)) ?
-          this.prototype._template :
+          // callback or info object), prefer that first. Note that `null` is
+          // used as a sentinel to indicate "no template" and can be used to
+          // override a super template, whereas `undefined` is used as a
+          // sentinel to mean "fall-back to default template lookup" via
+          // dom-module and/or super.template.
+          protoTemplate !== undefined ? protoTemplate :
           // Look in dom-module associated with this element's is
-          (getTemplateFromDomModule(/** @type {PolymerElementConstructor}*/ (this).is) ||
+          ((this.hasOwnProperty(JSCompiler_renameProperty('is', this)) &&
+          (getTemplateFromDomModule(/** @type {PolymerElementConstructor}*/ (this).is))) ||
           // Next look for superclass template (call the super impl this
           // way so that `this` points to the superclass)
           Object.getPrototypeOf(/** @type {PolymerElementConstructor}*/ (this).prototype).constructor.template);
@@ -562,10 +597,7 @@ export const ElementMixin = dedupingMixin(base => {
       }
       for (let p in p$) {
         let info = p$[p];
-        // Don't set default value if there is already an own property, which
-        // happens when a `properties` property with default but no effects had
-        // a property set (e.g. bound) by its host before upgrade
-        if (!this.hasOwnProperty(p)) {
+        if (this._canApplyPropertyDefault(p)) {
           let value = typeof info.value == 'function' ?
             info.value.call(this) :
             info.value;
@@ -580,6 +612,18 @@ export const ElementMixin = dedupingMixin(base => {
       }
     }
 
+    /**
+     * Determines if a property dfeault can be applied. For example, this
+     * prevents a default from being applied when a property that has no
+     * accessor is overridden by its host before upgrade (e.g. via a binding).
+     * @override
+     * @param {string} property Name of the property
+     * @return {boolean} Returns true if the property default can be applied.
+     */
+    _canApplyPropertyDefault(property) {
+      return !this.hasOwnProperty(property);
+    }
+
     /**
      * Gather style text for a style element in the template.
      *
@@ -691,6 +735,11 @@ export const ElementMixin = dedupingMixin(base => {
           if (!n.shadowRoot) {
             n.attachShadow({mode: 'open', shadyUpgradeFragment: dom});
             n.shadowRoot.appendChild(dom);
+            // When `adoptedStyleSheets` is supported a stylesheet is made
+            // available on the element constructor.
+            if (this.constructor._styleSheet) {
+              n.shadowRoot.adoptedStyleSheets = [this.constructor._styleSheet];
+            }
           }
           if (syncInitialRender && window.ShadyDOM) {
             window.ShadyDOM.flushInitial(n.shadowRoot);
@@ -799,7 +848,15 @@ export const ElementMixin = dedupingMixin(base => {
       // The warning is only enabled in `legacyOptimizations` mode, since
       // we don't want to spam existing users who might have adopted the
       // shorthand when attribute deserialization is not important.
-      if (legacyOptimizations && !(prop in this._properties)) {
+      if (legacyWarnings && !(prop in this._properties) &&
+          // Methods used in templates with no dependencies (or only literal
+          // dependencies) become accessors with template effects; ignore these
+          !(effect.info.part.signature && effect.info.part.signature.static) &&
+          // Warnings for bindings added to nested templates are handled by
+          // templatizer so ignore both the host-to-template bindings
+          // (`hostProp`) and TemplateInstance-to-child bindings
+          // (`nestedTemplate`)
+          !effect.info.part.hostProp && !templateInfo.nestedTemplate) {
         console.warn(`Property '${prop}' used in template but not declared in 'properties'; ` +
           `attribute will not be observed.`);
       }
diff --git a/lib/mixins/properties-changed.js b/lib/mixins/properties-changed.js
index 4d8e8e7cfc..9e481d6734 100644
--- a/lib/mixins/properties-changed.js
+++ b/lib/mixins/properties-changed.js
@@ -134,10 +134,18 @@ export const PropertiesChanged = dedupingMixin(
       if (!this.hasOwnProperty(JSCompiler_renameProperty('__dataAttributes', this))) {
         this.__dataAttributes = Object.assign({}, this.__dataAttributes);
       }
-      if (!this.__dataAttributes[property]) {
-        const attr = this.constructor.attributeNameForProperty(property);
+      // This check is technically not correct; it's an optimization that
+      // assumes that if a _property_ name is already in the map (note this is
+      // an attr->property map), the property mapped directly to the attribute
+      // and it has already been mapped.  This would fail if
+      // `attributeNameForProperty` were overridden such that this was not the
+      // case.
+      let attr = this.__dataAttributes[property];
+      if (!attr) {
+        attr = this.constructor.attributeNameForProperty(property);
         this.__dataAttributes[attr] = property;
       }
+      return attr;
     }
 
     /**
@@ -152,11 +160,15 @@ export const PropertiesChanged = dedupingMixin(
         /* eslint-disable valid-jsdoc */
         /** @this {PropertiesChanged} */
         get() {
-          return this._getProperty(property);
+          // Inline for perf instead of using `_getProperty`
+          return this.__data[property];
         },
         /** @this {PropertiesChanged} */
         set: readOnly ? function () {} : function (value) {
-          this._setProperty(property, value);
+          // Inline for perf instead of using `_setProperty`
+          if (this._setPendingProperty(property, value, true)) {
+            this._invalidateProperties();
+          }
         }
         /* eslint-enable */
       });
@@ -172,6 +184,9 @@ export const PropertiesChanged = dedupingMixin(
       this.__dataPending = null;
       this.__dataOld = null;
       this.__dataInstanceProps = null;
+      /** @type {number} */
+      // NOTE: used to track re-entrant calls to `_flushProperties`
+      this.__dataCounter = 0;
       this.__serializing = false;
       this._initializeProperties();
     }
@@ -297,6 +312,14 @@ export const PropertiesChanged = dedupingMixin(
     }
     /* eslint-enable */
 
+    /**
+     * @param {string} property Name of the property
+     * @return {boolean} Returns true if the property is pending.
+     */
+    _isPropertyPending(property) {
+      return !!(this.__dataPending && this.__dataPending.hasOwnProperty(property));
+    }
+
     /**
      * Marks the properties as invalid, and enqueues an async
      * `_propertiesChanged` callback.
@@ -351,6 +374,7 @@ export const PropertiesChanged = dedupingMixin(
      * @override
      */
     _flushProperties() {
+      this.__dataCounter++;
       const props = this.__data;
       const changedProps = this.__dataPending;
       const old = this.__dataOld;
@@ -359,6 +383,7 @@ export const PropertiesChanged = dedupingMixin(
         this.__dataOld = null;
         this._propertiesChanged(props, changedProps, old);
       }
+      this.__dataCounter--;
     }
 
     /**
diff --git a/lib/mixins/properties-mixin.js b/lib/mixins/properties-mixin.js
index 41757e3df3..fe686b3580 100644
--- a/lib/mixins/properties-mixin.js
+++ b/lib/mixins/properties-mixin.js
@@ -17,8 +17,8 @@ import { PropertiesChanged } from './properties-changed.js';
  * Creates a copy of `props` with each property normalized such that
  * upgraded it is an object with at least a type property { type: Type}.
  *
- * @param {Object} props Properties to normalize
- * @return {Object} Copy of input `props` with normalized properties that
+ * @param {!Object} props Properties to normalize
+ * @return {!Object} Copy of input `props` with normalized properties that
  * are in the form {type: Type}
  * @private
  */
@@ -122,7 +122,7 @@ export const PropertiesMixin = dedupingMixin(superClass => {
      if (!this.hasOwnProperty(JSCompiler_renameProperty('__observedAttributes', this))) {
        register(this.prototype);
        const props = this._properties;
-       this.__observedAttributes = props ? Object.keys(props).map(p => this.attributeNameForProperty(p)) : [];
+       this.__observedAttributes = props ? Object.keys(props).map(p => this.prototype._addPropertyToAttributeMap(p)) : [];
      }
      return this.__observedAttributes;
    }
diff --git a/lib/mixins/property-effects.js b/lib/mixins/property-effects.js
index 7fd90836d8..62c8e6fa08 100644
--- a/lib/mixins/property-effects.js
+++ b/lib/mixins/property-effects.js
@@ -19,12 +19,14 @@ import { camelToDashCase, dashToCamelCase } from '../utils/case-map.js';
 import { PropertyAccessors } from './property-accessors.js';
 /* for annotated effects */
 import { TemplateStamp } from './template-stamp.js';
-import { sanitizeDOMValue } from '../utils/settings.js';
+import { sanitizeDOMValue, legacyUndefined, orderedComputed, removeNestedTemplates, fastDomIf } from '../utils/settings.js';
 
 // Monotonically increasing unique ID used for de-duping effects triggered
 // from multiple properties in the same turn
 let dedupeId = 0;
 
+const NOOP = [];
+
 /**
  * Property effect types; effects are stored on the prototype using these keys
  * @enum {string}
@@ -38,6 +40,8 @@ const TYPES = {
   READ_ONLY: '__readOnly'
 };
 
+const COMPUTE_INFO = '__computeInfo';
+
 /** @const {!RegExp} */
 const capitalAttributeRegex = /[A-Z]/;
 
@@ -78,20 +82,25 @@ let DataEffect; //eslint-disable-line no-unused-vars
  *
  * @param {Object} model Prototype or instance
  * @param {string} type Property effect type
+ * @param {boolean=} cloneArrays Clone any arrays assigned to the map when
+ *   extending a superclass map onto this subclass
  * @return {Object} The own-property map of effects for the given type
  * @private
  */
-function ensureOwnEffectMap(model, type) {
+function ensureOwnEffectMap(model, type, cloneArrays) {
   let effects = model[type];
   if (!effects) {
     effects = model[type] = {};
   } else if (!model.hasOwnProperty(type)) {
     effects = model[type] = Object.create(model[type]);
-    for (let p in effects) {
-      let protoFx = effects[p];
-      let instFx = effects[p] = Array(protoFx.length);
-      for (let i=0; i<protoFx.length; i++) {
-        instFx[i] = protoFx[i];
+    if (cloneArrays) {
+      for (let p in effects) {
+        let protoFx = effects[p];
+        // Perf optimization over Array.slice
+        let instFx = effects[p] = Array(protoFx.length);
+        for (let i=0; i<protoFx.length; i++) {
+          instFx[i] = protoFx[i];
+        }
       }
     }
   }
@@ -116,12 +125,22 @@ function ensureOwnEffectMap(model, type) {
 function runEffects(inst, effects, props, oldProps, hasPaths, extraArgs) {
   if (effects) {
     let ran = false;
-    let id = dedupeId++;
+    const id = dedupeId++;
     for (let prop in props) {
-      if (runEffectsForProperty(
-              inst, /** @type {!Object} */ (effects), id, prop, props, oldProps,
-              hasPaths, extraArgs)) {
-        ran = true;
+      // Inline `runEffectsForProperty` for perf.
+      let rootProperty = hasPaths ? root(prop) : prop;
+      let fxs = effects[rootProperty];
+      if (fxs) {
+        for (let i=0, l=fxs.length, fx; (i<l) && (fx=fxs[i]); i++) {
+          if ((!fx.info || fx.info.lastRun !== id) &&
+              (!hasPaths || pathMatchesTrigger(prop, fx.trigger))) {
+            if (fx.info) {
+              fx.info.lastRun = id;
+            }
+            fx.fn(inst, prop, props, oldProps, fx.info, hasPaths, extraArgs);
+            ran = true;
+          }
+        }
       }
     }
     return ran;
@@ -301,6 +320,11 @@ function dispatchNotifyEvent(inst, eventName, value, path) {
   if (path) {
     detail.path = path;
   }
+  // As a performance optimization, we could elide the wrap here since notifying
+  // events are non-bubbling and shouldn't need retargeting. However, a very
+  // small number of internal tests failed in obscure ways, which may indicate
+  // user code relied on timing differences resulting from ShadyDOM flushing
+  // as a result of the wrapped `dispatchEvent`.
   wrap(/** @type {!HTMLElement} */(inst)).dispatchEvent(new CustomEvent(eventName, { detail }));
 }
 
@@ -407,14 +431,189 @@ function runReflectEffect(inst, property, props, oldProps, info) {
 function runComputedEffects(inst, changedProps, oldProps, hasPaths) {
   let computeEffects = inst[TYPES.COMPUTE];
   if (computeEffects) {
-    let inputProps = changedProps;
-    while (runEffects(inst, computeEffects, inputProps, oldProps, hasPaths)) {
+    if (orderedComputed) {
+      // Runs computed effects in efficient order by keeping a topologically-
+      // sorted queue of compute effects to run, and inserting subsequently
+      // invalidated effects as they are run
+      dedupeId++;
+      const order = getComputedOrder(inst);
+      const queue = [];
+      for (let p in changedProps) {
+        enqueueEffectsFor(p, computeEffects, queue, order, hasPaths);
+      }
+      let info;
+      while ((info = queue.shift())) {
+        if (runComputedEffect(inst, '', changedProps, oldProps, info)) {
+          enqueueEffectsFor(info.methodInfo, computeEffects, queue, order, hasPaths);
+        }
+      }
       Object.assign(/** @type {!Object} */ (oldProps), inst.__dataOld);
       Object.assign(/** @type {!Object} */ (changedProps), inst.__dataPending);
-      inputProps = inst.__dataPending;
       inst.__dataPending = null;
+    } else {
+      // Original Polymer 2.x computed effects order, which continues running
+      // effects until no further computed properties have been invalidated
+      let inputProps = changedProps;
+      while (runEffects(inst, computeEffects, inputProps, oldProps, hasPaths)) {
+        Object.assign(/** @type {!Object} */ (oldProps), inst.__dataOld);
+        Object.assign(/** @type {!Object} */ (changedProps), inst.__dataPending);
+        inputProps = inst.__dataPending;
+        inst.__dataPending = null;
+      }
+    }
+  }
+}
+
+/**
+ * Inserts a computed effect into a queue, given the specified order. Performs
+ * the insert using a binary search.
+ *
+ * Used by `orderedComputed: true` computed property algorithm.
+ *
+ * @param {Object} info Property effects metadata
+ * @param {Array<Object>} queue Ordered queue of effects
+ * @param {Map<string,number>} order Map of computed property name->topological
+ *   sort order
+ */
+const insertEffect = (info, queue, order) => {
+  let start = 0;
+  let end = queue.length - 1;
+  let idx = -1;
+  while (start <= end) {
+    const mid = (start + end) >> 1;
+    // Note `methodInfo` is where the computed property name is stored in
+    // the effect metadata
+    const cmp = order.get(queue[mid].methodInfo) - order.get(info.methodInfo);
+    if (cmp < 0) {
+      start = mid + 1;
+    } else if (cmp > 0) {
+      end = mid - 1;
+    } else {
+      idx = mid;
+      break;
+    }
+  }
+  if (idx < 0) {
+    idx = end + 1;
+  }
+  queue.splice(idx, 0, info);
+};
+
+/**
+ * Inserts all downstream computed effects invalidated by the specified property
+ * into the topologically-sorted queue of effects to be run.
+ *
+ * Used by `orderedComputed: true` computed property algorithm.
+ *
+ * @param {string} prop Property name
+ * @param {Object} computeEffects Computed effects for this element
+ * @param {Array<Object>} queue Topologically-sorted queue of computed effects
+ *   to be run
+ * @param {Map<string,number>} order Map of computed property name->topological
+ *   sort order
+ * @param {boolean} hasPaths True with `changedProps` contains one or more paths
+ */
+const enqueueEffectsFor = (prop, computeEffects, queue, order, hasPaths) => {
+  const rootProperty = hasPaths ? root(prop) : prop;
+  const fxs = computeEffects[rootProperty];
+  if (fxs) {
+    for (let i=0; i<fxs.length; i++) {
+      const fx = fxs[i];
+      if ((fx.info.lastRun !== dedupeId) &&
+          (!hasPaths || pathMatchesTrigger(prop, fx.trigger))) {
+        fx.info.lastRun = dedupeId;
+        insertEffect(fx.info, queue, order);
+      }
+    }
+  }
+};
+
+/**
+ * Generates and retrieves a memoized map of computed property name to its
+ * topologically-sorted order.
+ *
+ * The map is generated by first assigning a "dependency count" to each property
+ * (defined as number properties it depends on, including its method for
+ * "dynamic functions"). Any properties that have no dependencies are added to
+ * the `ready` queue, which are properties whose order can be added to the final
+ * order map. Properties are popped off the `ready` queue one by one and a.) added as
+ * the next property in the order map, and b.) each property that it is a
+ * dependency for has its dep count decremented (and if that property's dep
+ * count goes to zero, it is added to the `ready` queue), until all properties
+ * have been visited and ordered.
+ *
+ * Used by `orderedComputed: true` computed property algorithm.
+ *
+ * @param {!Polymer_PropertyEffects} inst The instance to retrieve the computed
+ *   effect order for.
+ * @return {Map<string,number>} Map of computed property name->topological sort
+ *   order
+ */
+function getComputedOrder(inst) {
+  let ordered = inst.constructor.__orderedComputedDeps;
+  if (!ordered) {
+    ordered = new Map();
+    const effects = inst[TYPES.COMPUTE];
+    let {counts, ready, total} = dependencyCounts(inst);
+    let curr;
+    while ((curr = ready.shift())) {
+      ordered.set(curr, ordered.size);
+      const computedByCurr = effects[curr];
+      if (computedByCurr) {
+        computedByCurr.forEach(fx => {
+          // Note `methodInfo` is where the computed property name is stored
+          const computedProp = fx.info.methodInfo;
+          --total;
+          if (--counts[computedProp] === 0) {
+            ready.push(computedProp);
+          }
+        });
+      }
+    }
+    if (total !== 0) {
+      const el = /** @type {HTMLElement} */ (inst);
+      console.warn(`Computed graph for ${el.localName} incomplete; circular?`);
     }
+    inst.constructor.__orderedComputedDeps = ordered;
   }
+  return ordered;
+}
+
+/**
+ * Generates a map of property-to-dependency count (`counts`, where "dependency
+ * count" is the number of dependencies a given property has assuming it is a
+ * computed property, otherwise 0).  It also returns a pre-populated list of
+ * `ready` properties that have no dependencies and a `total` count, which is
+ * used for error-checking the graph.
+ *
+ * Used by `orderedComputed: true` computed property algorithm.
+ *
+ * @param {!Polymer_PropertyEffects} inst The instance to generate dependency
+ *   counts for.
+ * @return {!Object} Object containing `counts` map (property-to-dependency
+ *   count) and pre-populated `ready` array of properties that had zero
+ *   dependencies.
+ */
+function dependencyCounts(inst) {
+  const infoForComputed = inst[COMPUTE_INFO];
+  const counts = {};
+  const computedDeps = inst[TYPES.COMPUTE];
+  const ready = [];
+  let total = 0;
+  // Count dependencies for each computed property
+  for (let p in infoForComputed) {
+    const info = infoForComputed[p];
+    // Be sure to add the method name itself in case of "dynamic functions"
+    total += counts[p] =
+      info.args.filter(a => !a.literal).length + (info.dynamicFn ? 1 : 0);
+  }
+  // Build list of ready properties (that aren't themselves computed)
+  for (let p in computedDeps) {
+    if (!infoForComputed[p]) {
+      ready.push(p);
+    }
+  }
+  return {counts, ready, total};
 }
 
 /**
@@ -424,19 +623,25 @@ function runComputedEffects(inst, changedProps, oldProps, hasPaths) {
  *
  * @param {!Polymer_PropertyEffects} inst The instance the effect will be run on
  * @param {string} property Name of property
- * @param {?Object} props Bag of current property changes
+ * @param {?Object} changedProps Bag of current property changes
  * @param {?Object} oldProps Bag of previous values for changed properties
  * @param {?} info Effect metadata
- * @return {void}
+ * @return {boolean} True when the property being computed changed
  * @private
  */
-function runComputedEffect(inst, property, props, oldProps, info) {
-  let result = runMethodEffect(inst, property, props, oldProps, info);
+function runComputedEffect(inst, property, changedProps, oldProps, info) {
+  // Dirty check dependencies and run if any invalid
+  let result = runMethodEffect(inst, property, changedProps, oldProps, info);
+  // Abort if method returns a no-op result
+  if (result === NOOP) {
+    return false;
+  }
   let computedProp = info.methodInfo;
   if (inst.__dataHasAccessor && inst.__dataHasAccessor[computedProp]) {
-    inst._setPendingProperty(computedProp, result, true);
+    return inst._setPendingProperty(computedProp, result, true);
   } else {
     inst[computedProp] = result;
+    return false;
   }
 }
 
@@ -579,7 +784,10 @@ function runBindingEffect(inst, path, props, oldProps, info, hasPaths, nodeList)
   } else {
     let value = info.evaluator._evaluateBinding(inst, part, path, props, oldProps, hasPaths);
     // Propagate value to child
-    applyBindingValue(inst, node, binding, part, value);
+    // Abort if value is a no-op result
+    if (value !== NOOP) {
+      applyBindingValue(inst, node, binding, part, value);
+    }
   }
 }
 
@@ -613,7 +821,9 @@ function applyBindingValue(inst, node, binding, part, value) {
           inst._enqueueClient(node);
         }
       }
-    } else  {
+    } else {
+      // In legacy no-batching mode, bindings applied before dataReady are
+      // equivalent to the "apply config" phase, which only set managed props
       inst._setUnmanagedPropertyToNode(node, prop, value);
     }
   }
@@ -693,6 +903,8 @@ function setupBindings(inst, templateInfo) {
           addNotifyListener(node, inst, binding);
         }
       }
+      // This ensures all bound elements have a host set, regardless
+      // of whether they upgrade synchronous to creation
       node.__dataHost = inst;
     }
   }
@@ -773,7 +985,7 @@ function addNotifyListener(node, inst, binding) {
  * @param {boolean|Object=} dynamicFn Boolean or object map indicating whether
  *   method names should be included as a dependency to the effect. Note,
  *   defaults to true if the signature is static (sig.static is true).
- * @return {void}
+ * @return {!Object} Effect metadata for this method effect
  * @private
  */
 function createMethodEffect(model, sig, type, effectFn, methodInfo, dynamicFn) {
@@ -797,6 +1009,7 @@ function createMethodEffect(model, sig, type, effectFn, methodInfo, dynamicFn) {
       fn: effectFn, info: info
     });
   }
+  return info;
 }
 
 /**
@@ -822,7 +1035,7 @@ function runMethodEffect(inst, property, props, oldProps, info) {
   let fn = context[info.methodName];
   if (fn) {
     let args = inst._marshalArgs(info.args, property, props);
-    return fn.apply(context, args);
+    return args === NOOP ? NOOP : fn.apply(context, args);
   } else if (!info.dynamicFn) {
     console.warn('method `' + info.methodName + '` not defined');
   }
@@ -1005,8 +1218,18 @@ function getArgValue(data, props, path) {
  * @private
  */
 function notifySplices(inst, array, path, splices) {
-  inst.notifyPath(path + '.splices', { indexSplices: splices });
+  const splicesData = { indexSplices: splices };
+  // Legacy behavior stored splices in `__data__` so it was *not* ephemeral.
+  // To match this behavior, we store splices directly on the array.
+  if (legacyUndefined && !inst._overrideLegacyUndefined) {
+    array.splices = splicesData;
+  }
+  inst.notifyPath(path + '.splices', splicesData);
   inst.notifyPath(path + '.length', array.length);
+  // Clear splice data only when it's stored on the array.
+  if (legacyUndefined && !inst._overrideLegacyUndefined) {
+    splicesData.indexSplices = [];
+  }
 }
 
 /**
@@ -1079,9 +1302,6 @@ function upper(name) {
  * @appliesMixin PropertyAccessors
  * @summary Element class mixin that provides meta-programming for Polymer's
  * template binding and data observation system.
- * @template T
- * @param {function(new:T)} superClass Class to apply mixin to.
- * @return {function(new:T)} superClass with mixin applied.
  */
 export const PropertyEffects = dedupingMixin(superClass => {
 
@@ -1108,11 +1328,6 @@ export const PropertyEffects = dedupingMixin(superClass => {
       /** @type {boolean} */
       // Used to identify users of this mixin, ala instanceof
       this.__isPropertyEffectsClient = true;
-      /** @type {number} */
-      // NOTE: used to track re-entrant calls to `_flushProperties`
-      // path changes dirty check against `__dataTemp` only during one "turn"
-      // and are cleared when `__dataCounter` returns to 0.
-      this.__dataCounter = 0;
       /** @type {boolean} */
       this.__dataClientsReady;
       /** @type {Array} */
@@ -1140,6 +1355,8 @@ export const PropertyEffects = dedupingMixin(superClass => {
       /** @type {Object} */
       this.__computeEffects;
       /** @type {Object} */
+      this.__computeInfo;
+      /** @type {Object} */
       this.__reflectEffects;
       /** @type {Object} */
       this.__notifyEffects;
@@ -1151,11 +1368,10 @@ export const PropertyEffects = dedupingMixin(superClass => {
       this.__readOnly;
       /** @type {!TemplateInfo} */
       this.__templateInfo;
+      /** @type {boolean} */
+      this._overrideLegacyUndefined;
     }
 
-    /**
-     * @return {!Object<string, string>} Effect prototype property name map.
-     */
     get PROPERTY_EFFECT_TYPES() {
       return TYPES;
     }
@@ -1166,7 +1382,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
      */
     _initializeProperties() {
       super._initializeProperties();
-      hostStack.registerHost(this);
+      this._registerHost();
       this.__dataClientsReady = false;
       this.__dataPendingClients = null;
       this.__dataToNotify = null;
@@ -1179,6 +1395,16 @@ export const PropertyEffects = dedupingMixin(superClass => {
       this.__dataClientsInitialized = false;
     }
 
+    _registerHost() {
+      if (hostStack.length) {
+        let host = hostStack[hostStack.length-1];
+        host._enqueueClient(this);
+        // This ensures even non-bound elements have a host set, as
+        // long as they upgrade synchronously
+        this.__dataHost = host;
+      }
+    }
+
     /**
      * Overrides `PropertyAccessors` implementation to provide a
      * more efficient implementation of initializing properties from
@@ -1230,7 +1456,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
     _addPropertyEffect(property, type, effect) {
       this._createPropertyAccessor(property, type == TYPES.READ_ONLY);
       // effects are accumulated into arrays per property based on type
-      let effects = ensureOwnEffectMap(this, type)[property];
+      let effects = ensureOwnEffectMap(this, type, true)[property];
       if (!effects) {
         effects = this[type][property] = [];
       }
@@ -1247,7 +1473,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
      * @return {void}
      */
     _removePropertyEffect(property, type, effect) {
-      let effects = ensureOwnEffectMap(this, type)[property];
+      let effects = ensureOwnEffectMap(this, type, true)[property];
       let idx = effects.indexOf(effect);
       if (idx >= 0) {
         effects.splice(idx, 1);
@@ -1540,19 +1766,6 @@ export const PropertyEffects = dedupingMixin(superClass => {
       }
     }
 
-    /**
-     * Overrides superclass implementation.
-     *
-     * @override
-     * @return {void}
-     * @protected
-     */
-    _flushProperties() {
-      this.__dataCounter++;
-      super._flushProperties();
-      this.__dataCounter--;
-    }
-
     /**
      * Flushes any clients previously enqueued via `_enqueueClient`, causing
      * their `_flushProperties` method to run.
@@ -1692,11 +1905,12 @@ export const PropertyEffects = dedupingMixin(superClass => {
       // ----------------------------
       let hasPaths = this.__dataHasPaths;
       this.__dataHasPaths = false;
+      let notifyProps;
       // Compute properties
       runComputedEffects(this, changedProps, oldProps, hasPaths);
       // Clear notify properties prior to possible reentry (propagate, observe),
       // but after computing effects have a chance to add to them
-      let notifyProps = this.__dataToNotify;
+      notifyProps = this.__dataToNotify;
       this.__dataToNotify = null;
       // Propagate properties to clients
       this._propagatePropertyChanges(changedProps, oldProps, hasPaths);
@@ -1734,11 +1948,23 @@ export const PropertyEffects = dedupingMixin(superClass => {
       if (this[TYPES.PROPAGATE]) {
         runEffects(this, this[TYPES.PROPAGATE], changedProps, oldProps, hasPaths);
       }
-      let templateInfo = this.__templateInfo;
-      while (templateInfo) {
+      if (this.__templateInfo) {
+        this._runEffectsForTemplate(this.__templateInfo, changedProps, oldProps, hasPaths);
+      }
+    }
+
+    _runEffectsForTemplate(templateInfo, changedProps, oldProps, hasPaths) {
+      const baseRunEffects = (changedProps, hasPaths) => {
         runEffects(this, templateInfo.propertyEffects, changedProps, oldProps,
           hasPaths, templateInfo.nodeList);
-        templateInfo = templateInfo.nextTemplateInfo;
+        for (let info=templateInfo.firstChild; info; info=info.nextSibling) {
+          this._runEffectsForTemplate(info, changedProps, oldProps, hasPaths);
+        }
+      };
+      if (templateInfo.runEffects) {
+        templateInfo.runEffects(baseRunEffects, changedProps, hasPaths);
+      } else {
+        baseRunEffects(changedProps, hasPaths);
       }
     }
 
@@ -1941,7 +2167,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
      * @param {number} start Index from which to start removing/inserting.
      * @param {number=} deleteCount Number of items to remove.
      * @param {...*} items Items to insert into array.
-     * @return {Array} Array of removed items.
+     * @return {!Array} Array of removed items.
      * @public
      */
     splice(path, start, deleteCount, ...items) {
@@ -2197,7 +2423,10 @@ export const PropertyEffects = dedupingMixin(superClass => {
       if (!sig) {
         throw new Error("Malformed computed expression '" + expression + "'");
       }
-      createMethodEffect(this, sig, TYPES.COMPUTE, runComputedEffect, property, dynamicFn);
+      const info = createMethodEffect(this, sig, TYPES.COMPUTE, runComputedEffect, property, dynamicFn);
+      // Effects are normally stored as map of dependency->effect, but for
+      // ordered computation, we also need tree of computedProp->dependencies
+      ensureOwnEffectMap(this, COMPUTE_INFO)[property] = info;
     }
 
     /**
@@ -2210,7 +2439,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
      * @param {!Array<!MethodArg>} args Array of argument metadata
      * @param {string} path Property/path name that triggered the method effect
      * @param {Object} props Bag of current property changes
-     * @return {Array<*>} Array of argument values
+     * @return {!Array<*>} Array of argument values
      * @private
      */
     _marshalArgs(args, path, props) {
@@ -2231,6 +2460,11 @@ export const PropertyEffects = dedupingMixin(superClass => {
             value = structured ? getArgValue(data, props, name) : data[name];
           }
         }
+        // When the `legacyUndefined` flag is enabled, pass a no-op value
+        // so that the observer, computed property, or compound binding is aborted.
+        if (legacyUndefined && !this._overrideLegacyUndefined && value === undefined && args.length > 1) {
+          return NOOP;
+        }
         values[i] = value;
       }
       return values;
@@ -2397,10 +2631,43 @@ export const PropertyEffects = dedupingMixin(superClass => {
 
     // -- binding ----------------------------------------------
 
+    /*
+     * Overview of binding flow:
+     *
+     * During finalization (`instanceBinding==false`, `wasPreBound==false`):
+     *  `_bindTemplate(t, false)` called directly during finalization - parses
+     *  the template (for the first time), and then assigns that _prototypical_
+     *  template info to `__preboundTemplateInfo` _on the prototype_; note in
+     *  this case `wasPreBound` is false; this is the first time we're binding
+     *  it, thus we create accessors.
+     *
+     * During first stamping (`instanceBinding==true`, `wasPreBound==true`):
+     *   `_stampTemplate` calls `_bindTemplate(t, true)`: the `templateInfo`
+     *   returned matches the prebound one, and so this is `wasPreBound == true`
+     *   state; thus we _skip_ creating accessors, but _do_ create an instance
+     *   of the template info to serve as the start of our linked list (needs to
+     *   be an instance, not the prototypical one, so that we can add `nodeList`
+     *   to it to contain the `nodeInfo`-ordered list of instance nodes for
+     *   bindings, and so we can chain runtime-stamped template infos off of
+     *   it). At this point, the call to `_stampTemplate` calls
+     *   `applyTemplateInfo` for each nested `<template>` found during parsing
+     *   to hand prototypical `_templateInfo` to them; we also pass the _parent_
+     *   `templateInfo` to the `<template>` so that we have the instance-time
+     *   parent to link the `templateInfo` under in the case it was
+     *   runtime-stamped.
+     *
+     * During subsequent runtime stamping (`instanceBinding==true`,
+     *   `wasPreBound==false`): `_stampTemplate` calls `_bindTemplate(t, true)`
+     *   - here `templateInfo` is guaranteed to _not_ match the prebound one,
+     *   because it was either a different template altogether, or even if it
+     *   was the same template, the step above created a instance of the info;
+     *   in this case `wasPreBound == false`, so we _do_ create accessors, _and_
+     *   link a instance into the linked list.
+     */
+
     /**
-     * Equivalent to static `bindTemplate` API but can be called on
-     * an instance to add effects at runtime.  See that method for
-     * full API docs.
+     * Equivalent to static `bindTemplate` API but can be called on an instance
+     * to add effects at runtime.  See that method for full API docs.
      *
      * This method may be called on the prototype (for prototypical template
      * binding, to avoid creating accessors every instance) once per prototype,
@@ -2410,20 +2677,20 @@ export const PropertyEffects = dedupingMixin(superClass => {
      *
      * @override
      * @param {!HTMLTemplateElement} template Template containing binding
-     *   bindings
+     * bindings
      * @param {boolean=} instanceBinding When false (default), performs
-     *   "prototypical" binding of the template and overwrites any previously
-     *   bound template for the class. When true (as passed from
-     *   `_stampTemplate`), the template info is instanced and linked into
-     *   the list of bound templates.
+     * "prototypical" binding of the template and overwrites any previously
+     * bound template for the class. When true (as passed from
+     * `_stampTemplate`), the template info is instanced and linked into the
+     * list of bound templates.
      * @return {!TemplateInfo} Template metadata object; for `runtimeBinding`,
-     *   this is an instance of the prototypical template info
+     * this is an instance of the prototypical template info
      * @protected
      * @suppress {missingProperties} go/missingfnprops
      */
     _bindTemplate(template, instanceBinding) {
       let templateInfo = this.constructor._parseTemplate(template);
-      let wasPreBound = this.__templateInfo == templateInfo;
+      let wasPreBound = this.__preBoundTemplateInfo == templateInfo;
       // Optimization: since this is called twice for proto-bound templates,
       // don't attempt to recreate accessors if this template was pre-bound
       if (!wasPreBound) {
@@ -2433,17 +2700,40 @@ export const PropertyEffects = dedupingMixin(superClass => {
       }
       if (instanceBinding) {
         // For instance-time binding, create instance of template metadata
-        // and link into list of templates if necessary
+        // and link into tree of templates if necessary
         templateInfo = /** @type {!TemplateInfo} */(Object.create(templateInfo));
         templateInfo.wasPreBound = wasPreBound;
-        if (!wasPreBound && this.__templateInfo) {
-          let last = this.__templateInfoLast || this.__templateInfo;
-          this.__templateInfoLast = last.nextTemplateInfo = templateInfo;
-          templateInfo.previousTemplateInfo = last;
-          return templateInfo;
+        if (!this.__templateInfo) {
+          // Set the info to the root of the tree
+          this.__templateInfo = templateInfo;
+        } else {
+          // Append this template info onto the end of its parent template's
+          // list, which will determine the tree structure via which property
+          // effects are run; if this template was not nested in another
+          // template, use the root template (the first stamped one) as the
+          // parent. Note, `parent` is the `templateInfo` instance for this
+          // template's parent (containing) template, which was set up in
+          // `applyTemplateInfo`.  While a given template's `parent` is set
+          // apriori, it is only added to the parent's child list at the point
+          // that it is being bound, since a template may or may not ever be
+          // stamped, and may be stamped more than once (in which case instances
+          // of the template info will be in the tree under its parent more than
+          // once).
+          const parent = template._parentTemplateInfo || this.__templateInfo;
+          const previous = parent.lastChild;
+          templateInfo.parent = parent;
+          parent.lastChild = templateInfo;
+          templateInfo.previousSibling = previous;
+          if (previous) {
+            previous.nextSibling = templateInfo;
+          } else {
+            parent.firstChild = templateInfo;
+          }
         }
+      } else {
+        this.__preBoundTemplateInfo = templateInfo;
       }
-      return this.__templateInfo = templateInfo;
+      return templateInfo;
     }
 
     /**
@@ -2484,17 +2774,20 @@ export const PropertyEffects = dedupingMixin(superClass => {
      * in the main element template.
      *
      * @param {!HTMLTemplateElement} template Template to stamp
+     * @param {TemplateInfo=} templateInfo Optional bound template info associated
+     *   with the template to be stamped; if omitted the template will be
+     *   automatically bound.
      * @return {!StampedTemplate} Cloned template content
      * @override
      * @protected
      */
-    _stampTemplate(template) {
+    _stampTemplate(template, templateInfo) {
+      templateInfo =  templateInfo || /** @type {!TemplateInfo} */(this._bindTemplate(template, true));
       // Ensures that created dom is `_enqueueClient`'d to this element so
       // that it can be flushed on next call to `_flushProperties`
-      hostStack.beginHosting(this);
-      let dom = super._stampTemplate(template);
-      hostStack.endHosting(this);
-      let templateInfo = /** @type {!TemplateInfo} */(this._bindTemplate(template, true));
+      hostStack.push(this);
+      let dom = super._stampTemplate(template, templateInfo);
+      hostStack.pop();
       // Add template-instance-specific data to instanced templateInfo
       templateInfo.nodeList = dom.nodeList;
       // Capture child nodes to allow unstamping of non-prototypical templates
@@ -2507,10 +2800,18 @@ export const PropertyEffects = dedupingMixin(superClass => {
       dom.templateInfo = templateInfo;
       // Setup compound storage, 2-way listeners, and dataHost for bindings
       setupBindings(this, templateInfo);
-      // Flush properties into template nodes if already booted
-      if (this.__dataReady) {
-        runEffects(this, templateInfo.propertyEffects, this.__data, null,
-          false, templateInfo.nodeList);
+      // Flush properties into template nodes; the check on `__dataClientsReady`
+      // ensures we don't needlessly run effects for an element's initial
+      // prototypical template stamping since they will happen as a part of the
+      // first call to `_propertiesChanged`. This flag is set to true
+      // after running the initial propagate effects, and immediately before
+      // flushing clients. Since downstream clients could cause stamping on
+      // this host (e.g. a fastDomIf `dom-if` being forced to render
+      // synchronously), this flag ensures effects for runtime-stamped templates
+      // are run at this point during the initial element boot-up.
+      if (this.__dataClientsReady) {
+        this._runEffectsForTemplate(templateInfo, this.__data, null, false);
+        this._flushClients();
       }
       return dom;
     }
@@ -2526,25 +2827,28 @@ export const PropertyEffects = dedupingMixin(superClass => {
      * @protected
      */
     _removeBoundDom(dom) {
-      // Unlink template info
-      let templateInfo = dom.templateInfo;
-      if (templateInfo.previousTemplateInfo) {
-        templateInfo.previousTemplateInfo.nextTemplateInfo =
-          templateInfo.nextTemplateInfo;
+      // Unlink template info; Note that while the child is unlinked from its
+      // parent list, a template's `parent` reference is never removed, since
+      // this is is determined by the tree structure and applied at
+      // `applyTemplateInfo` time.
+      const templateInfo = dom.templateInfo;
+      const {previousSibling, nextSibling, parent} = templateInfo;
+      if (previousSibling) {
+        previousSibling.nextSibling = nextSibling;
+      } else if (parent) {
+        parent.firstChild = nextSibling;
       }
-      if (templateInfo.nextTemplateInfo) {
-        templateInfo.nextTemplateInfo.previousTemplateInfo =
-          templateInfo.previousTemplateInfo;
+      if (nextSibling) {
+        nextSibling.previousSibling = previousSibling;
+      } else if (parent) {
+        parent.lastChild = previousSibling;
       }
-      if (this.__templateInfoLast == templateInfo) {
-        this.__templateInfoLast = templateInfo.previousTemplateInfo;
-      }
-      templateInfo.previousTemplateInfo = templateInfo.nextTemplateInfo = null;
+      templateInfo.nextSibling = templateInfo.previousSibling = null;
       // Remove stamped nodes
       let nodes = templateInfo.childNodes;
       for (let i=0; i<nodes.length; i++) {
         let node = nodes[i];
-        node.parentNode.removeChild(node);
+        wrap(wrap(node).parentNode).removeChild(node);
       }
     }
 
@@ -2628,6 +2932,10 @@ export const PropertyEffects = dedupingMixin(superClass => {
           }
           node.setAttribute(name, literal);
         }
+        // support disable-upgrade
+        if (kind == 'attribute' && origName == 'disable-upgrade$') {
+          node.setAttribute(name, '');
+        }
         // Clear attribute before removing, since IE won't allow removing
         // `value` attribute if it previously had a value (can't
         // unconditionally set '' before removing since attributes with `$`
@@ -2673,12 +2981,49 @@ export const PropertyEffects = dedupingMixin(superClass => {
       //     Change back to just super.methodCall()
       let noted = propertyEffectsBase._parseTemplateNestedTemplate.call(
         this, node, templateInfo, nodeInfo);
+      const parent = node.parentNode;
+      const nestedTemplateInfo = nodeInfo.templateInfo;
+      const isDomIf = parent.localName === 'dom-if';
+      const isDomRepeat = parent.localName === 'dom-repeat';
+      // Remove nested template and redirect its host bindings & templateInfo
+      // onto the parent (dom-if/repeat element)'s nodeInfo
+      if (removeNestedTemplates && (isDomIf || isDomRepeat)) {
+        parent.removeChild(node);
+        // Use the parent's nodeInfo (for the dom-if/repeat) to record the
+        // templateInfo, and use that for any host property bindings below
+        nodeInfo = nodeInfo.parentInfo;
+        nodeInfo.templateInfo = nestedTemplateInfo;
+        // Ensure the parent dom-if/repeat is noted since it now may have host
+        // bindings; it may not have been if it did not have its own bindings
+        nodeInfo.noted = true;
+        noted = false;
+      }
       // Merge host props into outer template and add bindings
-      let hostProps = nodeInfo.templateInfo.hostProps;
-      let mode = '{';
-      for (let source in hostProps) {
-        let parts = [{ mode, source, dependencies: [source] }];
-        addBinding(this, templateInfo, nodeInfo, 'property', '_host_' + source, parts);
+      let hostProps = nestedTemplateInfo.hostProps;
+      if (fastDomIf && isDomIf) {
+        // `fastDomIf` mode uses runtime-template stamping to add accessors/
+        // effects to properties used in its template; as such we don't need to
+        // tax the host element with `_host_` bindings for the `dom-if`.
+        // However, in the event it is nested in a `dom-repeat`, it is still
+        // important that its host properties are added to the
+        // TemplateInstance's `hostProps` so that they are forwarded to the
+        // TemplateInstance.
+        if (hostProps) {
+          templateInfo.hostProps =
+            Object.assign(templateInfo.hostProps || {}, hostProps);
+          // Ensure the dom-if is noted so that it has a __dataHost, since
+          // `fastDomIf` uses the host for runtime template stamping; note this
+          // was already ensured above in the `removeNestedTemplates` case
+          if (!removeNestedTemplates) {
+            nodeInfo.parentInfo.noted = true;
+          }
+        }
+      } else {
+        let mode = '{';
+        for (let source in hostProps) {
+          let parts = [{ mode, source, dependencies: [source], hostProp: true }];
+          addBinding(this, templateInfo, nodeInfo, 'property', '_host_' + source, parts);
+        }
       }
       return noted;
     }
@@ -2835,7 +3180,7 @@ export const PropertyEffects = dedupingMixin(superClass => {
 });
 
 /**
- * Helper api for enqueuing client dom created by a host element.
+ * Stack for enqueuing client dom created by a host element.
  *
  * By default elements are flushed via `_flushProperties` when
  * `connectedCallback` is called. Elements attach their client dom to
@@ -2857,39 +3202,4 @@ export const PropertyEffects = dedupingMixin(superClass => {
  *
  * @private
  */
-class HostStack {
-  constructor() {
-    this.stack = [];
-  }
-
-  /**
-   * @param {*} inst Instance to add to hostStack
-   * @return {void}
-   */
-  registerHost(inst) {
-    if (this.stack.length) {
-      let host = this.stack[this.stack.length-1];
-      host._enqueueClient(inst);
-    }
-  }
-
-  /**
-   * @param {*} inst Instance to begin hosting
-   * @return {void}
-   */
-  beginHosting(inst) {
-    this.stack.push(inst);
-  }
-
-  /**
-   * @param {*} inst Instance to end hosting
-   * @return {void}
-   */
-  endHosting(inst) {
-    let stackLen = this.stack.length;
-    if (stackLen && this.stack[stackLen-1] == inst) {
-      this.stack.pop();
-    }
-  }
-}
-const hostStack = new HostStack();
+const hostStack = [];
diff --git a/lib/mixins/template-stamp.js b/lib/mixins/template-stamp.js
index 33717e65de..ee4bc903ce 100644
--- a/lib/mixins/template-stamp.js
+++ b/lib/mixins/template-stamp.js
@@ -119,9 +119,11 @@ function applyEventListener(inst, node, nodeInfo) {
 }
 
 // push configuration references at configure time
-function applyTemplateContent(inst, node, nodeInfo) {
+function applyTemplateInfo(inst, node, nodeInfo, parentTemplateInfo) {
   if (nodeInfo.templateInfo) {
+    // Give the node an instance of this templateInfo and set its parent
     node._templateInfo = nodeInfo.templateInfo;
+    node._parentTemplateInfo = parentTemplateInfo;
   }
 }
 
@@ -151,9 +153,6 @@ function createNodeEventHandler(context, eventName, methodName) {
  * @mixinFunction
  * @polymer
  * @summary Element class mixin that provides basic template parsing and stamping
- * @template T
- * @param {function(new:T)} superClass Class to apply mixin to.
- * @return {function(new:T)} superClass with mixin applied.
  */
 export const TemplateStamp = dedupingMixin(
     /**
@@ -252,6 +251,7 @@ export const TemplateStamp = dedupingMixin(
         // TODO(rictic): fix typing
         let /** ? */ templateInfo = template._templateInfo = {};
         templateInfo.nodeInfoList = [];
+        templateInfo.nestedTemplate = Boolean(outerTemplateInfo);
         templateInfo.stripWhiteSpace =
           (outerTemplateInfo && outerTemplateInfo.stripWhiteSpace) ||
           template.hasAttribute('strip-whitespace');
@@ -305,7 +305,11 @@ export const TemplateStamp = dedupingMixin(
       if (element.hasAttributes && element.hasAttributes()) {
         noted = this._parseTemplateNodeAttributes(element, templateInfo, nodeInfo) || noted;
       }
-      return noted;
+      // Checking `nodeInfo.noted` allows a child node of this node (who gets
+      // access to `parentInfo`) to cause the parent to be noted, which
+      // otherwise has no return path via `_parseTemplateChildNodes` (used by
+      // some optimizations)
+      return noted || nodeInfo.noted;
     }
 
     /**
@@ -484,16 +488,22 @@ export const TemplateStamp = dedupingMixin(
      * is removed and stored in notes as well.
      *
      * @param {!HTMLTemplateElement} template Template to stamp
+     * @param {TemplateInfo=} templateInfo Optional template info associated
+     *   with the template to be stamped; if omitted the template will be
+     *   automatically parsed.
      * @return {!StampedTemplate} Cloned template content
      * @override
      */
-    _stampTemplate(template) {
+    _stampTemplate(template, templateInfo) {
       // Polyfill support: bootstrap the template if it has not already been
       if (template && !template.content &&
           window.HTMLTemplateElement && HTMLTemplateElement.decorate) {
         HTMLTemplateElement.decorate(template);
       }
-      let templateInfo = this.constructor._parseTemplate(template);
+      // Accepting the `templateInfo` via an argument allows for creating
+      // instances of the `templateInfo` by the caller, useful for adding
+      // instance-time information to the prototypical data
+      templateInfo = templateInfo || this.constructor._parseTemplate(template);
       let nodeInfo = templateInfo.nodeInfoList;
       let content = templateInfo.content || template.content;
       let dom = /** @type {DocumentFragment} */ (document.importNode(content, true));
@@ -504,7 +514,7 @@ export const TemplateStamp = dedupingMixin(
       for (let i=0, l=nodeInfo.length, info; (i<l) && (info=nodeInfo[i]); i++) {
         let node = nodes[i] = findTemplateNode(dom, info);
         applyIdToMap(this, dom.$, node, info);
-        applyTemplateContent(this, node, info);
+        applyTemplateInfo(this, node, info, templateInfo);
         applyEventListener(this, node, info);
       }
       dom = /** @type {!StampedTemplate} */(dom); // eslint-disable-line no-self-assign
diff --git a/lib/utils/async.js b/lib/utils/async.js
index e332f95325..37df334a56 100644
--- a/lib/utils/async.js
+++ b/lib/utils/async.js
@@ -27,10 +27,12 @@ let microtaskCurrHandle = 0;
 let microtaskLastHandle = 0;
 let microtaskCallbacks = [];
 let microtaskNodeContent = 0;
+let microtaskScheduled = false;
 let microtaskNode = document.createTextNode('');
 new window.MutationObserver(microtaskFlush).observe(microtaskNode, {characterData: true});
 
 function microtaskFlush() {
+  microtaskScheduled = false;
   const len = microtaskCallbacks.length;
   for (let i = 0; i < len; i++) {
     let cb = microtaskCallbacks[i];
@@ -181,7 +183,10 @@ const microTask = {
    * @return {number} Handle used for canceling task
    */
   run(callback) {
-    microtaskNode.textContent = microtaskNodeContent++;
+    if (!microtaskScheduled) {
+      microtaskScheduled = true;
+      microtaskNode.textContent = microtaskNodeContent++;
+    }
     microtaskCallbacks.push(callback);
     return microtaskCurrHandle++;
   },
diff --git a/lib/utils/mixin.js b/lib/utils/mixin.js
index b79c7f9a20..156175f61a 100644
--- a/lib/utils/mixin.js
+++ b/lib/utils/mixin.js
@@ -52,13 +52,13 @@ export const dedupingMixin = function(mixin) {
     if (!extended) {
       extended = /** @type {!Function} */(mixin)(base);
       map.set(base, extended);
+      // copy inherited mixin set from the extended class, or the base class
+      // NOTE: we avoid use of Set here because some browser (IE11)
+      // cannot extend a base Set via the constructor.
+      let mixinSet = Object.create(/** @type {!MixinFunction} */(extended).__mixinSet || baseSet || null);
+      mixinSet[mixinDedupeId] = true;
+      /** @type {!MixinFunction} */(extended).__mixinSet = mixinSet;
     }
-    // copy inherited mixin set from the extended class, or the base class
-    // NOTE: we avoid use of Set here because some browser (IE11)
-    // cannot extend a base Set via the constructor.
-    let mixinSet = Object.create(/** @type {!MixinFunction} */(extended).__mixinSet || baseSet || null);
-    mixinSet[mixinDedupeId] = true;
-    /** @type {!MixinFunction} */(extended).__mixinSet = mixinSet;
     return extended;
   }
 
diff --git a/lib/utils/settings.js b/lib/utils/settings.js
index 519ea68313..ee70d3c14b 100644
--- a/lib/utils/settings.js
+++ b/lib/utils/settings.js
@@ -8,12 +8,26 @@ Code distributed by Google as part of the polymer project is also
 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 */
 import './boot.js';
-
 import { pathFromUrl } from './resolve-url.js';
-export const useShadow = !(window.ShadyDOM);
+export const useShadow = !(window.ShadyDOM) || !(window.ShadyDOM.inUse);
 export const useNativeCSSProperties = Boolean(!window.ShadyCSS || window.ShadyCSS.nativeCss);
 export const useNativeCustomElements = !(window.customElements.polyfillWrapFlushCallback);
-
+export const supportsAdoptingStyleSheets = useShadow &&
+    ('adoptedStyleSheets' in Document.prototype) &&
+    ('replaceSync' in CSSStyleSheet.prototype) &&
+    // Since spec may change, feature detect exact API we need
+    (() => {
+      try {
+        const sheet = new CSSStyleSheet();
+        sheet.replaceSync('');
+        const host = document.createElement('div');
+        host.attachShadow({mode: 'open'});
+        host.shadowRoot.adoptedStyleSheets = [sheet];
+        return (host.shadowRoot.adoptedStyleSheets[0] === sheet);
+      } catch(e) {
+        return false;
+      }
+    })();
 
 /**
  * Globally settable property that is automatically assigned to
@@ -23,7 +37,8 @@ export const useNativeCustomElements = !(window.customElements.polyfillWrapFlush
  * `rootPath` to provide a stable application mount path when
  * using client side routing.
  */
-export let rootPath = pathFromUrl(document.baseURI || window.location.href);
+export let rootPath = window.Polymer && window.Polymer.rootPath ||
+  pathFromUrl(document.baseURI || window.location.href);
 
 /**
  * Sets the global rootPath property used by `ElementMixin` and
@@ -51,7 +66,8 @@ export const setRootPath = function(path) {
  *
  * @type {(function(*,string,string,?Node):*)|undefined}
  */
-export let sanitizeDOMValue = window.Polymer && window.Polymer.sanitizeDOMValue || undefined;
+export let sanitizeDOMValue =
+  window.Polymer && window.Polymer.sanitizeDOMValue || undefined;
 
 /**
  * Sets the global sanitizeDOMValue available via this module's exported
@@ -79,7 +95,8 @@ export const getSanitizeDOMValue = function() {
  * scrolling performance.
  * Defaults to `false` for backwards compatibility.
  */
-export let passiveTouchGestures = false;
+export let passiveTouchGestures =
+  window.Polymer && window.Polymer.setPassiveTouchGestures || false;
 
 /**
  * Sets `passiveTouchGestures` globally for all elements using Polymer Gestures.
@@ -97,7 +114,8 @@ export const setPassiveTouchGestures = function(usePassive) {
  * disallowed, `<dom-bind>` is disabled, and `<dom-if>`/`<dom-repeat>`
  * templates will only evaluate in the context of a trusted element template.
  */
-export let strictTemplatePolicy = false;
+export let strictTemplatePolicy =
+  window.Polymer && window.Polymer.strictTemplatePolicy || false;
 
 /**
  * Sets `strictTemplatePolicy` globally for all elements
@@ -116,7 +134,8 @@ export const setStrictTemplatePolicy = function(useStrictPolicy) {
  * getter and the `html` tag function.  To enable legacy loading of templates
  * via dom-module, set this flag to true.
  */
-export let allowTemplateFromDomModule = false;
+export let allowTemplateFromDomModule =
+  window.Polymer && window.Polymer.allowTemplateFromDomModule || false;
 
 /**
  * Sets `lookupTemplateFromDomModule` globally for all elements
@@ -136,7 +155,8 @@ export const setAllowTemplateFromDomModule = function(allowDomModule) {
  * If no includes or relative urls are used in styles, these steps can be
  * skipped as an optimization.
  */
-export let legacyOptimizations = false;
+export let legacyOptimizations =
+  window.Polymer && window.Polymer.legacyOptimizations || false;
 
 /**
  * Sets `legacyOptimizations` globally for all elements to enable optimizations
@@ -150,11 +170,28 @@ export const setLegacyOptimizations = function(useLegacyOptimizations) {
   legacyOptimizations = useLegacyOptimizations;
 };
 
+/**
+ * Setting to add warnings useful when migrating from Polymer 1.x to 2.x.
+ */
+export let legacyWarnings =
+  window.Polymer && window.Polymer.legacyWarnings || false;
+
+/**
+ * Sets `legacyWarnings` globally for all elements to migration warnings.
+ *
+ * @param {boolean} useLegacyWarnings enable or disable warnings
+ * @return {void}
+ */
+export const setLegacyWarnings = function(useLegacyWarnings) {
+  legacyWarnings = useLegacyWarnings;
+};
+
 /**
  * Setting to perform initial rendering synchronously when running under ShadyDOM.
  * This matches the behavior of Polymer 1.
  */
-export let syncInitialRender = false;
+export let syncInitialRender =
+  window.Polymer && window.Polymer.syncInitialRender || false;
 
 /**
  * Sets `syncInitialRender` globally for all elements to enable synchronous
@@ -168,6 +205,44 @@ export const setSyncInitialRender = function(useSyncInitialRender) {
   syncInitialRender = useSyncInitialRender;
 };
 
+/**
+ * Setting to retain the legacy Polymer 1 behavior for multi-property
+ * observers around undefined values. Observers and computed property methods
+ * are not called until no argument is undefined.
+ */
+export let legacyUndefined =
+  window.Polymer && window.Polymer.legacyUndefined || false;
+
+/**
+ * Sets `legacyUndefined` globally for all elements to enable legacy
+ * multi-property behavior for undefined values.
+ *
+ * @param {boolean} useLegacyUndefined enable or disable legacy
+ * multi-property behavior for undefined.
+ * @return {void}
+ */
+export const setLegacyUndefined = function(useLegacyUndefined) {
+  legacyUndefined = useLegacyUndefined;
+};
+
+/**
+ * Setting to ensure computed properties are computed in order to ensure
+ * re-computation never occurs in a given turn.
+ */
+export let orderedComputed =
+  window.Polymer && window.Polymer.orderedComputed || false;
+
+/**
+ * Sets `orderedComputed` globally for all elements to enable ordered computed
+ * property computation.
+ *
+ * @param {boolean} useOrderedComputed enable or disable ordered computed effects
+ * @return {void}
+ */
+export const setOrderedComputed = function(useOrderedComputed) {
+  orderedComputed = useOrderedComputed;
+};
+
 /**
  * Setting to cancel synthetic click events fired by older mobile browsers. Modern browsers
  * no longer fire synthetic click events, and the cancellation behavior can interfere
@@ -185,3 +260,100 @@ export let cancelSyntheticClickEvents = true;
 export const setCancelSyntheticClickEvents = function(useCancelSyntheticClickEvents) {
   cancelSyntheticClickEvents = useCancelSyntheticClickEvents;
 };
+
+/**
+ * Setting to remove nested templates inside `dom-if` and `dom-repeat` as
+ * part of element template parsing.  This is a performance optimization that
+ * eliminates most of the tax of needing two elements due to the loss of
+ * type-extended templates as a result of the V1 specification changes.
+ */
+export let removeNestedTemplates =
+  window.Polymer && window.Polymer.removeNestedTemplates || false;
+
+/**
+ * Sets `removeNestedTemplates` globally, to eliminate nested templates
+ * inside `dom-if` and `dom-repeat` as part of template parsing.
+ *
+ * @param {boolean} useRemoveNestedTemplates enable or disable removing nested
+ *   templates during parsing
+ * @return {void}
+ */
+export const setRemoveNestedTemplates = function(useRemoveNestedTemplates) {
+  removeNestedTemplates = useRemoveNestedTemplates;
+};
+
+/**
+ * Setting to place `dom-if` elements in a performance-optimized mode that takes
+ * advantage of lighter-weight host runtime template stamping to eliminate the
+ * need for an intermediate Templatizer `TemplateInstance` to mange the nodes
+ * stamped by `dom-if`.  Under this setting, any Templatizer-provided API's
+ * such as `modelForElement` will not be available for nodes stamped by
+ * `dom-if`.
+ */
+export let fastDomIf = window.Polymer && window.Polymer.fastDomIf || false;
+
+/**
+ * Sets `fastDomIf` globally, to put `dom-if` in a performance-optimized mode.
+ *
+ * @param {boolean} useFastDomIf enable or disable `dom-if` fast-mode
+ * @return {void}
+ */
+export const setFastDomIf = function(useFastDomIf) {
+  fastDomIf = useFastDomIf;
+};
+
+/**
+ * Setting to disable `dom-change` and `rendered-item-count` events from
+ * `dom-if` and `dom-repeat`. Users can opt back into `dom-change` events by
+ * setting the `notify-dom-change` attribute (`notifyDomChange: true` property)
+ * to `dom-if`/`don-repeat` instances.
+ */
+export let suppressTemplateNotifications =
+  window.Polymer && window.Polymer.suppressTemplateNotifications || false;
+
+/**
+ * Sets `suppressTemplateNotifications` globally, to disable `dom-change` and
+ * `rendered-item-count` events from `dom-if` and `dom-repeat`.
+ *
+ * @param {boolean} suppress enable or disable `suppressTemplateNotifications`
+ * @return {void}
+ */
+export const setSuppressTemplateNotifications = function(suppress) {
+  suppressTemplateNotifications = suppress;
+};
+
+/**
+ * Setting to disable use of dynamic attributes. This is an optimization
+ * to avoid setting `observedAttributes`. Instead attributes are read
+ * once at create time and set/removeAttribute are patched.
+ */
+export let legacyNoObservedAttributes =
+  window.Polymer && window.Polymer.legacyNoObservedAttributes || false;
+
+/**
+ * Sets `legacyNoObservedAttributes` globally, to disable `observedAttributes`.
+ *
+ * @param {boolean} noObservedAttributes enable or disable `legacyNoObservedAttributes`
+ * @return {void}
+ */
+export const setLegacyNoObservedAttributes = function(noObservedAttributes) {
+  legacyNoObservedAttributes = noObservedAttributes;
+};
+
+/**
+ * Setting to enable use of `adoptedStyleSheets` for sharing style sheets
+ * between component instances' shadow roots, if the app uses built Shady CSS
+ * styles.
+ */
+export let useAdoptedStyleSheetsWithBuiltCSS =
+  window.Polymer && window.Polymer.useAdoptedStyleSheetsWithBuiltCSS || false;
+
+/**
+ * Sets `useAdoptedStyleSheetsWithBuiltCSS` globally.
+ *
+ * @param {boolean} value enable or disable `useAdoptedStyleSheetsWithBuiltCSS`
+ * @return {void}
+ */
+export const setUseAdoptedStyleSheetsWithBuiltCSS = function(value) {
+  useAdoptedStyleSheetsWithBuiltCSS = value;
+};
diff --git a/lib/utils/templatize.js b/lib/utils/templatize.js
index bb9ef53517..8ec2c2ba8a 100644
--- a/lib/utils/templatize.js
+++ b/lib/utils/templatize.js
@@ -49,7 +49,7 @@ import './boot.js';
 
 import { PropertyEffects } from '../mixins/property-effects.js';
 import { MutableData } from '../mixins/mutable-data.js';
-import { strictTemplatePolicy } from './settings.js';
+import { strictTemplatePolicy, legacyWarnings } from './settings.js';
 import { wrap } from './wrap.js';
 
 // Base class for HTMLTemplateElement extension that has property effects
@@ -102,10 +102,49 @@ function upgradeTemplate(template, constructor) {
  * @implements {Polymer_PropertyEffects}
  * @private
  */
-const templateInstanceBase = PropertyEffects(
-    // This cast shouldn't be neccessary, but Closure doesn't understand that
-    // "class {}" is a constructor function.
-    /** @type {function(new:Object)} */(class {}));
+const templateInstanceBase = PropertyEffects(class {});
+
+export function showHideChildren(hide, children) {
+  for (let i=0; i<children.length; i++) {
+    let n = children[i];
+    // Ignore non-changes
+    if (Boolean(hide) != Boolean(n.__hideTemplateChildren__)) {
+      // clear and restore text
+      if (n.nodeType === Node.TEXT_NODE) {
+        if (hide) {
+          n.__polymerTextContent__ = n.textContent;
+          n.textContent = '';
+        } else {
+          n.textContent = n.__polymerTextContent__;
+        }
+      // remove and replace slot
+      } else if (n.localName === 'slot') {
+        if (hide) {
+          n.__polymerReplaced__ = document.createComment('hidden-slot');
+          wrap(wrap(n).parentNode).replaceChild(n.__polymerReplaced__, n);
+        } else {
+          const replace = n.__polymerReplaced__;
+          if (replace) {
+            wrap(wrap(replace).parentNode).replaceChild(n, replace);
+          }
+        }
+      }
+      // hide and show nodes
+      else if (n.style) {
+        if (hide) {
+          n.__polymerDisplay__ = n.style.display;
+          n.style.display = 'none';
+        } else {
+          n.style.display = n.__polymerDisplay__;
+        }
+      }
+    }
+    n.__hideTemplateChildren__ = hide;
+    if (n._showHideChildren) {
+      n._showHideChildren(hide);
+    }
+  }
+}
 
 /**
  * @polymer
@@ -212,45 +251,7 @@ class TemplateInstanceBase extends templateInstanceBase {
    * @protected
    */
   _showHideChildren(hide) {
-    let c = this.children;
-    for (let i=0; i<c.length; i++) {
-      let n = c[i];
-      // Ignore non-changes
-      if (Boolean(hide) != Boolean(n.__hideTemplateChildren__)) {
-        if (n.nodeType === Node.TEXT_NODE) {
-          if (hide) {
-            n.__polymerTextContent__ = n.textContent;
-            n.textContent = '';
-          } else {
-            n.textContent = n.__polymerTextContent__;
-          }
-        // remove and replace slot
-        } else if (n.localName === 'slot') {
-          if (hide) {
-            n.__polymerReplaced__ = document.createComment('hidden-slot');
-            wrap(wrap(n).parentNode).replaceChild(n.__polymerReplaced__, n);
-          } else {
-            const replace = n.__polymerReplaced__;
-            if (replace) {
-              wrap(wrap(replace).parentNode).replaceChild(n, replace);
-            }
-          }
-        }
-
-        else if (n.style) {
-          if (hide) {
-            n.__polymerDisplay__ = n.style.display;
-            n.style.display = 'none';
-          } else {
-            n.style.display = n.__polymerDisplay__;
-          }
-        }
-      }
-      n.__hideTemplateChildren__ = hide;
-      if (n._showHideChildren) {
-        n._showHideChildren(hide);
-      }
-    }
+    showHideChildren(hide, this.children);
   }
   /**
    * Overrides default property-effects implementation to intercept
@@ -325,9 +326,9 @@ TemplateInstanceBase.prototype.__hostProps;
  * @private
  */
 const MutableTemplateInstanceBase = MutableData(
-    // This cast shouldn't be necessary, but Closure doesn't seem to understand
-    // this constructor.
-    /** @type {function(new:TemplateInstanceBase)} */(TemplateInstanceBase));
+    // This cast shouldn't be neccessary, but Closure doesn't understand that
+    // TemplateInstanceBase is a constructor function.
+    /** @type {function(new:TemplateInstanceBase)} */ (TemplateInstanceBase));
 
 function findMethodHost(template) {
   // Technically this should be the owner of the outermost template.
@@ -372,23 +373,51 @@ function createTemplatizerClass(template, templateInfo, options) {
 /**
  * Adds propagate effects from the template to the template instance for
  * properties that the host binds to the template using the `_host_` prefix.
- * 
+ *
  * @suppress {missingProperties} class.prototype is not defined for some reason
  */
-function addPropagateEffects(template, templateInfo, options) {
+function addPropagateEffects(target, templateInfo, options, methodHost) {
   let userForwardHostProp = options.forwardHostProp;
   if (userForwardHostProp && templateInfo.hasHostProps) {
+    // Under the `removeNestedTemplates` optimization, a custom element like
+    // `dom-if` or `dom-repeat` can itself be treated as the "template"; this
+    // flag is used to switch between upgrading a `<template>` to be a property
+    // effects client vs. adding the effects directly to the custom element
+    const isTemplate = target.localName == 'template';
     // Provide data API and property effects on memoized template class
     let klass = templateInfo.templatizeTemplateClass;
     if (!klass) {
-      /**
-       * @constructor
-       * @extends {DataTemplate}
-       */
-      let templatizedBase = options.mutableData ? MutableDataTemplate : DataTemplate;
-      /** @private */
-      klass = templateInfo.templatizeTemplateClass =
-        class TemplatizedTemplate extends templatizedBase {};
+      if (isTemplate) {
+        /**
+         * @constructor
+         * @extends {DataTemplate}
+         */
+        let templatizedBase =
+            options.mutableData ? MutableDataTemplate : DataTemplate;
+
+        // NOTE: due to https://github.com/google/closure-compiler/issues/2928,
+        // combining the next two lines into one assignment causes a spurious
+        // type error.
+        /** @private */
+        class TemplatizedTemplate extends templatizedBase {}
+        klass = templateInfo.templatizeTemplateClass = TemplatizedTemplate;
+      } else {
+        /**
+         * @constructor
+         * @extends {PolymerElement}
+         */
+        const templatizedBase = target.constructor;
+
+        // Create a cached subclass of the base custom element class onto which
+        // to put the template-specific propagate effects
+        // NOTE: due to https://github.com/google/closure-compiler/issues/2928,
+        // combining the next two lines into one assignment causes a spurious
+        // type error.
+        /** @private */
+        class TemplatizedTemplateExtension extends templatizedBase {}
+        klass = templateInfo.templatizeTemplateClass =
+            TemplatizedTemplateExtension;
+      }
       // Add template - >instances effects
       // and host <- template effects
       let hostProps = templateInfo.hostProps;
@@ -398,20 +427,40 @@ function addPropagateEffects(template, templateInfo, options) {
           {fn: createForwardHostPropEffect(prop, userForwardHostProp)});
         klass.prototype._createNotifyingProperty('_host_' + prop);
       }
+      if (legacyWarnings && methodHost) {
+        warnOnUndeclaredProperties(templateInfo, options, methodHost);
+      }
     }
-    upgradeTemplate(template, klass);
     // Mix any pre-bound data into __data; no need to flush this to
     // instances since they pull from the template at instance-time
-    if (template.__dataProto) {
+    if (target.__dataProto) {
       // Note, generally `__dataProto` could be chained, but it's guaranteed
       // to not be since this is a vanilla template we just added effects to
-      Object.assign(template.__data, template.__dataProto);
+      Object.assign(target.__data, target.__dataProto);
+    }
+    if (isTemplate) {
+      upgradeTemplate(target, klass);
+      // Clear any pending data for performance
+      target.__dataTemp = {};
+      target.__dataPending = null;
+      target.__dataOld = null;
+      target._enableProperties();
+    } else {
+      // Swizzle the cached subclass prototype onto the custom element
+      Object.setPrototypeOf(target, klass.prototype);
+      // Check for any pre-bound instance host properties, and do the
+      // instance property delete/assign dance for those (directly into data;
+      // not need to go through accessor since they are pulled at instance time)
+      const hostProps = templateInfo.hostProps;
+      for (let prop in hostProps) {
+        prop = '_host_' + prop;
+        if (prop in target) {
+          const val = target[prop];
+          delete target[prop];
+          target.__data[prop] = val;
+        }
+      }
     }
-    // Clear any pending data for performance
-    template.__dataTemp = {};
-    template.__dataPending = null;
-    template.__dataOld = null;
-    template._enableProperties();
   }
 }
 /* eslint-enable valid-jsdoc */
@@ -565,13 +614,14 @@ export function templatize(template, owner, options) {
     baseClass = createTemplatizerClass(template, templateInfo, options);
     templateInfo.templatizeInstanceClass = baseClass;
   }
+  const methodHost = findMethodHost(template);
   // Host property forwarding must be installed onto template instance
-  addPropagateEffects(template, templateInfo, options);
+  addPropagateEffects(template, templateInfo, options, methodHost);
   // Subclass base class and add reference for this specific template
   /** @private */
   let klass = class TemplateInstance extends baseClass {};
   /** @override */
-  klass.prototype._methodHost = findMethodHost(template);
+  klass.prototype._methodHost = methodHost;
   /** @override */
   klass.prototype.__dataHost = /** @type {!DataTemplate} */ (template);
   /** @override */
@@ -582,6 +632,27 @@ export function templatize(template, owner, options) {
   return klass;
 }
 
+function warnOnUndeclaredProperties(templateInfo, options, methodHost) {
+  const declaredProps = methodHost.constructor._properties;
+  const {propertyEffects} = templateInfo;
+  const {instanceProps} = options;
+  for (let prop in propertyEffects) {
+    // Ensure properties with template effects are declared on the outermost
+    // host (`methodHost`), unless they are instance props or static functions
+    if (!declaredProps[prop] && !(instanceProps && instanceProps[prop])) {
+      const effects = propertyEffects[prop];
+      for (let i=0; i<effects.length; i++) {
+        const {part} = effects[i].info;
+        if (!(part.signature && part.signature.static)) {
+          console.warn(`Property '${prop}' used in template but not ` +
+            `declared in 'properties'; attribute will not be observed.`);
+          break;
+        }
+      }
+    }
+  }
+}
+
 /**
  * Returns the template "model" associated with a given element, which
  * serves as the binding scope for the template instance the element is
@@ -596,8 +667,10 @@ export function templatize(template, owner, options) {
  *     model.set('item.checked', true);
  *   }
  *
- * @param {HTMLTemplateElement} template The model will be returned for
- *   elements stamped from this template
+ * @param {HTMLElement} template The model will be returned for
+ *   elements stamped from this template (accepts either an HTMLTemplateElement)
+ *   or a `<dom-if>`/`<dom-repeat>` element when using `removeNestedTemplates`
+ *   optimization.
  * @param {Node=} node Node for which to return a template model.
  * @return {TemplateInstanceBase} Template instance representing the
  *   binding scope for the element
@@ -608,7 +681,7 @@ export function modelForElement(template, node) {
     // An element with a __templatizeInstance marks the top boundary
     // of a scope; walk up until we find one, and then ensure that
     // its __dataHost matches `this`, meaning this dom-repeat stamped it
-    if ((model = node.__templatizeInstance)) {
+    if ((model = node.__dataHost ? node : node.__templatizeInstance)) {
       // Found an element stamped by another template; keep walking up
       // from its __dataHost
       if (model.__dataHost != template) {
diff --git a/test/runner.html b/test/runner.html
index af3cebde8a..cb43c865a5 100644
--- a/test/runner.html
+++ b/test/runner.html
@@ -31,8 +31,11 @@
       'unit/template-stamp.html',
       'unit/strict-template-policy.html',
       'unit/property-effects.html',
+      'unit/property-effects.html?legacyUndefined=true',
+      'unit/property-effects.html?orderedComputed=true',
       'unit/property-effects-template.html',
       'unit/path-effects.html',
+      'unit/path-effects.html?orderedComputed=true',
       'unit/shady.html',
       'unit/shady-events.html',
       'unit/shady-content.html',
@@ -43,6 +46,7 @@
       'unit/styling-cross-scope-apply.html',
       'unit/styling-cross-scope-unknown-host.html',
       'unit/styling-only-with-template.html',
+      'unit/styling-build-adopted-stylesheets.html',
       'unit/custom-style.html',
       'unit/custom-style-late.html',
       'unit/custom-style-async.html',
@@ -67,7 +71,11 @@
       'unit/path.html',
       'unit/templatize.html',
       'unit/dom-repeat.html',
+      'unit/dom-repeat.html?removeNestedTemplates=true',
       'unit/dom-if.html',
+      'unit/dom-if.html?removeNestedTemplates=true',
+      'unit/dom-if.html?fastDomIf=true',
+      'unit/dom-if.html?removeNestedTemplates=true&fastDomIf=true',
       'unit/dom-bind.html',
       'unit/array-selector.html',
       'unit/polymer-dom.html',
@@ -89,6 +97,8 @@
       'unit/shady-unscoped-style.html',
       'unit/html-tag.html',
       'unit/legacy-data.html',
+      'unit/legacy-undefined.html',
+      'unit/legacy-noattributes.html',
       // 'unit/multi-style.html'
       'unit/class-properties.html',
       'unit/styling-scoped-nopatch.html'
diff --git a/test/unit/disable-upgrade.html b/test/unit/disable-upgrade.html
index 1c1fc78d7e..158935b9cc 100644
--- a/test/unit/disable-upgrade.html
+++ b/test/unit/disable-upgrade.html
@@ -30,6 +30,8 @@
         }
       </style>
       <h2 id="element">[[prop]]</h2>
+      <!-- force an accessor for the default property -->
+      default: [[default]]
     </template>
 
     <script type="module">
@@ -41,6 +43,10 @@ <h2 id="element">[[prop]]</h2>
     return {
       prop: {
         type: String
+      },
+      default: {
+        type: String,
+        value: 'default'
       }
     };
   }
@@ -53,6 +59,16 @@ <h2 id="element">[[prop]]</h2>
     super.ready();
     this.enabled = true;
   }
+
+  connectedCallback() {
+    this.wasConnected = true;
+    super.connectedCallback();
+  }
+
+  disconnectedCallback() {
+    this.wasDisconnected = true;
+    super.disconnectedCallback();
+  }
 });
 customElements.define(Disabled.is, Disabled);
 </script>
@@ -71,26 +87,26 @@ <h2 id="element">[[prop]]</h2>
           }
         </style>
         <h2 id="element">[[prop]]</h2>
+        <!-- force an accessor for the default property -->
+        default: [[default]]
       </template>
 
       <script type="module">
-import { DisableUpgradeMixin } from '../../lib/mixins/disable-upgrade-mixin.js';
-import { Class as PolymerClass } from '../../lib/legacy/class.js';
 import { Polymer } from '../../lib/legacy/polymer-fn.js';
+import {setLegacyOptimizations} from '../../lib/utils/settings.js';
 
-// enable disable upgrade!
-const origPolymerClass = PolymerClass;
-
-Polymer.Class = function(info) {
-  const ctor = origPolymerClass(info);
-  return DisableUpgradeMixin(ctor);
-};
+// This setting is for all tests...
+setLegacyOptimizations(true);
 
 Polymer({
   is: 'x-disabled-legacy',
   properties: {
     prop: {
       type: String
+    },
+    default: {
+      type: String,
+      value: 'default'
     }
   },
   listeners: {
@@ -100,6 +116,12 @@ <h2 id="element">[[prop]]</h2>
     this.hasCreated = true;
     this.prop = 'enabled!';
   },
+  attached() {
+    this.wasConnected = true;
+  },
+  detached() {
+    this.wasDisconnected = true;
+  },
   ready() {
     this.enabled = true;
   },
@@ -127,8 +149,8 @@ <h2 id="element">[[prop]]</h2>
 
     <template>
       <x-disabled id="enabledEl">Disabled</x-disabled>
-      <x-disabled id="disabledEl" disable-upgrade>Disabled</x-disabled>
-      <x-disabled id="disabledBoundEl" disable-upgrade$="[[upgradeDisabled]]">Disabled</x-disabled>
+      <x-disabled id="disabledEl" disable-upgrade default="custom">Disabled</x-disabled>
+      <x-disabled id="disabledBoundEl" disable-upgrade$="[[upgradeDisabled]]" default="[[default]]">Disabled</x-disabled>
     </template>
 
     <script type="module">
@@ -138,7 +160,8 @@ <h2 id="element">[[prop]]</h2>
   static get is() { return 'my-element'; }
   static get properties() {
     return {
-      upgradeDisabled: {value: true}
+      upgradeDisabled: {value: true},
+      default: {type: String, value: 'custom'}
     };
   }
   enable() {
@@ -155,20 +178,20 @@ <h2 id="element">[[prop]]</h2>
 
     <template>
       <x-disabled-legacy id="enabledEl">Disabled</x-disabled-legacy>
-      <x-disabled-legacy id="disabledEl" disable-upgrade>Disabled</x-disabled-legacy>
-      <x-disabled-legacy id="disabledBoundEl" disable-upgrade$="[[upgradeDisabled]]">Disabled</x-disabled-legacy>
+      <x-disabled-legacy id="disabledEl" disable-upgrade default="custom">Disabled</x-disabled-legacy>
+      <x-disabled-legacy id="disabledBoundEl" disable-upgrade$="[[upgradeDisabled]]" default="[[default]]">Disabled</x-disabled-legacy>
       <x-disabled-legacy-reg1 id="disabledRegEl" disable-upgrade>Disabled</x-disabled-legacy-reg1>
       <x-disabled-legacy-reg2 id="disabledRegBoundEl" disable-upgrade$="[[upgradeDisabled]]">Disabled</x-disabled-legacy-reg2>
 
     </template>
 
     <script type="module">
-import '../../lib/mixins/disable-upgrade-mixin.js';
 import { Polymer } from '../../lib/legacy/polymer-fn.js';
 Polymer({
   is: 'my-element-legacy',
   properties: {
-    upgradeDisabled: { type: String, value: true }
+    upgradeDisabled: { type: Boolean, value: true },
+    default: {type: String, value: 'custom'}
   },
   enable() {
     this.$.disabledEl.removeAttribute('disable-upgrade');
@@ -180,8 +203,97 @@ <h2 id="element">[[prop]]</h2>
 
   </dom-module>
 
+<dom-module id="disable-upgrade-extensions">
+  <template>
+    <ext-disabled-legacy id="enabledEl1">Disabled</ext-disabled-legacy>
+    <ext-disabled-legacy id="disabledEl1" disable-upgrade>Disabled</ext-disabled-legacy>
+    <ext-disabled-legacy id="disabledBoundEl1" disable-upgrade$="[[upgradeDisabled]]">Disabled</ext-disabled-legacy>
+
+    <ext-disabled id="enabledEl2">Disabled</ext-disabled>
+    <ext-disabled id="disabledEl2" disable-upgrade>Disabled</ext-disabled>
+    <ext-disabled id="disabledBoundEl2" disable-upgrade$="[[upgradeDisabled]]">Disabled</ext-disabled>
+
+    <ext-disabled-behaviors id="enabledEl3">Disabled</ext-disabled-behaviors>
+    <ext-disabled-behaviors id="disabledEl3" disable-upgrade>Disabled</ext-disabled-behaviors>
+    <ext-disabled-behaviors id="disabledBoundEl3" disable-upgrade$="[[upgradeDisabled]]">Disabled</ext-disabled-behaviors>
+
+  </template>
+  <script type="module">
+    import { Polymer } from '../../lib/legacy/polymer-fn.js';
+    import {mixinBehaviors} from '../../lib/legacy/class.js';
+    import { DisableUpgradeMixin } from '../../lib/mixins/disable-upgrade-mixin.js';
+
+    const DisabledLegacy = customElements.get('x-disabled-legacy');
+
+    customElements.define('ext-disabled-legacy', class extends DisabledLegacy {});
+
+    customElements.define('ext-disabled', DisableUpgradeMixin(class extends customElements.get('x-disabled') {}));
+
+    customElements.define('ext-disabled-behaviors', mixinBehaviors([], DisabledLegacy));
+
+    Polymer({
+      is: 'disable-upgrade-extensions',
+      properties: {
+        upgradeDisabled: { type: Boolean, value: true }
+      },
+      enable() {
+        this.$.disabledEl1.removeAttribute('disable-upgrade');
+        this.$.disabledEl2.removeAttribute('disable-upgrade');
+        this.$.disabledEl3.removeAttribute('disable-upgrade');
+        this.upgradeDisabled = false;
+      }
+    });
+  </script>
+</dom-module>
+
+<dom-module id="disable-dom-if-repeat">
+  <template>
+    <template is="dom-repeat" items="[1]">
+      <my-element-legacy></my-element-legacy>
+      <my-element-legacy upgrade-disabled="[[upgradeDisabled]]"></my-element-legacy>
+    </template>
+    <template is="dom-if" if="true">
+      <my-element-legacy></my-element-legacy>
+      <my-element-legacy upgrade-disabled="[[upgradeDisabled]]"></my-element-legacy>
+    </template>
+  </template>
+  <script type="module">
+    import { Polymer } from '../../lib/legacy/polymer-fn.js';
+    Polymer({
+      is: 'disable-dom-if-repeat',
+      properties: {
+        upgradeDisabled: { type: Boolean, value: true }
+      },
+      enable() {
+        this.upgradeDisabled = false;
+      }
+    });
+  </script>
+</dom-module>
+
+<script type="module">
+  import { Polymer } from '../../lib/legacy/polymer-fn.js';
+  Polymer({
+    is: 'x-disabled-camel',
+    properties: {
+      camelCaseProperty: Boolean,
+      bootedCorrectly: {
+        type: Boolean,
+        value: false
+      }
+    },
+    attached() {
+      if (this.camelCaseProperty) {
+        this.bootedCorrectly = true;
+      }
+    }
+  });
+</script>
+
   <script type="module">
 import '../../lib/mixins/disable-upgrade-mixin.js';
+import {flush} from '../../lib/utils/flush.js';
+import {wrap} from '../../lib/utils/wrap.js';
 suite('disable-upgrade', function() {
   let el;
 
@@ -190,33 +302,65 @@ <h2 id="element">[[prop]]</h2>
     document.body.appendChild(el);
   });
   teardown(function() {
-    document.body.removeChild(el);
+    if (el.parentNode) {
+      document.body.removeChild(el);
+    }
   });
 
   test('elements upgrade as expected with and without `disable-upgrade`', function() {
     assert.ok(el.$.enabledEl.enabled);
     assert.ok(el.$.enabledEl.$.element);
+    assert.ok(el.$.enabledEl.wasConnected);
     assert.equal(el.$.enabledEl.$.element.textContent, 'enabled!');
+    assert.notOk(el.$.disabledEl.wasConnected);
     assert.notOk(el.$.disabledEl.enabled);
+    assert.equal(el.$.disabledEl.default, 'custom');
     assert.notOk(el.$.disabledEl.$);
     assert.notOk(el.$.disabledBoundEl.enabled);
+    assert.equal(el.$.disabledBoundEl.default, 'custom');
+    assert.notOk(el.$.disabledBoundEl.wasConnected);
     assert.notOk(el.$.disabledBoundEl.$);
   });
 
   test('elements upgrade when `disable-upgrade` removed', function() {
     assert.notOk(el.$.disabledEl.enabled);
     assert.notOk(el.$.disabledEl.$);
+    assert.notOk(el.$.disabledEl.wasConnected);
     assert.notOk(el.$.disabledBoundEl.enabled);
     assert.notOk(el.$.disabledBoundEl.$);
+    assert.notOk(el.$.disabledBoundEl.wasConnected);
     el.enable();
     assert.ok(el.$.disabledEl.enabled);
     assert.ok(el.$.disabledEl.$.element);
     assert.equal(el.$.disabledEl.$.element.textContent, 'enabled!');
+    assert.equal(el.$.disabledEl.default, 'custom');
+    assert.ok(el.$.disabledEl.wasConnected);
     assert.ok(el.$.disabledBoundEl.enabled);
+    assert.equal(el.$.disabledBoundEl.default, 'custom');
     assert.ok(el.$.disabledBoundEl.$.element);
+    assert.ok(el.$.disabledBoundEl.wasConnected);
     assert.equal(el.$.disabledBoundEl.$.element.textContent, 'enabled!');
   });
 
+  test('elements do not connect/disconnect when disabled', function() {
+    el.parentNode.removeChild(el);
+    assert.ok(el.$.enabledEl.wasConnected);
+    assert.ok(el.$.enabledEl.wasDisconnected);
+    assert.notOk(el.$.disabledEl.wasConnected);
+    assert.notOk(el.$.disabledEl.wasDisconnected);
+    assert.notOk(el.$.disabledBoundEl.wasConnected);
+    assert.notOk(el.$.disabledBoundEl.wasDisconnected);
+    document.body.appendChild(el);
+    el.enable();
+    assert.ok(el.$.disabledEl.wasConnected);
+    assert.notOk(el.$.disabledEl.wasDisconnected);
+    assert.ok(el.$.disabledBoundEl.wasConnected);
+    assert.notOk(el.$.disabledBoundEl.wasDisconnected);
+    document.body.appendChild(el);
+    assert.ok(el.$.disabledEl.wasDisconnected);
+    assert.ok(el.$.disabledBoundEl.wasDisconnected);
+  });
+
 
 });
 
@@ -244,19 +388,24 @@ <h2 id="element">[[prop]]</h2>
     assert.ok(el.$.enabledEl.hasCreated);
     assert.ok(el.$.enabledEl.enabled);
     assert.ok(el.$.enabledEl.$.element);
+    assert.ok(el.$.enabledEl.wasConnected);
     assert.equal(el.$.enabledEl.$.element.textContent, 'enabled!');
     el.$.enabledEl.fooHandler = sinon.spy();
     el.$.enabledEl.fire('foo');
     assert.equal(el.$.enabledEl.fooHandler.callCount, 1);
     assert.notOk(el.$.disabledEl.hasCreated);
     assert.notOk(el.$.disabledEl.enabled);
+    assert.equal(el.$.disabledEl.default, 'custom');
     assert.notOk(el.$.disabledEl.$);
+    assert.notOk(el.$.disabledEl.wasConnected);
     el.$.disabledEl.fooHandler = sinon.spy();
     el.$.disabledEl.fire('foo');
     assert.equal(el.$.disabledEl.fooHandler.callCount, 0);
     assert.notOk(el.$.disabledBoundEl.hasCreated);
     assert.notOk(el.$.disabledBoundEl.enabled);
+    assert.equal(el.$.disabledBoundEl.default, 'custom');
     assert.notOk(el.$.disabledBoundEl.$);
+    assert.notOk(el.$.disabledBoundEl.wasConnected);
     el.$.disabledBoundEl.fooHandler = sinon.spy();
     el.$.disabledBoundEl.fire('foo');
     assert.equal(el.$.disabledBoundEl.fooHandler.callCount, 0);
@@ -266,22 +415,201 @@ <h2 id="element">[[prop]]</h2>
     el.enable();
     assert.ok(el.$.disabledEl.hasCreated);
     assert.ok(el.$.disabledEl.enabled);
+    assert.equal(el.$.disabledEl.default, 'custom');
     assert.ok(el.$.disabledEl.$.element);
+    assert.ok(el.$.disabledEl.wasConnected);
     assert.equal(el.$.disabledEl.$.element.textContent, 'enabled!');
     el.$.disabledEl.fooHandler = sinon.spy();
     el.$.disabledEl.fire('foo');
     assert.equal(el.$.disabledEl.fooHandler.callCount, 1);
     assert.ok(el.$.disabledBoundEl.hasCreated);
     assert.ok(el.$.disabledBoundEl.enabled);
+    assert.equal(el.$.disabledBoundEl.default, 'custom');
     assert.ok(el.$.disabledBoundEl.$.element);
+    assert.ok(el.$.disabledBoundEl.wasConnected);
     assert.equal(el.$.disabledBoundEl.$.element.textContent, 'enabled!');
     el.$.disabledBoundEl.fooHandler = sinon.spy();
     el.$.disabledBoundEl.fire('foo');
     assert.equal(el.$.disabledBoundEl.fooHandler.callCount, 1);
   });
 
+  test('elements do not connect/disconnect when disabled', function() {
+    el.parentNode.removeChild(el);
+    assert.ok(el.$.enabledEl.wasConnected);
+    assert.ok(el.$.enabledEl.wasDisconnected);
+    assert.notOk(el.$.disabledEl.wasConnected);
+    assert.notOk(el.$.disabledEl.wasDisconnected);
+    assert.notOk(el.$.disabledBoundEl.wasConnected);
+    assert.notOk(el.$.disabledBoundEl.wasDisconnected);
+    document.body.appendChild(el);
+    el.enable();
+    assert.ok(el.$.disabledEl.wasConnected);
+    assert.notOk(el.$.disabledEl.wasDisconnected);
+    assert.ok(el.$.disabledBoundEl.wasConnected);
+    assert.notOk(el.$.disabledBoundEl.wasDisconnected);
+    document.body.appendChild(el);
+    assert.ok(el.$.disabledEl.wasDisconnected);
+    assert.ok(el.$.disabledBoundEl.wasDisconnected);
+  });
 
+  test('elements with camelCase properties initialize correctly after being enabled', function() {
+    const div = document.createElement('div');
+    div.innerHTML = `<x-disabled-camel disable-upgrade camel-case-property></x-disabled-camel>`;
+    const camel = div.querySelector('x-disabled-camel');
+    document.body.appendChild(div);
+    camel.removeAttribute('disable-upgrade');
+    assert.ok(camel.bootedCorrectly);
+  });
+
+});
+
+suite('disable-upgrade-extensions', function() {
+  let el;
+
+  setup(() => {
+    el = document.createElement('disable-upgrade-extensions');
+    document.body.appendChild(el);
+  });
+  teardown(function() {
+    document.body.removeChild(el);
+  });
+
+  test('elements upgrade as expected with and without `disable-upgrade`', function() {
+    assert.ok(el.$.enabledEl1.enabled);
+    assert.ok(el.$.enabledEl1.$.element);
+    assert.ok(el.$.enabledEl1.wasConnected);
+    assert.equal(el.$.enabledEl1.$.element.textContent, 'enabled!');
+    assert.notOk(el.$.disabledEl1.enabled);
+    assert.notOk(el.$.disabledEl1.$);
+    assert.notOk(el.$.disabledEl1.wasConnected);
+    assert.notOk(el.$.disabledBoundEl1.enabled);
+    assert.notOk(el.$.disabledBoundEl1.$);
+    assert.notOk(el.$.disabledBoundEl1.wasConnected);
+
+    assert.ok(el.$.enabledEl2.enabled);
+    assert.ok(el.$.enabledEl2.$.element);
+    assert.ok(el.$.enabledEl2.wasConnected);
+    assert.equal(el.$.enabledEl2.$.element.textContent, 'enabled!');
+    assert.notOk(el.$.disabledEl2.enabled);
+    assert.notOk(el.$.disabledEl2.$);
+    assert.notOk(el.$.disabledEl2.wasConnected);
+    assert.notOk(el.$.disabledBoundEl2.enabled);
+    assert.notOk(el.$.disabledBoundEl2.$);
+    assert.notOk(el.$.disabledBoundEl2.wasConnected);
+
+    assert.ok(el.$.enabledEl3.enabled);
+    assert.ok(el.$.enabledEl3.$.element);
+    assert.ok(el.$.enabledEl3.wasConnected);
+    assert.equal(el.$.enabledEl3.$.element.textContent, 'enabled!');
+    assert.notOk(el.$.disabledEl3.enabled);
+    assert.notOk(el.$.disabledEl3.$);
+    assert.notOk(el.$.disabledEl3.wasConnected);
+    assert.notOk(el.$.disabledBoundEl3.enabled);
+    assert.notOk(el.$.disabledBoundEl3.$);
+    assert.notOk(el.$.disabledBoundEl3.wasConnected);
+  });
+
+  test('elements upgrade when `disable-upgrade` removed', function() {
+    assert.notOk(el.$.disabledEl1.enabled);
+    assert.notOk(el.$.disabledEl1.$);
+    assert.notOk(el.$.disabledEl1.wasConnected);
+    assert.notOk(el.$.disabledBoundEl1.enabled);
+    assert.notOk(el.$.disabledBoundEl1.$);
+    assert.notOk(el.$.disabledBoundEl1.wasConnected);
+
+    assert.notOk(el.$.disabledEl2.enabled);
+    assert.notOk(el.$.disabledEl2.$);
+    assert.notOk(el.$.disabledEl2.wasConnected);
+    assert.notOk(el.$.disabledBoundEl2.enabled);
+    assert.notOk(el.$.disabledBoundEl2.$);
+    assert.notOk(el.$.disabledBoundEl2.wasConnected);
+
+    assert.notOk(el.$.disabledEl3.enabled);
+    assert.notOk(el.$.disabledEl3.$);
+    assert.notOk(el.$.disabledEl3.wasConnected);
+    assert.notOk(el.$.disabledBoundEl3.enabled);
+    assert.notOk(el.$.disabledBoundEl3.$);
+    assert.notOk(el.$.disabledBoundEl3.wasConnected);
+
+    el.enable();
+
+    assert.ok(el.$.disabledEl1.enabled);
+    assert.ok(el.$.disabledEl1.$.element);
+    assert.ok(el.$.disabledEl1.wasConnected);
+    assert.equal(el.$.disabledEl1.$.element.textContent, 'enabled!');
+    assert.ok(el.$.disabledBoundEl1.enabled);
+    assert.ok(el.$.disabledBoundEl1.$.element);
+    assert.ok(el.$.disabledBoundEl1.wasConnected);
+    assert.equal(el.$.disabledBoundEl1.$.element.textContent, 'enabled!');
+
+    assert.ok(el.$.disabledEl2.enabled);
+    assert.ok(el.$.disabledEl2.$.element);
+    assert.ok(el.$.disabledEl2.wasConnected);
+    assert.equal(el.$.disabledEl2.$.element.textContent, 'enabled!');
+    assert.ok(el.$.disabledBoundEl2.enabled);
+    assert.ok(el.$.disabledBoundEl2.$.element);
+    assert.ok(el.$.disabledBoundEl2.wasConnected);
+    assert.equal(el.$.disabledBoundEl2.$.element.textContent, 'enabled!');
+
+    assert.ok(el.$.disabledEl3.enabled);
+    assert.ok(el.$.disabledEl3.$.element);
+    assert.ok(el.$.disabledEl3.wasConnected);
+    assert.equal(el.$.disabledEl3.$.element.textContent, 'enabled!');
+    assert.ok(el.$.disabledBoundEl3.enabled);
+    assert.ok(el.$.disabledBoundEl3.$.element);
+    assert.ok(el.$.disabledBoundEl3.wasConnected);
+    assert.equal(el.$.disabledBoundEl3.$.element.textContent, 'enabled!');
+  });
+});
+
+suite('disable-upgrade-dom-if-repeat', function() {
+  let el;
+
+  setup(() => {
+    el = document.createElement('disable-dom-if-repeat');
+    document.body.appendChild(el);
+    flush();
+  });
+  teardown(function() {
+    document.body.removeChild(el);
+  });
+
+  test('elements upgrade as expected with and without `disable-upgrade` and upgrad when disable-upgrade is removed', function() {
+    const els = Array.from(wrap(el).shadowRoot.querySelectorAll('my-element-legacy'));
+    assert.equal(els.length, 4);
+
+    const checkDisabledEl = (e) => {
+      assert.ok(e.$.enabledEl.enabled);
+      assert.ok(e.$.enabledEl.$.element);
+      assert.ok(e.$.enabledEl.wasConnected);
+      assert.equal(e.$.enabledEl.$.element.textContent, 'enabled!');
+      assert.notOk(e.$.disabledEl.enabled);
+      assert.notOk(e.$.disabledEl.$);
+      assert.notOk(e.$.disabledEl.wasConnected);
+      assert.notOk(e.$.disabledBoundEl.enabled);
+      assert.notOk(e.$.disabledBoundEl.$);
+      assert.notOk(e.$.disabledBoundEl.wasConnected);
+    };
+    // check initial state
+    els.forEach(checkDisabledEl);
+
+    // check state after upgrade
+    el.enable();
+
+    const checkEnabledEl = (e) => {
+      assert.notOk(e.$.disabledEl.enabled);
+      assert.notOk(e.$.disabledEl.$);
+      assert.notOk(e.$.disabledEl.wasConnected);
+      assert.ok(e.$.disabledBoundEl.enabled);
+      assert.ok(e.$.disabledBoundEl.$.element);
+      assert.ok(e.$.disabledBoundEl.wasConnected);
+      assert.equal(e.$.disabledBoundEl.$.element.textContent, 'enabled!');
+    };
+    checkEnabledEl(els[1]);
+    checkEnabledEl(els[3]);
+
+  });
 });
 </script>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/test/unit/dom-if-elements.js b/test/unit/dom-if-elements.js
index 5f851548ca..67ab066ec9 100644
--- a/test/unit/dom-if-elements.js
+++ b/test/unit/dom-if-elements.js
@@ -126,8 +126,14 @@ Polymer({
       <x-foo prop="{{prop1}}"></x-foo>
       <template is="dom-if" id="if-2" if="{{shouldStamp2}}">
         <x-foo prop="{{prop2}}"></x-foo>
-        <template is="dom-if" id="if-3" if="{{shouldStamp3}}">
-          <x-foo prop="{{prop3}}"></x-foo>
+        <template is="dom-if" id="if-3-1" if="{{shouldStamp3_1}}" restamp>
+          <x-foo prop="{{prop3_1}}"></x-foo>
+        </template>
+        <template is="dom-if" id="if-4-2" if="{{shouldStamp3_2}}" restamp>
+          <x-foo prop="{{prop3_2}}"></x-foo>
+        </template>
+        <template is="dom-if" id="if-5-3" if="{{shouldStamp3_3}}" restamp>
+          <x-foo prop="{{prop3_3}}"></x-foo>
         </template>
       </template>
     </template>
@@ -142,8 +148,14 @@ Polymer({
     prop2: {
       value: 'prop2'
     },
-    prop3: {
-      value: 'prop3'
+    prop3_1: {
+      value: 'prop3_1'
+    },
+    prop3_2: {
+      value: 'prop3_2'
+    },
+    prop3_3: {
+      value: 'prop3_3'
     },
     item: {
       value: function() { return {prop: 'outerItem'}; }
@@ -301,9 +313,27 @@ Polymer({
     return val;
   }
 });
+
+Polymer({
+  is: 'prop-observer',
+  properties: {
+    prop: {
+      observer: 'propChanged'
+    }
+  },
+  observers: ['pathChanged(obj.*)'],
+  created() {
+    this.propChanged = sinon.spy();
+    this.pathChanged = sinon.spy();
+  }
+});
+
 Polymer({
   _template: html`
-    <template is="dom-if" if="{{b}}" restamp="{{restamp}}">{{guarded(a)}}</template>
+    <template is="dom-if" if="{{b}}" restamp="{{restamp}}">
+      {{guarded(a)}}
+      <prop-observer id="observer" prop="[[c.d]]" obj="[[c]]"></prop-observer>
+    </template>
 `,
 
   is: 'x-guard-separate-props',
diff --git a/test/unit/dom-if.html b/test/unit/dom-if.html
index bdb1935b2b..a12dc689cc 100644
--- a/test/unit/dom-if.html
+++ b/test/unit/dom-if.html
@@ -14,6 +14,11 @@
   <script src="../../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
   <script src="wct-browser-config.js"></script>
   <script src="../../node_modules/wct-browser-legacy/browser.js"></script>
+  <script type="module">
+    import { setRemoveNestedTemplates, setFastDomIf } from '../../lib/utils/settings.js';
+    setRemoveNestedTemplates(location.search.match(/removeNestedTemplates/));
+    setFastDomIf(location.search.match(/fastDomIf/));
+  </script>
   <script type="module" src="../../polymer-legacy.js"></script>
   <script type="module" src="./dom-if-elements.js"></script>
 </head>
@@ -173,71 +178,134 @@
     assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
   });
 
-  test('show 3', function() {
-    individual.shouldStamp3 = true;
+  test('show 3-1', function() {
+    individual.shouldStamp3_1 = true;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
     assert.equal(stamped.length, 3, 'total stamped count incorrect');
     assert.equal(stamped[0].prop, 'prop1');
     assert.equal(stamped[1].prop, 'prop2');
-    assert.equal(stamped[2].prop, 'prop3');
+    assert.equal(stamped[2].prop, 'prop3_1');
     assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3 display wrong');
+    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3-1 display wrong');
   });
 
-  test('hide 3', function() {
-    individual.shouldStamp3 = false;
+  test('show 3-2', function() {
+    individual.shouldStamp3_2 = true;
+    individual.render();
+    let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
+    assert.equal(stamped.length, 4, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
+    assert.equal(stamped[2].prop, 'prop3_1');
+    assert.equal(stamped[3].prop, 'prop3_2');
+    assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
+    assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
+    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3-1 display wrong');
+    assert.equal(getComputedStyle(stamped[3]).display, 'inline', 'stamped 3-2 display wrong');
+  });
+
+  test('remove 3-2', function() {
+    individual.shouldStamp3_2 = false;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
     assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
+    assert.equal(stamped[2].prop, 'prop3_1');
+    assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
+    assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
+    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3-1 display wrong');
+  });
+
+  test('show 3-3', function() {
+    individual.shouldStamp3_3 = true;
+    individual.render();
+    let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
+    assert.equal(stamped.length, 4, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
+    assert.equal(stamped[2].prop, 'prop3_1');
+    assert.equal(stamped[3].prop, 'prop3_3');
+    assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
+    assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
+    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3-1 display wrong');
+    assert.equal(getComputedStyle(stamped[3]).display, 'inline', 'stamped 3-3 display wrong');
+  });
+
+  test('update 3-3', function() {
+    individual.prop3_3 = 'prop3_3*';
+    let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
+    assert.equal(stamped.length, 4, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
+    assert.equal(stamped[2].prop, 'prop3_1');
+    assert.equal(stamped[3].prop, 'prop3_3*');
+  });
+
+  test('remove 3-3', function() {
+    individual.shouldStamp3_3 = false;
+    individual.render();
+    let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
+    assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
+    assert.equal(stamped[2].prop, 'prop3_1');
+    assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
+    assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
+    assert.equal(getComputedStyle(stamped[2]).display, 'inline', 'stamped 3-1 display wrong');
+  });
+
+  test('remove 3', function() {
+    individual.shouldStamp3_1 = false;
+    individual.render();
+    let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
+    assert.equal(stamped.length, 2, 'total stamped count incorrect');
+    assert.equal(stamped[0].prop, 'prop1');
+    assert.equal(stamped[1].prop, 'prop2');
     assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'none', 'stamped 3 display wrong');
   });
 
   test('hide 2', function() {
     individual.shouldStamp2 = false;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
-    assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped.length, 2, 'total stamped count incorrect');
     assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'none', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'none', 'stamped 3 display wrong');
   });
 
   test('hide 1', function() {
     individual.shouldStamp1 = false;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
-    assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped.length, 2, 'total stamped count incorrect');
     assert.equal(getComputedStyle(stamped[0]).display, 'none', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'none', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'none', 'stamped 3 display wrong');
   });
 
   test('show 1', function() {
     individual.shouldStamp1 = true;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
-    assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped.length, 2, 'total stamped count incorrect');
     assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'none', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'none', 'stamped 3 display wrong');
   });
 
   test('show 2', function() {
     individual.shouldStamp2 = true;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
-    assert.equal(stamped.length, 3, 'total stamped count incorrect');
+    assert.equal(stamped.length, 2, 'total stamped count incorrect');
     assert.equal(getComputedStyle(stamped[0]).display, 'inline', 'stamped 1 display wrong');
     assert.equal(getComputedStyle(stamped[1]).display, 'inline', 'stamped 2 display wrong');
-    assert.equal(getComputedStyle(stamped[2]).display, 'none', 'stamped 3 display wrong');
   });
 
   test('show 3', function() {
-    individual.shouldStamp3 = true;
+    individual.shouldStamp3_1 = true;
     individual.render();
     let stamped = individual.shadowRoot.querySelectorAll('*:not(template):not(dom-if):not(span)');
     assert.equal(stamped.length, 3, 'total stamped count incorrect');
@@ -867,18 +935,53 @@
       let el = document.createElement('x-guard-separate-props');
       el.restamp = restamp;
       document.body.appendChild(el);
-      el.a = 'ok';
       el.b = true;
       flush();
+      el.a = 'ok';
+      el.c = {d: 'ok'};
       assert.equal(el.shadowRoot.textContent.trim(), 'ok');
+      let observer = el.shadowRoot.querySelector('#observer');
+      assert.equal(observer.propChanged.callCount, 1);
+      assert.equal(observer.pathChanged.callCount, 1);
+      assert.equal(observer.pathChanged.getCalls()[0].args[0].path, 'obj');
       el.b = false;
       el.a = 'notok';
+      el.set('c.d', 'notok');
       flush();
       assert.equal(el.shadowRoot.textContent.trim(), '');
+      if (!restamp) {
+        const observer = el.shadowRoot.querySelector('#observer');
+        assert.equal(observer.propChanged.callCount, 1);
+        assert.equal(observer.pathChanged.callCount, 1);
+      }
+      el.set('c.d', 'changed');
       el.a = 'changed';
       el.b = true;
       flush();
       assert.equal(el.shadowRoot.textContent.trim(), 'changed');
+      observer = el.shadowRoot.querySelector('#observer');
+      // Note that path bindings in a falsey dom-if will be updated when the
+      // dom-if becomes truthy, however path notifications to other elements
+      // will be lost; this is a fundamental limitation (#4818) due to the fact
+      // that batched path notifications are not supported. Hence the
+      // `propChanged` count increments, but the `pathChanged` count does not.
+      assert.equal(observer.propChanged.callCount, restamp ? 1 : 2);
+      assert.equal(observer.pathChanged.callCount, 1);
+      document.body.removeChild(el);
+    });
+
+    test('host properties in sync toggling true-false-true synchronously', function() {
+      let el = document.createElement('x-guard-separate-props');
+      el.restamp = restamp;
+      document.body.appendChild(el);
+      el.a = 'initial';
+      el.b = true;
+      flush();
+      assert.equal(el.shadowRoot.textContent.trim(), 'initial');
+      el.setProperties({b: false, a: 'changed'});
+      el.b = true;
+      flush();
+      assert.equal(el.shadowRoot.textContent.trim(), 'changed');
       document.body.removeChild(el);
     });
 
diff --git a/test/unit/dom-repeat-elements.js b/test/unit/dom-repeat-elements.js
index 8b836da510..9455a89910 100644
--- a/test/unit/dom-repeat-elements.js
+++ b/test/unit/dom-repeat-elements.js
@@ -434,7 +434,7 @@ Polymer({
 });
 Polymer({
   _template: html`
-    <template id="repeater" is="dom-repeat" items="{{items}}" initial-count="10">
+    <template id="repeater" is="dom-repeat" items="{{items}}" initial-count="10" target-framerate="25">
       <x-wait>{{item.prop}}</x-wait>
     </template>
 `,
@@ -464,9 +464,9 @@ Polymer({
 Polymer({
   _template: html`
     <template is="dom-repeat" items="{{items}}" id="outer">
-      <template is="dom-if" if="">
+      <template is="dom-if" if="" name="outerIf">
         <template is="dom-repeat" items="{{item.items}}" id="inner">
-          <template is="dom-if" if="">
+          <template is="dom-if" if="" name="innerIf">
             <button on-click="handleClick">{{item.prop}}</button>
           </template>
         </template>
diff --git a/test/unit/dom-repeat.html b/test/unit/dom-repeat.html
index 1a8d10f9dd..119149d412 100644
--- a/test/unit/dom-repeat.html
+++ b/test/unit/dom-repeat.html
@@ -14,6 +14,10 @@
   <script src="../../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
   <script src="wct-browser-config.js"></script>
   <script src="../../node_modules/wct-browser-legacy/browser.js"></script>
+  <script type="module">
+    import { setRemoveNestedTemplates } from '../../lib/utils/settings.js';
+    setRemoveNestedTemplates(location.search.match(/removeNestedTemplates/));
+  </script>
   <script type="module" src="../../polymer-legacy.js"></script>
   <script type="module" src="./dom-repeat-elements.js"></script>
   <style>
@@ -108,7 +112,6 @@ <h4>inDocumentRepeater</h4>
     </dom-repeat>
   </div>
 
-
   <test-fixture id="primitiveLarge">
     <template>
       <x-primitive-large></x-primitive-large>
@@ -118,9 +121,6 @@ <h4>inDocumentRepeater</h4>
   <h4>x-repeat-limit</h4>
   <x-repeat-limit id="limited"></x-repeat-limit>
 
-  <h4>x-repeat-chunked</h4>
-  <x-repeat-chunked id="chunked"></x-repeat-chunked>
-
   <div id="inDocumentContainer">
   </div>
 
@@ -138,7 +138,7 @@ <h4>x-repeat-chunked</h4>
 import './dom-repeat-elements.js';
 import { flush } from '../../lib/utils/flush.js';
 import { calculateSplices } from '../../lib/utils/array-splice.js';
-/* global limited inDocumentRepeater inDocumentContainer inDocumentContainerOrig chunked nonUpgrade*/
+/* global limited inDocumentRepeater inDocumentContainer inDocumentContainerOrig nonUpgrade*/
 
 /*
   Expected:
@@ -3659,492 +3659,607 @@ <h4>x-repeat-chunked</h4>
 
 suite('limit', function() {
 
-  var checkItemOrder = function(stamped) {
-    for (var i=0; i<stamped.length; i++) {
-      assert.equal(parseInt(stamped[i].textContent), i);
-    }
-  };
+  // These tests verify correct operation of e.g. path notifications for a
+  // pertially rendered list; it does this by monkey-patching the internal
+  // `__calculateLimit` method to force the list to a certain length.
+  // While they rely on some internal implementation details, the tests are
+  // done this way because getting the list in a certain known state
+  // during live chunking is tricky due to the feedback-based throttling.
 
-  test('initial limit', function() {
-    limited.items = limited.preppedItems;
-    limited.$.repeater.__limit = 2;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 2);
-    checkItemOrder(stamped);
-  });
-
-  test('change item paths in & out of limit', function() {
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    limited.outerProp = {prop: 'changed'};
-    assert.equal(stamped[0].prop, 'changed');
-    limited.set('items.0.prop', '0-changed');
-    limited.set('items.3.prop', '3-changed');
-    assert.equal(stamped[0].textContent, '0-changed');
-    limited.set('outerProp.prop', 'changed again');
-    assert.equal(stamped[0].prop, 'changed again');
-  });
-
-  test('increase limit', function() {
-    // Increase limit
-    limited.$.repeater.__limit = 10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
-    checkItemOrder(stamped);
-    assert.equal(stamped[3].prop, 'changed again');
-    assert.equal(stamped[3].textContent, '3-changed');
-    limited.set('items.0.prop', 0);
-    limited.set('items.3.prop', 3);
-    // Increase limit
-    limited.$.repeater.__limit = 20;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 20);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit above items.length', function() {
-    limited.$.repeater.__limit = 30;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 20);
-    checkItemOrder(stamped);
-  });
-
-  test('decrease limit', function() {
-    // Decrease limit
-    limited.$.repeater.__limit = 15;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 15);
-    checkItemOrder(stamped);
-    // Decrease limit
-    limited.$.repeater.__limit = 0;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
+  suiteSetup(() => {
+    limited.$.repeater.__calculateLimit = function() {
+      return this.__limit;
+    };
   });
 
-  test('negative limit', function() {
-    limited.$.repeater.__limit = -10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+  suite('basic', function() {
 
-});
+    var checkItemOrder = function(stamped) {
+      for (var i=0; i<stamped.length; i++) {
+        assert.equal(parseInt(stamped[i].textContent), i);
+      }
+    };
 
-suite('limit with sort', function() {
+    test('initial limit', function() {
+      limited.items = limited.preppedItems;
+      limited.$.repeater.__limit = 2;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 2);
+      checkItemOrder(stamped);
+    });
 
-  var checkItemOrder = function(stamped) {
-    for (var i=0; i<stamped.length; i++) {
-      assert.equal(stamped[i].textContent, 19 - i);
-    }
-  };
+    test('change item paths in & out of limit', function() {
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      limited.outerProp = {prop: 'changed'};
+      assert.equal(stamped[0].prop, 'changed');
+      limited.set('items.0.prop', '0-changed');
+      limited.set('items.3.prop', '3-changed');
+      assert.equal(stamped[0].textContent, '0-changed');
+      limited.set('outerProp.prop', 'changed again');
+      assert.equal(stamped[0].prop, 'changed again');
+    });
 
-  test('initial limit', function() {
-    limited.$.repeater.__limit = 2;
-    limited.$.repeater.sort = function(a, b) {
-      return b.prop - a.prop;
-    };
-    limited.items = null;
-    limited.$.repeater.render();
-    limited.items = limited.preppedItems;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 2);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit', function() {
-    // Increase limit
-    limited.$.repeater.__limit = 10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
-    checkItemOrder(stamped);
-    // Increase limit
-    limited.$.repeater.__limit = 20;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 20);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit above items.length', function() {
-    limited.$.repeater.__limit = 30;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 20);
-    checkItemOrder(stamped);
-  });
-
-  test('decrease limit', function() {
-    // Decrease limit
-    limited.$.repeater.__limit = 15;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 15);
-    checkItemOrder(stamped);
-    // Decrease limit
-    limited.$.repeater.__limit = 0;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+    test('increase limit', function() {
+      // Increase limit
+      limited.$.repeater.__limit = 10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 10);
+      checkItemOrder(stamped);
+      assert.equal(stamped[3].prop, 'changed again');
+      assert.equal(stamped[3].textContent, '3-changed');
+      limited.set('items.0.prop', 0);
+      limited.set('items.3.prop', 3);
+      // Increase limit
+      limited.$.repeater.__limit = 20;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 20);
+      checkItemOrder(stamped);
+    });
 
-  test('negative limit', function() {
-    limited.$.repeater.__limit = -10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+    test('decrease limit', function() {
+      // Decrease limit
+      limited.$.repeater.__limit = 15;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 15);
+      checkItemOrder(stamped);
+      // Decrease limit
+      limited.$.repeater.__limit = 0;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-});
+    test('negative limit', function() {
+      limited.$.repeater.__limit = -10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-suite('limit with filter', function() {
+  });
 
-  var checkItemOrder = function(stamped) {
-    for (var i=0; i<stamped.length; i++) {
-      assert.equal(stamped[i].textContent, i * 2);
-    }
-  };
+  suite('limit with sort', function() {
 
-  test('initial limit', function() {
-    var items = limited.items;
-    limited.$.repeater.__limit = 2;
-    limited.$.repeater.sort = null;
-    limited.$.repeater.filter = function(a) {
-      return (a.prop % 2) === 0;
+    var checkItemOrder = function(stamped) {
+      for (var i=0; i<stamped.length; i++) {
+        assert.equal(stamped[i].textContent, 19 - i);
+      }
     };
-    limited.items = null;
-    limited.$.repeater.render();
-    limited.items = items;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 2);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit', function() {
-    // Increase limit
-    limited.$.repeater.__limit = 5;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 5);
-    checkItemOrder(stamped);
-    // Increase limit
-    limited.$.repeater.__limit = 10;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit above items.length', function() {
-    limited.$.repeater.__limit = 30;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
+
+    test('initial limit', function() {
+      limited.$.repeater.__limit = 2;
+      limited.$.repeater.sort = function(a, b) {
+        return b.prop - a.prop;
+      };
+      limited.items = null;
+      limited.$.repeater.render();
+      limited.items = limited.preppedItems;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 2);
       checkItemOrder(stamped);
-  });
+    });
 
-  test('decrease limit', function() {
-    // Decrease limit
-    limited.$.repeater.__limit = 5;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 5);
-    checkItemOrder(stamped);
-    // Decrease limit
-    limited.$.repeater.__limit = 0;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+    test('increase limit', function() {
+      // Increase limit
+      limited.$.repeater.__limit = 10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 10);
+      checkItemOrder(stamped);
+      // Increase limit
+      limited.$.repeater.__limit = 20;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 20);
+      checkItemOrder(stamped);
+    });
 
-  test('negative limit', function() {
-    limited.$.repeater.__limit = -10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+    test('decrease limit', function() {
+      // Decrease limit
+      limited.$.repeater.__limit = 15;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 15);
+      checkItemOrder(stamped);
+      // Decrease limit
+      limited.$.repeater.__limit = 0;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-});
+    test('negative limit', function() {
+      limited.$.repeater.__limit = -10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-suite('limit with sort & filter', function() {
+  });
 
-  var checkItemOrder = function(stamped) {
-    for (var i=0; i<stamped.length; i++) {
-      assert.equal(stamped[i].textContent, (9 - i) * 2);
-    }
-  };
+  suite('limit with filter', function() {
 
-  test('initial limit', function() {
-    var items = limited.items;
-    limited.$.repeater.__limit = 2;
-    limited.$.repeater.sort = function(a, b) {
-      return b.prop - a.prop;
-    };
-    limited.$.repeater.filter = function(a) {
-      return (a.prop % 2) === 0;
+    var checkItemOrder = function(stamped) {
+      for (var i=0; i<stamped.length; i++) {
+        assert.equal(stamped[i].textContent, i * 2);
+      }
     };
-    limited.items = null;
-    limited.$.repeater.render();
-    limited.items = items;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 2);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit', function() {
-    // Increase limit
-    limited.$.repeater.__limit = 5;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 5);
-    checkItemOrder(stamped);
-    // Increase limit
-    limited.$.repeater.__limit = 10;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
-    checkItemOrder(stamped);
-  });
-
-  test('increase limit above items.length', function() {
-    limited.$.repeater.__limit = 30;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 10);
-    checkItemOrder(stamped);
-  });
-
-  test('decrease limit', function() {
-    // Decrease limit
-    limited.$.repeater.__limit = 5;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 5);
-    checkItemOrder(stamped);
-    // Decrease limit
-    limited.$.repeater.__limit = 0;
-    limited.$.repeater.render();
-    stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
 
-  test('negative limit', function() {
-    limited.$.repeater.__limit = -10;
-    limited.$.repeater.render();
-    var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
-    assert.equal(stamped.length, 0);
-  });
+    test('initial limit', function() {
+      var items = limited.items;
+      limited.$.repeater.__limit = 2;
+      limited.$.repeater.sort = null;
+      limited.$.repeater.filter = function(a) {
+        return (a.prop % 2) === 0;
+      };
+      limited.items = null;
+      limited.$.repeater.render();
+      limited.items = items;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 2);
+      checkItemOrder(stamped);
+    });
 
-});
+    test('increase limit', function() {
+      // Increase limit
+      limited.$.repeater.__limit = 5;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 5);
+      checkItemOrder(stamped);
+      // Increase limit
+      limited.$.repeater.__limit = 10;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 10);
+      checkItemOrder(stamped);
+    });
 
-// TODO(kschaaf): This test suite has proven to be flaky only on IE, only
-// on CI (Sauce) presumably because of rAF handling in the CI environment
-// disabling for IE for now to avoid Polymer tests being flaky
-if (!/Trident/.test(navigator.userAgent)) {
+    test('decrease limit', function() {
+      // Decrease limit
+      limited.$.repeater.__limit = 5;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 5);
+      checkItemOrder(stamped);
+      // Decrease limit
+      limited.$.repeater.__limit = 0;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-  // TODO(kschaaf): We're experiencing more flakiness on Safari on CI,
-  // for now, skip these tests and revisit
-  suite.skip('chunked rendering', function() {
+    test('negative limit', function() {
+      limited.$.repeater.__limit = -10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-    test('basic chunked rendering', function(done) {
+  });
 
-      var checkItemOrder = function(stamped) {
-        for (var i=0; i<stamped.length; i++) {
-          assert.equal(stamped[i].textContent, i);
-        }
-      };
+  suite('limit with sort & filter', function() {
 
-      var lastLength = 0;
-      var checkCount = function() {
-        var stamped = chunked.root.querySelectorAll('*:not(template):not(dom-repeat)');
-        checkItemOrder(stamped);
-        if (stamped.length && lastLength === 0) {
-          // Initial rendering of initial count
-          assert.equal(stamped.length, 10);
-        } else {
-          // Remaining rendering increments
-          assert.isTrue(stamped.length > lastLength);
-        }
-        if (stamped.length < 100) {
-          lastLength = stamped.length;
-          checkUntilComplete();
-        } else {
-          // Final rendering at exact item count
-          assert.equal(stamped.length, 100);
-          done();
-        }
+    var checkItemOrder = function(stamped) {
+      for (var i=0; i<stamped.length; i++) {
+        assert.equal(stamped[i].textContent, (9 - i) * 2);
+      }
+    };
+
+    test('initial limit', function() {
+      var items = limited.items;
+      limited.$.repeater.__limit = 2;
+      limited.$.repeater.sort = function(a, b) {
+        return b.prop - a.prop;
       };
-      var checkUntilComplete = function() {
-        // On polyfilled MO, need to wait one setTimeout before rAF
-        if (MutationObserver._isPolyfilled) {
-          setTimeout(function() {
-            requestAnimationFrame(checkCount);
-          });
-        } else {
-          requestAnimationFrame(checkCount);
-        }
+      limited.$.repeater.filter = function(a) {
+        return (a.prop % 2) === 0;
       };
+      limited.items = null;
+      limited.$.repeater.render();
+      limited.items = items;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 2);
+      checkItemOrder(stamped);
+    });
 
-      chunked.items = chunked.preppedItems.slice();
-      checkUntilComplete();
+    test('increase limit', function() {
+      // Increase limit
+      limited.$.repeater.__limit = 5;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 5);
+      checkItemOrder(stamped);
+      // Increase limit
+      limited.$.repeater.__limit = 10;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 10);
+      checkItemOrder(stamped);
+    });
 
+    test('decrease limit', function() {
+      // Decrease limit
+      limited.$.repeater.__limit = 5;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 5);
+      checkItemOrder(stamped);
+      // Decrease limit
+      limited.$.repeater.__limit = 0;
+      limited.$.repeater.render();
+      stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
     });
 
-    test('mutations during chunked rendering', function(done) {
+    test('negative limit', function() {
+      limited.$.repeater.__limit = -10;
+      limited.$.repeater.render();
+      var stamped = limited.root.querySelectorAll('*:not(template):not(dom-repeat)');
+      assert.equal(stamped.length, 0);
+    });
 
-      var checkItemOrder = function(stamped) {
-        var last = -1;
-        for (var i=0; i<stamped.length; i++) {
-          var curr = parseFloat(stamped[i].textContent);
-          assert.isTrue(curr > last);
-          last = curr;
-        }
-      };
+  });
 
-      var mutateArray = function(repeater, renderedCount) {
-        // The goal here is to remove & add some, and do it over
-        // the threshold of where we have currently rendered items, and
-        // ensure that the prop values of the newly inserted items are in
-        // ascending order so we can do a simple check in checkItemOrder
-        var overlap = 2;
-        var remove = 4;
-        var add = 6;
-        var start = renderedCount.length - overlap;
-        if (start + add < repeater.items.length) {
-          var end = start + remove;
-          var args = ['items', start, remove];
-          var startVal = repeater.items[start].prop;
-          var endVal = repeater.items[end].prop;
-          var delta = (endVal - startVal) / add;
-          for (var i=0; i<add; i++) {
-            args.push({prop: startVal + i*delta});
-          }
-          repeater.splice.apply(repeater, args);
-        }
-      };
+});
 
-      var lastLength = 0;
-      var mutateCount = 5;
-      var checkCount = function() {
-        var stamped = chunked.root.querySelectorAll('*:not(template):not(dom-repeat)');
-        checkItemOrder(stamped);
-        if (stamped.length && lastLength === 0) {
-          // Initial rendering of initial count
-          assert.equal(stamped.length, 10);
-        } else {
-          // Remaining rendering increments
-          assert.isTrue(stamped.length > lastLength);
-        }
-        if (stamped.length < chunked.items.length) {
-          if (mutateCount-- > 0) {
-            mutateArray(chunked, stamped);
-          }
-          lastLength = stamped.length;
-          checkUntilComplete();
-        } else {
-          // Final rendering at exact item count
-          assert.equal(stamped.length, chunked.items.length);
-          done();
-        }
-      };
-      var checkUntilComplete = function() {
-        // On polyfilled MO, need to wait one setTimeout before rAF
-        if (MutationObserver._isPolyfilled) {
-          setTimeout(function() {
-            requestAnimationFrame(checkCount);
-          });
-        } else {
-          requestAnimationFrame(checkCount);
-        }
-      };
+suite('chunked rendering', function() {
+
+  let chunked;
+  let resolve;
+  let targetCount;
+  const handleChange = () => {
+    if (!targetCount || chunked.$.repeater.renderedItemCount >= targetCount) {
+      resolve(Array.from(chunked.root.querySelectorAll('*:not(template):not(dom-repeat)')));
+    }
+  };
+  const waitUntilRendered = async (count) => {
+    targetCount = count;
+    return await new Promise(r => resolve = r);
+  };
+  setup(() => {
+    chunked = document.createElement('x-repeat-chunked');
+    chunked.addEventListener('dom-change', handleChange);
+    document.body.appendChild(chunked);
+  });
+  teardown(() => {
+    chunked.removeEventListener('dom-change', handleChange);
+    document.body.removeChild(chunked);
+    chunked = null;
+  });
 
-      chunked.items = chunked.preppedItems.slice();
-      checkUntilComplete();
+  // Framerate=25, element cost = 4ms: should never make more than
+  // (1000/25) / 4 = 10 elements per frame
+  const MAX_PER_FRAME = (1000 / 25) / 4;
 
-    });
+  test('basic chunked rendering', async () => {
 
+    var checkItemOrder = function(stamped) {
+      for (var i=0; i<stamped.length; i++) {
+        assert.equal(stamped[i].textContent, i);
+      }
+    };
 
-    test('mutations during chunked rendering, sort & filtered', function(done) {
+    // Set items to chunk
+    chunked.items = chunked.preppedItems.slice();
 
-      var checkItemOrder = function(stamped) {
-        var last = Infinity;
-        for (var i=0; i<stamped.length; i++) {
-          var curr = parseFloat(stamped[i].textContent);
-          assert.isTrue(curr <= last);
-          assert.strictEqual(curr % 2, 0);
-          last = curr;
-        }
-      };
+    let stamped = [];
+    let lastStamped;
+    let frameCount = 0;
+    // Loop until chunking is complete
+    while (stamped.length < chunked.items.length) {
+      frameCount++;
+      stamped = await waitUntilRendered();
+      checkItemOrder(stamped);
+      if (!lastStamped) {
+        // Initial rendering of initial count
+        assert.equal(stamped.length, 10);
+      } else {
+        // Remaining rendering increments
+        assert.isTrue(stamped.length > lastStamped.length,
+          'list instance count should increase each frame');
+        assert.deepEqual(lastStamped, stamped.slice(0, lastStamped.length),
+          'list should not re-render instances during mutation');
+        assert.isAtMost((stamped.length - lastStamped.length), MAX_PER_FRAME,
+          `list should not render more than ${MAX_PER_FRAME} per frame`);
+      }
+      lastStamped = stamped;
+    }
+    // Final rendering at exact item count
+    assert.equal(stamped.length, 100, 'final count wrong');
+    assert.isAtLeast(frameCount, 10, 'should have taken at least 10 frames to render');
+    
+    // Set less than initial count, should trim list in one frame
+    chunked.items = chunked.preppedItems.slice(0, 5);
+    stamped = await waitUntilRendered();
+    assert.equal(stamped.length, 5, 'final count wrong');
+    assert.deepEqual(lastStamped.slice(0, stamped.length), stamped,
+      'list should not re-render instances during mutation');
+    lastStamped = stamped;
+
+    // Set at initial count, should render in one frame
+    chunked.items = chunked.preppedItems.slice(0, 10);
+    stamped = await waitUntilRendered();
+    assert.equal(stamped.length, 10, 'final count wrong');
+    assert.deepEqual(lastStamped, stamped.slice(0, lastStamped.length),
+      'list should not re-render instances during mutation');
+    lastStamped = stamped;
+
+    // Set over initial count, should render in more than one frame
+    chunked.items = chunked.preppedItems.slice(0, 10 + MAX_PER_FRAME * 2);
+    stamped = await waitUntilRendered();
+    assert.deepEqual(lastStamped, stamped.slice(0, 10),
+      'list should not re-render instances during mutation');
+    frameCount = 0;
+    while (stamped.length < chunked.items.length) {
+      stamped = await waitUntilRendered();
+      frameCount++;
+    }
+    assert.isAtLeast(frameCount, 2, 'should have taken at least 2 frames to render');
+    assert.equal(stamped.length, chunked.items.length, 'final count wrong');
+
+  });
 
-      var mutateArray = function(repeater, stamped) {
-        var start = parseInt(stamped[0].textContent);
-        var end = parseInt(stamped[stamped.length-1].textContent);
-        var mid = (end-start)/2;
-        for (var i=0; i<5; i++) {
-          chunked.push('items', {prop: mid + 1});
+  test('mutations during chunked rendering', async () => {
+
+    var checkItemOrder = function(stamped) {
+      var last = -1;
+      for (var i=0; i<stamped.length; i++) {
+        var curr = parseFloat(stamped[i].textContent);
+        assert.isTrue(curr > last);
+        last = curr;
+      }
+    };
+
+    var mutateArray = function(repeater, renderedCount) {
+      // The goal here is to remove & add some, and do it over
+      // the threshold of where we have currently rendered items, and
+      // ensure that the prop values of the newly inserted items are in
+      // ascending order so we can do a simple check in checkItemOrder
+      var overlap = 2;
+      var remove = 4;
+      var add = 6;
+      var start = renderedCount.length - overlap;
+      if (start + add < repeater.items.length) {
+        var end = start + remove;
+        var args = ['items', start, remove];
+        var startVal = repeater.items[start].prop;
+        var endVal = repeater.items[end].prop;
+        var delta = (endVal - startVal) / add;
+        for (var i=0; i<add; i++) {
+          args.push({prop: startVal + i*delta});
         }
-        chunked.splice('items', Math.round(stamped.length/2), 3);
-      };
+        repeater.splice.apply(repeater, args);
+      }
+    };
+
+    // Set items to chunk
+    chunked.items = chunked.preppedItems.slice();
 
-      var lastLength = 0;
-      var mutateCount = 5;
-      var checkCount = function() {
-        var stamped = chunked.root.querySelectorAll('*:not(template):not(dom-repeat)');
-        checkItemOrder(stamped);
-        var filteredLength = chunked.items.filter(chunked.$.repeater.filter).length;
-        if (stamped.length && lastLength === 0) {
-          // Initial rendering of initial count
-          assert.equal(stamped.length, 10);
-        } else {
-          // Remaining rendering increments
-          if (stamped.length < filteredLength) {
-            assert.isTrue(stamped.length > lastLength);
+    let stamped = [];
+    let lastStamped;
+    let frameCount = 0;
+    // Loop until chunking is complete
+    while (stamped.length < chunked.items.length) {
+      stamped = await waitUntilRendered();
+      checkItemOrder(stamped);
+      if (!lastStamped) {
+        // Initial rendering of initial count
+        assert.equal(stamped.length, 10);
+      } else {
+        // Remaining rendering increments
+        assert.isTrue(stamped.length > lastStamped.length,
+          'list instance count should increase each frame');
+        assert.deepEqual(lastStamped, stamped.slice(0, lastStamped.length),
+          'list should not re-render instances during mutation');
+        assert.isAtMost((stamped.length - lastStamped.length), MAX_PER_FRAME,
+          `list should not render more than ${MAX_PER_FRAME} per frame`);
+      }
+      if (stamped.length < chunked.items.length && frameCount < 5) {
+        mutateArray(chunked, stamped);
+      }
+      lastStamped = stamped;
+      frameCount++;
+    }
+    // Final rendering at exact item count
+    assert.equal(stamped.length, chunked.items.length, 'final count wrong');
+    assert.isAtLeast(frameCount, 10, 'should have taken at least 10 frames to render');
+
+  });
+
+
+  test('mutations during chunked rendering, sort & filtered', async () => {
+
+    var checkItemOrder = function(stamped) {
+      var last = Infinity;
+      for (var i=0; i<stamped.length; i++) {
+        var curr = parseFloat(stamped[i].textContent);
+        assert.isTrue(curr <= last);
+        assert.strictEqual(curr % 2, 0);
+        last = curr;
+      }
+    };
+
+    var mutateArray = function(repeater, stamped) {
+      var start = parseInt(stamped[0].textContent);
+      var end = parseInt(stamped[stamped.length-1].textContent);
+      var mid = (end-start)/2;
+      for (var i=0; i<5; i++) {
+        chunked.push('items', {prop: mid + 1});
+      }
+      chunked.splice('items', Math.round(stamped.length/2), 3);
+    };
+
+    // Set items to chunk
+    chunked.$.repeater.sort = function(a, b) {
+      return b.prop - a.prop;
+    };
+    chunked.$.repeater.filter = function(a) {
+      return (a.prop % 2) === 0;
+    };
+    chunked.items = chunked.preppedItems.slice();
+
+    let stamped = [];
+    let lastStamped;
+    let frameCount = 0;
+    let filteredLength = chunked.items.filter(chunked.$.repeater.filter).length;
+    // Loop until chunking is complete
+    while (stamped.length < filteredLength) {
+      stamped = await waitUntilRendered();
+      checkItemOrder(stamped);
+      if (!lastStamped) {
+        // Initial rendering of initial count
+        assert.equal(stamped.length, 10);
+      } else {
+        // Remaining rendering increments
+        assert.isTrue(stamped.length > lastStamped.length,
+          'list instance count should increase each frame');
+        assert.deepEqual(lastStamped, stamped.slice(0, lastStamped.length),
+          'list should not re-render instances during mutation');
+        assert.isAtMost((stamped.length - lastStamped.length), MAX_PER_FRAME,
+          `list should not render more than ${MAX_PER_FRAME} per frame`);
+      }
+      if (stamped.length < chunked.items.length && frameCount < 4) {
+        mutateArray(chunked, stamped);
+        filteredLength = chunked.items.filter(chunked.$.repeater.filter).length;
+      }
+      lastStamped = stamped;
+      frameCount++;
+    }
+    // Final rendering at exact item count
+    assert.equal(stamped.length, filteredLength, 'final count wrong');
+    assert.isAtLeast(frameCount, 5, 'should have taken at least 5 frames to render');
+  });
+
+  suite('resetting items array', () => {
+
+    [false, true].forEach(reuse => {
+
+      test(`reuseChunkedInstances=${reuse}`, async () => {
+
+        // Set items to chunk
+        chunked.$.repeater.reuseChunkedInstances = reuse;
+        chunked.items = chunked.preppedItems.slice();
+
+        let resetCount = 3;
+        let stamped = [];
+        let lastStamped;
+        let frameCount = 0;
+        // Loop until chunking is complete
+        while (stamped.length < chunked.items.length) {
+          stamped = await waitUntilRendered();
+          if (!lastStamped) {
+            // Initial rendering of initial count
+            assert.equal(stamped.length, 10);
+          } else {
+            // Remaining rendering increments
+            assert.isTrue(stamped.length > lastStamped.length,
+              'list instance count should increase each frame');
+            assert.deepEqual(lastStamped, stamped.slice(0, lastStamped.length),
+              'list should not re-render instances during mutation');
+            assert.isAtMost((stamped.length - lastStamped.length), MAX_PER_FRAME,
+              `list should not render more than ${MAX_PER_FRAME} per frame`);
           }
-        }
-        if (stamped.length < filteredLength) {
-          if (mutateCount-- > 0) {
-            mutateArray(chunked, stamped);
+          lastStamped = stamped;
+          frameCount++;
+          if (--resetCount > 0) {
+            if (!reuse) {
+              lastStamped = null;
+            }
+            chunked.items = chunked.preppedItems.slice();
           }
-          lastLength = stamped.length;
-          checkUntilComplete();
-        } else {
-          assert.equal(stamped.length, filteredLength);
-          done();
-        }
-      };
-      var checkUntilComplete = function() {
-        // On polyfilled MO, need to wait one setTimeout before rAF
-        if (MutationObserver._isPolyfilled) {
-          setTimeout(function() {
-            requestAnimationFrame(checkCount);
-          });
-        } else {
-          requestAnimationFrame(checkCount);
         }
-      };
-
-      chunked.$.repeater.sort = function(a, b) {
-        return b.prop - a.prop;
-      };
-      chunked.$.repeater.filter = function(a) {
-        return (a.prop % 2) === 0;
-      };
-      chunked.items = chunked.preppedItems.slice();
-      checkUntilComplete();
+        // Final rendering at exact item count
+        assert.equal(stamped.length, chunked.items.length, 'final count wrong');
+        assert.isAtLeast(frameCount, 5, 'should have taken at least 5 frames to render');
+        
+      });
 
     });
 
   });
 
-}
+  test('changing to/from initialCount=0', async () => {
+    // Render all
+    chunked.items = chunked.preppedItems.slice();
+    let stamped = await waitUntilRendered(chunked.preppedItems.length);
+    assert.equal(stamped.length, chunked.preppedItems.length);
+    // Clear the list
+    chunked.items = [];
+    stamped = await waitUntilRendered(0);
+    assert.equal(stamped.length, 0);
+    // Disable chunking
+    chunked.$.repeater.initialCount = 0;
+    // Render all
+    chunked.items = chunked.preppedItems.slice();
+    stamped = await waitUntilRendered(chunked.preppedItems.length);
+    assert.equal(stamped.length, chunked.preppedItems.length);
+    // Clear the list
+    chunked.items = [];
+    stamped = await waitUntilRendered(0);
+    assert.equal(stamped.length, 0);
+    // Re-enable chunking
+    chunked.$.repeater.initialCount = 10;
+    // Render all; the initial render should have the initial count, and then
+    // chunk until the end of the list
+    let frameCount = 0;
+    chunked.items = chunked.preppedItems.slice();
+    while (stamped.length < chunked.items.length) {
+      stamped = await waitUntilRendered();
+      if (frameCount === 0) {
+        assert.equal(stamped.length, 10);
+      }
+      frameCount++;
+    }
+    assert.equal(stamped.length, chunked.preppedItems.length);
+    assert.isAtLeast(frameCount, 2);
+    // Disable chunking
+    chunked.$.repeater.initialCount = 0;
+    // Render some
+    chunked.items = chunked.preppedItems.slice(0, 20);
+    stamped = await waitUntilRendered();
+    assert.equal(stamped.length, chunked.items.length);
+    // Re-enable chunking
+    chunked.$.repeater.initialCount = 10;
+    // Push remaining; these should chunk out
+    frameCount = 0;
+    chunked.push('items', ...chunked.preppedItems.slice(20));
+    while (stamped.length < chunked.items.length) {
+      stamped = await waitUntilRendered();
+      frameCount++;
+    }
+    assert.equal(stamped.length, chunked.items.length);
+    assert.isAtLeast(frameCount, 2);
+  });
+
+});
 
 suite('misc', function() {
 
@@ -4198,7 +4313,6 @@ <h4>x-repeat-chunked</h4>
   test('paths update on observed properties', function() {
     let simple = fixture('simple');
     flush();
-    //debugger;
     var stamped = simple.root.querySelectorAll('*:not(template):not(dom-repeat)');
     assert.equal(stamped[0].itemaProp, 'prop-1');
     simple.$.repeat.observe = 'prop';
diff --git a/test/unit/inheritance.html b/test/unit/inheritance.html
index 346498a935..28047bf511 100644
--- a/test/unit/inheritance.html
+++ b/test/unit/inheritance.html
@@ -17,6 +17,18 @@
   <script type="module" src="../../polymer-legacy.js"></script>
 <body>
 
+  <dom-module id="uses-underscore-template">
+    <template><div>error</div></template>
+  </dom-module>
+
+  <dom-module id="uses-dom-module">
+    <template><div>from-dom-module</div></template>
+  </dom-module>
+
+  <dom-module id="no-template">
+    <template><div>error</div></template>
+  </dom-module>
+
   <dom-module id="base-el">
     <template>
       <style>
@@ -147,6 +159,9 @@
   </test-fixture>
 
   <script type="module">
+import { html } from '../../lib/utils/html-tag.js';
+import { Polymer } from '../../polymer-legacy.js';
+
 suite('ChildElement extends BaseElement', function() {
   test('child has base properties', function() {
     var f = fixture('basic');
@@ -266,6 +281,77 @@
     assert.equal(el.shadowRoot, null);
   });
 });
+
+suite('Legacy _template property: null/undefined', function() {
+
+  let el;
+  teardown(function() {
+    if (el) {
+      document.body.removeChild(el);
+    }
+  });
+
+  test('_template: returning template works', function() {
+    Polymer({
+      is: 'uses-underscore-template',
+      _template:  html`<div>from-underscore-template</div>`
+    });
+    const el = document.createElement('uses-underscore-template');
+    document.body.appendChild(el);
+    assert.equal(el.shadowRoot.firstChild.textContent, 'from-underscore-template');
+  });
+
+  test('_template: undefined falls back to dom-module', function() {
+    Polymer({
+      is: 'uses-dom-module',
+      _template: undefined
+    });
+    const el = document.createElement('uses-dom-module');
+    document.body.appendChild(el);
+    assert.equal(el.shadowRoot.firstChild.textContent, 'from-dom-module');
+  });
+
+  test('_template: null overrides dom-module', function() {
+    Polymer({
+      is: 'no-template',
+      _template: null
+    });
+    const el = document.createElement('no-template');
+    document.body.appendChild(el);
+    assert.notOk(el.shadowRoot);
+  });
+
+  test('_template: returning template works in sub-class', function() {
+    customElements.define('sub-uses-underscore-template', class extends customElements.get('uses-underscore-template') {
+      get _template() { return this._$tmpl || html`<div>sub-from-underscore-template</div>`; }
+      set _template(v) { this._$tmpl = v; }
+    });
+    const el = document.createElement('sub-uses-underscore-template');
+    document.body.appendChild(el);
+    assert.equal(el.shadowRoot.firstChild.textContent, 'sub-from-underscore-template');
+  });
+
+  test('_template: undefined falls back to dom-module in sub-class', function() {
+    customElements.define('sub-uses-dom-module', class extends customElements.get('uses-dom-module') {
+      get _template() { return this._$tmpl || undefined; }
+      set _template(v) { this._$tmpl = v; }
+    });
+    const el = document.createElement('sub-uses-dom-module');
+    document.body.appendChild(el);
+    assert.equal(el.shadowRoot.firstChild.textContent, 'from-dom-module');
+  });
+
+  test('_template: null overrides dom-module in sub-class', function() {
+    customElements.define('sub-no-template', class extends customElements.get('no-template') {
+      get _template() { return this._$tmpl || null; }
+      set _template(v) { this._$tmpl = v; }
+    });
+    const el = document.createElement('sub-no-template');
+    document.body.appendChild(el);
+    assert.notOk(el.shadowRoot);
+  });
+
+});
 </script>
 </body>
 </html>
diff --git a/test/unit/legacy-noattributes.html b/test/unit/legacy-noattributes.html
new file mode 100644
index 0000000000..20c7d65627
--- /dev/null
+++ b/test/unit/legacy-noattributes.html
@@ -0,0 +1,239 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <script src="../../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
+  <script src="wct-browser-config.js"></script>
+  <script src="../../node_modules/wct-browser-legacy/browser.js"></script>
+  <script type="module">
+    import {setLegacyNoObservedAttributes, setLegacyOptimizations} from '../../lib/utils/settings.js';
+    setLegacyNoObservedAttributes(true);
+    setLegacyOptimizations(true);
+  </script>
+</head>
+<body>
+
+  <dom-module id="x-child">
+    <template>
+      <div id="content">[[foo]]</div>
+    </template>
+    <script type="module">
+      import {Polymer} from '../../polymer-legacy.js';
+      Polymer({
+        is: 'x-child',
+        properties: {
+          foo: {type: String, value: 'default'},
+          bar: {type: String, value: 'default'},
+          zot: {type: Boolean, value: false, reflectToAttribute: true},
+          camelCase: String
+        },
+        ready() {
+          this.isEnabled = true;
+        }
+      });
+    </script>
+  </dom-module>
+
+  <dom-module id="x-attrs">
+    <template>
+      <x-child id="child1" foo="x-attrs.foo" bar$="[[bar]]" zot$="[[zot]]" camel-case="camelCase"></x-child>
+      <x-child id="child2" foo="x-attrs.foo" bar$="[[bar]]" zot$="[[zot]]" camel-case="[[camelCase]]" disable-upgrade></x-child>
+      <x-child id="child3" foo="x-attrs.foo" bar$="[[bar]]" zot$="[[zot]]" camel-case="[[camelCase]]" disable-upgrade$="[[disabled]]"></x-child>
+      <div id="ifContainer">
+        <dom-if if="[[shouldIf]]">
+          <template><x-child foo="x-attrs.foo" bar$="[[bar]]" zot$="[[zot]]" camel-case="[[camelCase]]"></x-child></template>
+        </dom-if>
+      </div>
+    </template>
+    <script type="module">
+      import {Polymer} from '../../polymer-legacy.js';
+      Polymer({
+        is: 'x-attrs',
+        properties: {
+          foo: String,
+          bar: {type: String, value: 'bar'},
+          zot: Boolean,
+          shouldIf: Boolean,
+          camelCase: String,
+          disabled: {type: Boolean, value: 'true'},
+        },
+        created() {
+          this.wasCreated = true;
+        },
+        attributeChanged(name, old, value) {
+          this.wasCreatedInAttributeChanged = this.wasCreated;
+          this.attrInfo = {name, old, value};
+        }
+      });
+
+      Polymer({
+        is: 'x-native-attrs-force',
+        _legacyForceObservedAttributes: true,
+        properties: {
+          tabindex: {reflectToAttribute: true, type: Number}
+        },
+        attributeChanged() {
+          this.attributeChangedCalled = true;
+        }
+      });
+    </script>
+  </dom-module>
+
+  <test-fixture id="declarative">
+    <template>
+      <x-attrs foo="foo" bar="bar" camel-case="camelCase"></x-attrs>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="one-attr">
+    <template>
+      <x-attrs foo="foo"></x-attrs>
+    </template>
+  </test-fixture>
+
+  <script type="module">
+    import {flush} from '../../lib/utils/flush.js';
+    import {wrap} from '../../lib/utils/wrap.js';
+    import {registrations} from '../../lib/utils/telemetry.js';
+
+    suite('legacyNoObservedAttributes', () => {
+
+      let el;
+      setup(() => {
+        el = fixture('declarative');
+      });
+
+      test('telemetry collected as expected', () => {
+        const defs = registrations.filter((def) => def.is === el.localName);
+        assert.ok(defs[0]);
+      });
+
+      test('native properties observeable when `_legacyForceObservedAttributes` set', function() {
+        // Unsupported when polyfill is in use since it uses `setAttribute`.
+        if (customElements.polyfillWrapFlushCallback) {
+          this.skip();
+        }
+        el = document.createElement('x-native-attrs-force');
+        document.body.appendChild(el);
+        el.tabIndex = 5;
+        assert.ok(el.attributeChangedCalled);
+        assert.equal(el.tabindex, 5);
+        document.body.removeChild(el);
+      });
+
+      test('static attributes', () => {
+        assert.equal(el.foo, 'foo');
+        assert.equal(el.$.child1.getAttribute('foo'), 'x-attrs.foo');
+        assert.equal(el.$.child1.foo, "x-attrs.foo");
+        assert.equal(el.$.child1.$.content.textContent, 'x-attrs.foo');
+        assert.equal(el.camelCase, 'camelCase');
+      });
+
+      test('imperative creation', () => {
+        el = document.createElement('x-attrs');
+        // Create attributes in an unpatched way.
+        const a = document.createAttribute('foo');
+        a.value = 'foo';
+        el.setAttributeNode(a);
+        const b = document.createAttribute('bar');
+        b.value = 'bar';
+        el.setAttributeNode(b);
+        const c = document.createAttribute('camel-case');
+        c.value = 'camelCase';
+        el.setAttributeNode(c);
+        document.body.appendChild(el);
+        assert.equal(el.foo, 'foo');
+        assert.equal(el.$.child1.getAttribute('foo'), 'x-attrs.foo');
+        assert.equal(el.$.child1.foo, "x-attrs.foo");
+        assert.equal(el.$.child1.$.content.textContent, 'x-attrs.foo');
+        assert.equal(el.camelCase, 'camelCase');
+        document.body.removeChild(el);
+      });
+
+      test('created called before attributeChanged', () => {
+        assert.isTrue(el.wasCreatedInAttributeChanged);
+      });
+
+      test('attributeChanged gets expected arguments', () => {
+        el = fixture('one-attr');
+        assert.deepEqual(el.attrInfo, {name: 'foo', old: null, value: 'foo'});
+        el.setAttribute('zot', '');
+        assert.deepEqual(el.attrInfo, {name: 'zot', old: null, value: ''});
+        el.setAttribute('zot', 'foo');
+        assert.deepEqual(el.attrInfo, {name: 'zot', old: '', value: 'foo'});
+        el.removeAttribute('zot', 'foo');
+        assert.deepEqual(el.attrInfo, {name: 'zot', old: 'foo', value: null});
+        el.setAttribute('zot', 'bar');
+        assert.deepEqual(el.attrInfo, {name: 'zot', old: null, value: 'bar'});
+        el.setAttribute('foo', 'foo2');
+        assert.deepEqual(el.attrInfo, {name: 'foo', old: 'foo', value: 'foo2'});
+      });
+
+      test('static attribute bindings', () => {
+        assert.equal(el.$.child1.getAttribute('bar'), 'bar');
+        assert.equal(el.$.child1.bar, 'bar');
+        assert.equal(el.$.child1.getAttribute('zot'), null);
+        assert.equal(el.$.child1.zot, false);
+        assert.equal(el.$.child1.camelCase, 'camelCase');
+      });
+
+      test('dynamic attribute bindings', () => {
+        el.bar = 'bar-modified';
+        assert.equal(el.$.child1.getAttribute('bar'), 'bar-modified');
+        assert.equal(el.$.child1.bar, 'bar-modified');
+        el.zot = true;
+        assert.equal(el.$.child1.getAttribute('zot'), '');
+        assert.equal(el.$.child1.zot, true);
+      });
+
+      test('attributes inside dom-if', () => {
+        el.shouldIf = true;
+        flush();
+        const child = wrap(el.$.ifContainer).querySelector('x-child');
+        assert.equal(child.getAttribute('foo'), 'x-attrs.foo');
+        assert.equal(child.foo, "x-attrs.foo");
+        assert.equal(child.$.content.textContent, 'x-attrs.foo');
+        assert.equal(child.camelCase, 'camelCase');
+        //
+        assert.equal(child.getAttribute('bar'), 'bar');
+        assert.equal(child.bar, 'bar');
+        assert.equal(child.getAttribute('zot'), null);
+        assert.equal(child.zot, false);
+        //
+        el.bar = 'bar-modified';
+        assert.equal(child.getAttribute('bar'), 'bar-modified');
+        assert.equal(child.bar, 'bar-modified');
+        el.zot = true;
+        assert.equal(child.getAttribute('zot'), '');
+        assert.equal(child.zot, true);
+      });
+
+      test('disable-upgrade static', () => {
+        assert.notOk(el.$.child2.isEnabled);
+        el.$.child2.removeAttribute('disable-upgrade');
+        assert.isTrue(el.$.child2.isEnabled);
+        assert.equal(el.$.child2.camelCase, 'camelCase');
+      });
+
+      test('disable-upgrade binding', () => {
+        assert.notOk(el.$.child3.isEnabled);
+        el.disabled = false;
+        assert.isTrue(el.$.child3.isEnabled);
+        assert.equal(el.$.child3.camelCase, 'camelCase');
+      });
+
+
+    });
+
+  </script>
+</body>
+</html>
diff --git a/test/unit/legacy-undefined.html b/test/unit/legacy-undefined.html
new file mode 100644
index 0000000000..78d86304ce
--- /dev/null
+++ b/test/unit/legacy-undefined.html
@@ -0,0 +1,342 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <script src="../../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
+  <script src="wct-browser-config.js"></script>
+  <script src="../../node_modules/wct-browser-legacy/browser.js"></script>
+  <script type="module">
+    import {setLegacyUndefined} from '../../lib/utils/settings.js';
+    setLegacyUndefined(true);
+  </script>
+</head>
+<body>
+
+  <dom-module id="x-data">
+    <template>
+      <div id="child"
+        computed-single="[[computeSingle(inlineSingleDep)]]"
+        computed-multi="[[computeMulti(inlineMultiDep1, inlineMultiDep2)]]">
+        <dom-if if>
+          <template><div id="ifChild" computed-multi="[[computeMulti(inlineMultiIfDep1, inlineMultiIfDep2)]]"></div></template>
+        </dom-if>
+      </div>
+    </template>
+    <script type="module">
+      import {Polymer} from '../../polymer-legacy.js';
+      Polymer({
+        is: 'x-data',
+        _legacyUndefinedCheck: true,
+        properties: {
+          singleProp: String,
+          multiProp1: String,
+          multiProp2: String,
+          computedSingleDep: String,
+          computedMultiDep1: String,
+          computedMultiDep2: String,
+          inlineSingleDep: String,
+          inlineMultiDep1: String,
+          inlineMultiDep2: String,
+          inlineMultiIfDep1: String,
+          inlineMultiIfDep2: String,
+          computedSingle: {
+            computed: 'computeSingle(computedSingleDep)'
+          },
+          computedMulti: {
+            computed: 'computeMulti(computedMultiDep1, computedMultiDep2)'
+          }
+        },
+        observers: [
+          'staticObserver("staticObserver")',
+          'singlePropObserver(singleProp)',
+          'multiPropObserver(multiProp1, multiProp2)',
+          'throws(throwProp)'
+        ],
+        created() {
+          this.singlePropObserver = sinon.spy();
+          this.multiPropObserver = sinon.spy();
+          this.staticObserver = sinon.spy();
+          this.computeSingle = sinon.spy((inlineSingleDep) => `[${inlineSingleDep}]`);
+          this.computeMulti = sinon.spy((inlineMultiDep1, inlineMultiDep2) => `[${inlineMultiDep1},${inlineMultiDep2}]`);
+        },
+        throws() {
+          throw new Error('real error');
+        }
+      });
+    </script>
+  </dom-module>
+
+  <test-fixture id="declarative-none">
+    <template>
+      <x-data></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-single">
+    <template>
+      <x-data single-prop="a"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-one">
+    <template>
+      <x-data multi-prop1="b"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-all">
+    <template>
+      <x-data multi-prop1="b" multi-prop2="c"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-single-computed">
+    <template>
+      <x-data computed-single-dep="a"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-one-computed">
+    <template>
+      <x-data computed-multi-dep1="b"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-all-computed">
+    <template>
+      <x-data computed-multi-dep1="b" computed-multi-dep2="c"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-single-computed-inline">
+    <template>
+      <x-data inline-single-dep="a"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-one-computed-inline">
+    <template>
+      <x-data inline-multi-dep1="b"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-all-computed-inline">
+    <template>
+      <x-data inline-multi-dep1="b" inline-multi-dep2="c"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-if-one-computed-inline">
+    <template>
+      <x-data inline-multi-if-dep1="b"></x-data>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="declarative-multi-if-all-computed-inline">
+    <template>
+      <x-data inline-multi-if-dep1="b" inline-multi-if-dep2="c"></x-data>
+    </template>
+  </test-fixture>
+
+  <script type="module">
+    import {flush} from '../../lib/utils/flush.js';
+
+    let el;
+
+    function assertEffects(callCounts) {
+      assert.equal(el.staticObserver.callCount, 1, 'staticObserver call count wrong');
+      assert.equal(el.singlePropObserver.callCount,
+        callCounts.singlePropObserver || 0, 'singlePropObserver call count wrong');
+      assert.equal(el.multiPropObserver.callCount,
+        callCounts.multiPropObserver || 0, 'multiPropObserver call count wrong');
+      assert.equal(el.computeSingle.callCount,
+        callCounts.computeSingle || 0, 'computeSingle call count wrong');
+      assert.equal(el.computeMulti.callCount,
+        callCounts.computeMulti || 0, 'computeMulti call count wrong');
+    }
+
+    suite('imperative', () => {
+
+
+      function setupElement(props) {
+        el = document.createElement('x-data');
+        Object.assign(el, props);
+        document.body.appendChild(el);
+        flush();
+      }
+
+      teardown(() => {
+        el.parentNode.removeChild(el);
+      });
+
+      const singleProp = 'singleProp';
+      const multiProp1 = 'multiProp1';
+      const multiProp2 = 'multiProp2';
+      const computedSingleDep = 'computedSingleDep';
+      const computedMultiDep1 = 'computedMultiDep1';
+      const computedMultiDep2 = 'computedMultiDep2';
+      const inlineSingleDep = 'inlineSingleDep';
+      const inlineMultiDep1 = 'inlineMultiDep1';
+      const inlineMultiDep2 = 'inlineMultiDep2';
+      const inlineMultiIfDep1 = 'inlineMultiIfDep1';
+      const inlineMultiIfDep2 = 'inlineMultiIfDep2';
+
+      suite('check disabled', () => {
+        test('no arguments defined', () => {
+          setupElement({});
+          assertEffects({});
+        });
+        test('singlePropObserver argument defined', () => {
+          setupElement({singleProp});
+          assertEffects({singlePropObserver: 1});
+        });
+        test('one multiPropObserver arguments defined', () => {
+          setupElement({multiProp1});
+          assertEffects({multiPropObserver: 0});
+        });
+        test('all multiPropObserver defined', () => {
+          setupElement({multiProp1, multiProp2});
+          assertEffects({multiPropObserver: 1});
+        });
+        test('singlePropObserver argument undefined', () => {
+          setupElement({singleProp});
+          assertEffects({singlePropObserver: 1});
+          el.singleProp = undefined;
+          assertEffects({singlePropObserver: 2});
+        });
+        test('one multiPropObserver arguments undefined', () => {
+          setupElement({multiProp1, multiProp2});
+          assertEffects({multiPropObserver: 1});
+          el.multiProp1 = undefined;
+          assertEffects({multiPropObserver: 1});
+        });
+        test('all multiPropObserver undefined', () => {
+          setupElement({multiProp1, multiProp2});
+          assertEffects({multiPropObserver: 1});
+          el.multiProp1 = undefined;
+          assertEffects({multiPropObserver: 1});
+          el.multiProp2 = undefined;
+          assertEffects({multiPropObserver: 1});
+        });
+        test('computeSingle argument defined', () => {
+          setupElement({computedSingleDep});
+          assertEffects({computeSingle: 1});
+          assert.equal(el.computedSingle, '[computedSingleDep]');
+        });
+        test('one computeMulti argument defined', () => {
+          setupElement({computedMultiDep1});
+          assertEffects({computeMulti: 0});
+          assert.equal(el.computedMulti, undefined);
+        });
+        test('all computeMulti argument defined', () => {
+          setupElement({computedMultiDep1, computedMultiDep2});
+          assertEffects({computeMulti: 1});
+          assert.equal(el.computedMulti, '[computedMultiDep1,computedMultiDep2]');
+        });
+        test('inline computeSingle argument defined', () => {
+          setupElement({inlineSingleDep});
+          assertEffects({computeSingle: 1});
+          assert.equal(el.$.child.computedSingle, '[inlineSingleDep]');
+        });
+        test('one inline computeMulti argument defined', () => {
+          setupElement({inlineMultiDep1});
+          assertEffects({computeMulti: 0});
+          assert.equal(el.$.child.computedMulti, undefined);
+        });
+        test('all inline computeMulti argument defined', () => {
+          setupElement({inlineMultiDep1, inlineMultiDep2});
+          assertEffects({computeMulti: 1});
+          assert.equal(el.$.child.computedMulti, '[inlineMultiDep1,inlineMultiDep2]');
+        });
+        test('one inline computeMulti argument defined in dom-if', () => {
+          setupElement({inlineMultiIfDep1});
+          assertEffects({computeMulti: 0});
+          assert.equal(el.$$('#ifChild').computedMulti, undefined);
+        });
+        test('all inline computeMulti argument defined in dom-if', () => {
+          setupElement({inlineMultiIfDep1, inlineMultiIfDep2});
+          assertEffects({computeMulti: 1});
+          assert.equal(el.$$('#ifChild').computedMulti, '[inlineMultiIfDep1,inlineMultiIfDep2]');
+        });
+      });
+
+    });
+
+    suite('declarative', () => {
+
+      setup(() => sinon.spy(console, 'warn'));
+
+      teardown(() => console.warn.restore());
+
+      test('no arguments defined', () => {
+        el = fixture('declarative-none');
+        assertEffects({});
+      });
+      test('singlePropObserver argument defined', () => {
+        el = fixture('declarative-single');
+        assertEffects({singlePropObserver: 1});
+      });
+      test('one multiPropObserver arguments defined', () => {
+        el = fixture('declarative-multi-one');
+        assertEffects({multiPropObserver: 0});
+      });
+      test('all multiPropObserver defined', () => {
+        el = fixture('declarative-multi-all');
+        assertEffects({multiPropObserver: 1});
+      });
+      test('computeSingle argument defined', () => {
+        el = fixture('declarative-single-computed');
+        assertEffects({computeSingle: 1});
+        assert.equal(el.computedSingle, '[a]');
+      });
+      test('one computeMulti arguments defined', () => {
+        el = fixture('declarative-multi-one-computed');
+        assertEffects({computeMulti: 0});
+        assert.equal(el.computedMulti, undefined);
+      });
+      test('all computeMulti defined', () => {
+        el = fixture('declarative-multi-all-computed');
+        assert.equal(el.computedMulti, '[b,c]');
+      });
+      test('inline computeSingle argument defined', () => {
+        el = fixture('declarative-single-computed-inline');
+        assertEffects({computeSingle: 1});
+        assert.equal(el.$.child.computedSingle, '[a]');
+      });
+      test('inline one computeMulti arguments defined', () => {
+        el = fixture('declarative-multi-one-computed-inline');
+        assertEffects({computeMulti: 0});
+        assert.equal(el.$.child.computedMulti, undefined);
+      });
+      test('inline all computeMulti defined', () => {
+        el = fixture('declarative-multi-all-computed-inline');
+        assertEffects({computeMulti: 1});
+        assert.equal(el.$.child.computedMulti, '[b,c]');
+      });
+      test('one inline computeMulti argument defined in dom-if', () => {
+        el = fixture('declarative-multi-if-one-computed-inline');
+        flush();
+        assertEffects({computeMulti: 0});
+        assert.equal(el.$$('#ifChild').computedMulti, undefined);
+      });
+      test('all inline computeMulti argument defined in dom-if', () => {
+        el = fixture('declarative-multi-if-all-computed-inline');
+        flush();
+        assertEffects({computeMulti: 1});
+        assert.equal(el.$$('#ifChild').computedMulti, '[b,c]');
+      });
+
+    });
+
+  </script>
+</body>
+</html>
diff --git a/test/unit/path-effects.html b/test/unit/path-effects.html
index feebb9c901..973d9a5d3c 100644
--- a/test/unit/path-effects.html
+++ b/test/unit/path-effects.html
@@ -21,6 +21,9 @@
 <script type="module">
 import './path-effects-elements.js';
 import { Polymer } from '../../lib/legacy/polymer-fn.js';
+import { setOrderedComputed } from '../../lib/utils/settings.js';
+
+setOrderedComputed(Boolean(window.location.search.match('orderedComputed')));
 
 // Safari 9 has a horrible bug related to array enumeration after defining
 // a non-enumerable property on it (we do for `.splices`); for now we work
diff --git a/test/unit/property-effects-elements.js b/test/unit/property-effects-elements.js
index 7986f2a6f7..43b75410be 100644
--- a/test/unit/property-effects-elements.js
+++ b/test/unit/property-effects-elements.js
@@ -298,7 +298,9 @@ Polymer({
   },
 
   $computeTrickyFunctionFromLiterals: function(num, str) {
-    return this.computeFromLiterals(num, str);
+    assert.equal(num, 3);
+    assert.equal(str, 'foo');
+    return num + str;
   },
 
   computeFromTrickyLiterals: function(a, b) {
@@ -1009,6 +1011,63 @@ class SubObserverElement extends SuperObserverElement {
 }
 customElements.define(SubObserverElement.is, SubObserverElement);
 
+customElements.define('x-computed-ordering', class extends PolymerElement {
+  static get properties() {
+    return {
+      a: {type: Number, value: 1000},
+      // b: {type: Number, value: 100}, // Intentionally undeclared; init in ctor
+      c: {type: Number, value: 10},
+      d: {type: Number, value: 1},
+      abbcd: {computed: 'computeABBCD(a, b, bcd)', observer: 'abbcdChanged'},
+      bcd: {computed: 'computeBCD(bc, d)', observer: 'bcdChanged'},
+      bc: {computed: 'computeBC(b, c)', observer: 'bcChanged'},
+      circIn: {type: Number},
+      circA: {computed: 'computeCircA(circIn, circB)'},
+      circB: {computed: 'computeCircA(circIn, circA)'},
+
+      x: {type: Number, value: 2},
+      y: {type: Number, value: 20},
+      z: {type: Number, value: 200},
+      xy: {computed: 'computeXY(x, y)', observer: 'xyChanged'},
+      computeXY: {computed: 'computeComputeXY(z)'}
+    };
+  }
+  constructor() {
+    super();
+    this.b = 100;
+    sinon.spy(this, 'computeABBCD');
+    sinon.spy(this, 'computeBCD');
+    sinon.spy(this, 'computeBC');
+    this.abbcdChanged = sinon.spy();
+    this.bcdChanged = sinon.spy();
+    this.bcChanged = sinon.spy();
+
+    this.computeXYSpy = sinon.spy();
+    this.xyChanged = sinon.spy();
+  }
+  computeABBCD(a, b, bcd) {
+    return a + b + bcd;
+  }
+  computeBCD(bc, d) {
+    return bc + d;
+  }
+  computeBC(b, c) {
+    return b + c;
+  }
+  computeCircA(circIn, circB) {
+    return circIn + (circB || 0);
+  }
+  computeCircB(circIn, circA) {
+    return circIn + (circA || 0);
+  }
+  computeComputeXY(z) {
+    return function computeYZ(x, y) {
+      this.computeXYSpy(x, y);
+      return x + y + z;
+    };
+  }
+});
+  
 class SVGElement extends PolymerElement {
   static get template() {
     return html`
diff --git a/test/unit/property-effects-template.html b/test/unit/property-effects-template.html
index 56327de127..8e55f9bced 100644
--- a/test/unit/property-effects-template.html
+++ b/test/unit/property-effects-template.html
@@ -54,6 +54,7 @@
   }
   ready() {
     super.ready();
+    this.readied = true;
     window.lifecycleOrder.log(this, 'ready');
   }
 }
@@ -153,11 +154,38 @@
     this.shadowRoot.appendChild(dom);
     return dom;
   }
+  stampNoAppend() {
+    return this._stampTemplate(this.$.templateFromShadowDom);
+  }
 }
 customElements.define('x-runtime', XRuntime);
 </script>
 </dom-module>
 
+<script type="module">
+  import { PolymerElement, html } from '../../polymer-element.js';
+  customElements.define('x-runtime-nested', class extends PolymerElement {
+    static get template() {
+      return html`<template id="t1">
+        <span>t1-[[prop1]]</span>
+        <template id="t2">
+          <span>t2-[[prop2]]</span>
+          <template id="t3">
+            <span>t3-[[prop3]]</span>
+          </template>
+        </template>
+      </template>`;
+    }
+    static get properties() {
+      return {
+        prop1: { value: 'prop1'},
+        prop2: { value: 'prop2'},
+        prop3: { value: 'prop3'}
+      };
+    }
+  });
+</script>
+
 <template id="custom-template">
   <x-special name="el1" special="attr1" binding="[[prop]]" on-event="handler"></x-special>
   <div name="el2" special="attr2">
@@ -197,8 +225,8 @@
     }
     return noted;
   }
-  _bindTemplate(template) {
-    return this.templateInfoForTesting = super._bindTemplate(template);
+  _bindTemplate(template, instanceBinding) {
+    return this.templateInfoForTesting = super._bindTemplate(template, instanceBinding);
   }
 }
 customElements.define('x-parsing', XParsing);
@@ -304,6 +332,7 @@
       },
       idFor(el) {
         let host = el.getRootNode().host;
+        host = host && host.localName !== 'x-runtime' ? host : null;
         let id = el.getAttribute('log') || el.id;
         return (host ? this.idFor(host) + '|' : '') + el.localName + (id ? '#' + id : '');
       }
@@ -356,9 +385,9 @@
     assert.equal(stamped[0], el.$.first);
     // Lifecycle order correct
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime'
     ]);
   });
@@ -372,13 +401,13 @@
     assert.equal(stamped[0], el.$.first);
     assert.equal(stamped[1], dom.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow'
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow'
     ]);
   });
 
@@ -419,19 +448,19 @@
     assert.equal(stamped[1], dom2.$.first);
     assert.equal(stamped[2], dom3.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow'
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow',
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow',
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow'
     ]);
     // Unstamp
     el._removeBoundDom(dom2);
@@ -456,9 +485,9 @@
     assert.equal(stamped[0], el.$.first);
     assert.equal(stamped[1], dom.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
       'x-element#shadow|x-element-child#noBinding',
       'x-element#shadow|x-element-child#hasBinding',
@@ -503,19 +532,19 @@
     assert.equal(stamped[1], dom2.$.first);
     assert.equal(stamped[2], dom3.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
       'x-element#shadow|x-element-child#noBinding',
       'x-element#shadow|x-element-child#hasBinding',
       'x-element#shadow',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow',
-      'x-runtime|x-element#shadow|x-element-child#noBinding',
-      'x-runtime|x-element#shadow|x-element-child#hasBinding',
-      'x-runtime|x-element#shadow'
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow',
+      'x-element#shadow|x-element-child#noBinding',
+      'x-element#shadow|x-element-child#hasBinding',
+      'x-element#shadow'
     ]);
     // Unstamp
     el._removeBoundDom(dom2);
@@ -540,13 +569,13 @@
     assert.equal(stamped[0], el.$.first);
     assert.equal(stamped[1], dom.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
-      'x-runtime|x-element#light|x-element-child#noBinding',
-      'x-runtime|x-element#light|x-element-child#hasBinding',
-      'x-runtime|x-element#light'
+      'x-element#light|x-element-child#noBinding',
+      'x-element#light|x-element-child#hasBinding',
+      'x-element#light'
     ]);
   });
 
@@ -584,19 +613,19 @@
     assert.equal(stamped[1], dom2.$.first);
     assert.equal(stamped[2], dom3.$.first);
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime',
-      'x-runtime|x-element#light|x-element-child#noBinding',
-      'x-runtime|x-element#light|x-element-child#hasBinding',
-      'x-runtime|x-element#light',
-      'x-runtime|x-element#light|x-element-child#noBinding',
-      'x-runtime|x-element#light|x-element-child#hasBinding',
-      'x-runtime|x-element#light',
-      'x-runtime|x-element#light|x-element-child#noBinding',
-      'x-runtime|x-element#light|x-element-child#hasBinding',
-      'x-runtime|x-element#light'
+      'x-element#light|x-element-child#noBinding',
+      'x-element#light|x-element-child#hasBinding',
+      'x-element#light',
+      'x-element#light|x-element-child#noBinding',
+      'x-element#light|x-element-child#hasBinding',
+      'x-element#light',
+      'x-element#light|x-element-child#noBinding',
+      'x-element#light|x-element-child#hasBinding',
+      'x-element#light'
     ]);
     // Unstamp
     el._removeBoundDom(dom2);
@@ -688,12 +717,99 @@
     assert.equal(stamped[0], el.$.first);
     // Lifecycle order correct
     assert.deepEqual(window.lifecycleOrder.ready, [
-      'x-runtime|x-element#proto|x-element-child#noBinding',
-      'x-runtime|x-element#proto|x-element-child#hasBinding',
-      'x-runtime|x-element#proto',
+      'x-element#proto|x-element-child#noBinding',
+      'x-element#proto|x-element-child#hasBinding',
+      'x-element#proto',
       'x-runtime'
     ]);
   });
+
+  test('runtime stamped templates ready before append', () => {
+    const dom = el.stampNoAppend();
+    assert.isTrue(dom.querySelector('x-element').readied);
+  });
+
+});
+
+suite('nested runtime template stamping', () => {
+
+  let el;
+
+  // Accumulates any spans that are stamped into a single ordered set; once
+  // added, a span is never removed, so we can test that updates stop happening
+  // when bound DOM is removed
+  const spans = new Set();
+  const accumulatedContent = () => {
+    Array.from(el.shadowRoot.querySelectorAll('span')).forEach(s => spans.add(s));
+    const content = [];
+    spans.forEach(e => content.push(e.textContent));
+    return content;
+  };
+
+  setup(() => {
+    el = document.createElement('x-runtime-nested');
+    document.body.appendChild(el);
+  });
+  teardown(() => {
+    document.body.removeChild(el);
+  });
+
+  test('nested stamping', () => {
+    // Stamp 1
+    const dom1 = el._stampTemplate(el.shadowRoot.querySelector('#t1'));
+    el.shadowRoot.appendChild(dom1);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1']);
+    // Stamp 2
+    const dom2 = el._stampTemplate(el.shadowRoot.querySelector('#t2'));
+    el.shadowRoot.appendChild(dom2);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1', 't2-prop2']);
+    // Stamp 3-1
+    const dom3_1 = el._stampTemplate(el.shadowRoot.querySelector('#t3'));
+    el.shadowRoot.appendChild(dom3_1);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1', 't2-prop2', 't3-prop3']);
+    // Stamp 3_2
+    const dom3_2 = el._stampTemplate(el.shadowRoot.querySelector('#t3'));
+    el.shadowRoot.appendChild(dom3_2);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1', 't2-prop2', 't3-prop3', 't3-prop3']);
+    // Stamp 3_3
+    const dom3_3 = el._stampTemplate(el.shadowRoot.querySelector('#t3'));
+    el.shadowRoot.appendChild(dom3_3);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1', 't2-prop2', 't3-prop3', 't3-prop3', 't3-prop3']);
+    // Modify all
+    el.setProperties({
+      prop1: el.prop1 + '*',
+      prop2: el.prop2 + '*',
+      prop3: el.prop3 + '*'
+    });
+    assert.deepEqual(accumulatedContent(), ['t1-prop1*', 't2-prop2*', 't3-prop3*', 't3-prop3*', 't3-prop3*']);
+    // Remove 3-1 & modify all
+    el._removeBoundDom(dom3_1);
+    el.setProperties({
+      prop1: el.prop1 + '*',
+      prop2: el.prop2 + '*',
+      prop3: el.prop3 + '*'
+    });
+    assert.deepEqual(accumulatedContent(), ['t1-prop1**', 't2-prop2**', 't3-prop3*', 't3-prop3**', 't3-prop3**']);
+    // Remove 3-3 & modify all
+    el._removeBoundDom(dom3_3);
+    el.setProperties({
+      prop1: el.prop1 + '*',
+      prop2: el.prop2 + '*',
+      prop3: el.prop3 + '*'
+    });
+    assert.deepEqual(accumulatedContent(), ['t1-prop1***', 't2-prop2***', 't3-prop3*', 't3-prop3***', 't3-prop3**']);
+    // Stamp 3-4
+    const dom3_4 = el._stampTemplate(el.shadowRoot.querySelector('#t3'));
+    el.shadowRoot.appendChild(dom3_4);
+    assert.deepEqual(accumulatedContent(), ['t1-prop1***', 't2-prop2***', 't3-prop3*', 't3-prop3***', 't3-prop3**', 't3-prop3***']);
+    // Modify all
+    el.setProperties({
+      prop1: el.prop1 + '*',
+      prop2: el.prop2 + '*',
+      prop3: el.prop3 + '*'
+    });
+    assert.deepEqual(accumulatedContent(), ['t1-prop1****', 't2-prop2****', 't3-prop3*', 't3-prop3****', 't3-prop3**', 't3-prop3****']);
+  });
 });
 
 suite('template parsing hooks', () => {
diff --git a/test/unit/property-effects.html b/test/unit/property-effects.html
index 9e2639c932..85e7ad0477 100644
--- a/test/unit/property-effects.html
+++ b/test/unit/property-effects.html
@@ -26,8 +26,12 @@
 <script type="module">
 import './property-effects-elements.js';
 import { Polymer, html } from '../../polymer-legacy.js';
-import { setSanitizeDOMValue, sanitizeDOMValue, getSanitizeDOMValue, setLegacyOptimizations } from '../../lib/utils/settings.js';
+import { setSanitizeDOMValue, sanitizeDOMValue, getSanitizeDOMValue, setLegacyWarnings, legacyUndefined, setLegacyUndefined, setOrderedComputed, orderedComputed } from '../../lib/utils/settings.js';
 import { PropertyEffects } from '../../lib/mixins/property-effects.js';
+import { flush } from '../../lib/utils/flush.js';
+
+setLegacyUndefined(Boolean(window.location.search.match('legacyUndefined')));
+setOrderedComputed(Boolean(window.location.search.match('orderedComputed')));
 
 suite('single-element binding effects', function() {
 
@@ -1234,7 +1238,9 @@
     el.cpnd3 = {prop: 'cpnd3'};
     assert.equal(el.$.boundProps.prop1, 'cpnd1cpnd2cpnd3');
     el.cpnd4 = 'cpnd4';
-    assert.equal(el.$.boundProps.prop1, 'cpnd1cpnd2cpnd3literalComputedcpnd4');
+    assert.equal(el.$.boundProps.prop1,
+      legacyUndefined ?
+      'cpnd1cpnd2cpnd3' : 'cpnd1cpnd2cpnd3literalComputedcpnd4');
     el.cpnd5 = 'cpnd5';
     assert.equal(el.$.boundProps.prop1, 'cpnd1cpnd2cpnd3literalComputedcpnd5cpnd4');
   });
@@ -1265,7 +1271,9 @@
     el.cpnd3 = {prop: 'cpnd3'};
     assert.equal(el.$.boundChild.getAttribute('compoundAttr1'), 'cpnd1cpnd2cpnd3');
     el.cpnd4 = 'cpnd4';
-    assert.equal(el.$.boundChild.getAttribute('compoundAttr1'), 'cpnd1cpnd2cpnd3literalComputedcpnd4');
+    assert.equal(el.$.boundChild.getAttribute('compoundAttr1'),
+      legacyUndefined ?
+      'cpnd1cpnd2cpnd3' : 'cpnd1cpnd2cpnd3literalComputedcpnd4');
     el.cpnd5 = 'cpnd5';
     assert.equal(el.$.boundChild.getAttribute('compoundAttr1'), 'cpnd1cpnd2cpnd3literalComputedcpnd5cpnd4');
   });
@@ -1302,7 +1310,9 @@
     el.cpnd3 = {prop: 'cpnd3'};
     assert.equal(el.$.compound1.textContent, 'cpnd1cpnd2cpnd3');
     el.cpnd4 = 'cpnd4';
-    assert.equal(el.$.compound1.textContent, 'cpnd1cpnd2cpnd3literalComputedcpnd4');
+    assert.equal(el.$.compound1.textContent,
+      legacyUndefined ?
+      'cpnd1cpnd2cpnd3' : 'cpnd1cpnd2cpnd3literalComputedcpnd4');
     el.cpnd5 = 'cpnd5';
     assert.equal(el.$.compound1.textContent, 'cpnd1cpnd2cpnd3literalComputedcpnd5cpnd4');
     // Once the binding evaluates back to '', it will in fact be ''
@@ -1777,24 +1787,43 @@
     customElements.define('pe-method-observer', TestClass);
     let el = document.createElement('pe-method-observer');
     document.body.appendChild(el);
-    assert.equal(el.observer.callCount, 1);
-    assert.deepEqual(el.observer.getCall(0).args, [undefined, undefined]);
+    if (legacyUndefined) {
+      assert.equal(el.observer.callCount, 0);
+    } else {
+      assert.equal(el.observer.callCount, 1);
+      assert.deepEqual(el.observer.getCall(0).args, [undefined, undefined]);
+    }
     assert.equal(el.pcSpy.callCount, 1);
     el.a = 'a';
-    assert.equal(el.observer.callCount, 2);
-    assert.deepEqual(el.observer.getCall(1).args, ['a', undefined]);
+    if (legacyUndefined) {
+      assert.equal(el.observer.callCount, 0);
+    } else {
+      assert.equal(el.observer.callCount, 2);
+      assert.deepEqual(el.observer.getCall(1).args, ['a', undefined]);
+    }
     assert.equal(el.pcSpy.callCount, 2);
     el.b = {c: 'c'};
-    assert.equal(el.observer.callCount, 3);
-    assert.deepEqual(el.observer.getCall(2).args, ['a', 'c']);
+    if (legacyUndefined) {
+      assert.equal(el.observer.callCount, 1);
+      assert.deepEqual(el.observer.getCall(0).args, ['a', 'c']);
+    } else {
+      assert.equal(el.observer.callCount, 3);
+      assert.deepEqual(el.observer.getCall(2).args, ['a', 'c']);
+    }
     assert.equal(el.pcSpy.callCount, 3);
     el.setProperties({
       a: 'A',
       b: {c: 'C'}
     });
-    assert.equal(el.observer.callCount, 4);
-    assert.deepEqual(el.observer.getCall(3).args, ['A', 'C']);
-    assert.equal(el.pcSpy.callCount, 4);
+    if (legacyUndefined) {
+      assert.equal(el.observer.callCount, 2);
+      assert.deepEqual(el.observer.getCall(1).args, ['A', 'C']);
+      assert.equal(el.pcSpy.callCount, 4);
+    } else {
+      assert.equal(el.observer.callCount, 4);
+      assert.deepEqual(el.observer.getCall(3).args, ['A', 'C']);
+      assert.equal(el.pcSpy.callCount, 4);
+    }
 
     el.observer = sinon.spy();
     assert.equal(el.observer.callCount, 1);
@@ -1817,23 +1846,38 @@
     assert.equal(el.compute.callCount, 0);
     assert.equal(el.pcSpy.callCount, 0);
     el.a = 'a';
-    assert.equal(el.compute.callCount, 1);
-    assert.deepEqual(el.compute.getCall(0).args, ['a', undefined]);
-    assert.equal(el.prop, 'aundefined');
+    if (legacyUndefined) {
+      assert.equal(el.compute.callCount, 0);
+    } else {
+      assert.equal(el.compute.callCount, 1);
+      assert.deepEqual(el.compute.getCall(0).args, ['a', undefined]);
+      assert.equal(el.prop, 'aundefined');
+    }
     assert.equal(el.pcSpy.callCount, 1);
     el.b = {c: 'c'};
-    assert.equal(el.compute.callCount, 2);
-    assert.deepEqual(el.compute.getCall(1).args, ['a', 'c']);
+    if (legacyUndefined) {
+      assert.equal(el.compute.callCount, 1);
+      assert.deepEqual(el.compute.getCall(0).args, ['a', 'c']);
+    } else {
+      assert.equal(el.compute.callCount, 2);
+      assert.deepEqual(el.compute.getCall(1).args, ['a', 'c']);
+    }
     assert.equal(el.prop, 'ac');
     assert.equal(el.pcSpy.callCount, 2);
     el.setProperties({
       a: 'A',
       b: {c: 'C'}
     });
-    assert.equal(el.compute.callCount, 3);
-    assert.deepEqual(el.compute.getCall(2).args, ['A', 'C']);
+    if (legacyUndefined) {
+      assert.equal(el.compute.callCount, 2);
+      assert.deepEqual(el.compute.getCall(1).args, ['A', 'C']);
+      assert.equal(el.pcSpy.callCount, 3);
+    } else {
+      assert.equal(el.compute.callCount, 3);
+      assert.deepEqual(el.compute.getCall(2).args, ['A', 'C']);
+      assert.equal(el.pcSpy.callCount, 3);
+    }
     assert.equal(el.prop, 'AC');
-    assert.equal(el.pcSpy.callCount, 3);
     document.body.removeChild(el);
   });
 
@@ -1888,23 +1932,69 @@
   });
 
   teardown(function() {
-    setLegacyOptimizations(false);
+    setLegacyWarnings(false);
     console.warn.restore();
   });
 
   test('warn if non-declared property used in binding', () => {
-    setLegacyOptimizations(true);
+    setLegacyWarnings(true);
     Polymer({
       is: 'x-warn-undeclared-binding',
       _template: html`
         <div attr$="[[undeclaredToAttr]]"
              prop="[[undeclaredToProp]]">
-             [[undeclaredToText]]</div>`
+             [[undeclaredToText]]
+             [[compute(undeclaredDep1, undeclaredDep2)]]
+             </div>
+        <template is="dom-repeat" items="[0]">
+          <div attr$="[[nestedUndeclaredToAttr]]"
+             prop="[[nestedUndeclaredToProp]]">
+             [[nestedUndeclaredToText]]
+             [[compute(nestedUndeclaredDep1, nestedUndeclaredDep2)]]
+             </div>
+        </template>
+        `,
+      compute(dep) { return dep; }
     });
     const el = document.createElement('x-warn-undeclared-binding');
     document.body.appendChild(el);
+    flush();
+    document.body.removeChild(el);
+    assert.equal(console.warn.callCount, 10);
+  });
+
+  test('do not warn on valid non-property bindings', () => {
+    setLegacyWarnings(true);
+    Polymer({
+      is: 'x-nowarn-undeclared-binding',
+      properties: {
+        hostProp: String,
+        dynamicFn: Function
+      },
+      _template: html`
+        <div>[[hostProp]]</div>    <!-- host prop -->
+        <div>[[noDeps()]]</div>    <!-- method with no deps -->
+        <div>[[literalDeps('hi')]]</div>  <!-- method with literal deps -->
+        <div>[[dynamicFn()]]</div> <!-- dynamic function with no deps -->
+        <div>[[dynamicFnWithDep(hostProp)]]</div>  <!-- dynamic function with deps -->
+        <template is="dom-repeat" items="[0]" as="instProp">
+          <div>[[instProp]]</div>  <!-- instance prop -->
+          <div>[[hostProp]]</div>  <!-- nested host prop -->
+          <div>[[noDeps()]]</div>  <!-- nested method with no deps -->
+          <div>[[literalDeps('hi')]]</div>  <!-- method with literal deps -->
+          <div>[[dynamicFn()]]</div> <!-- dynamic function with no deps -->
+          <div>[[dynamicFnWithDep(hostProp)]]</div>  <!-- dynamic function with deps -->
+        </template>
+      `,
+      noDeps() { return 'static'; },
+      dynamicFn(dep) { return dep; },
+      dynamicFnWithDep(dep) { return dep; }
+    });
+    const el = document.createElement('x-nowarn-undeclared-binding');
+    document.body.appendChild(el);
+    flush();
     document.body.removeChild(el);
-    assert.equal(console.warn.callCount, 3);
+    assert.equal(console.warn.callCount, 0);
   });
 
   test('warn when re-declaring a computed property', () => {
@@ -1984,6 +2074,107 @@
   });
 
 });
+
+if (orderedComputed) {
+
+  suite('computed property ordering', function() {
+    var el;
+
+    setup(function() {
+      el = document.createElement('x-computed-ordering');
+      document.body.appendChild(el);
+    });
+
+    teardown(function() {
+      document.body.removeChild(el);
+    });
+
+    test('computed property ordering', function() {
+
+      assert.equal(el.bc, 110);
+      assert.equal(el.bcd, 111);
+      assert.equal(el.abbcd, 1211);
+      assert.equal(el.computeBC.callCount, 1);
+      assert.equal(el.computeBCD.callCount, 1);
+      assert.equal(el.computeABBCD.callCount, 1);
+
+      el.setProperties({
+        b: 200,
+        c: 20
+      });
+      assert.equal(el.bc, 220);
+      assert.equal(el.bcd, 221);
+      assert.equal(el.abbcd, 1421);
+      assert.equal(el.computeBC.callCount, 2);
+      assert.equal(el.computeBCD.callCount, 2);
+      assert.equal(el.computeABBCD.callCount, 2);
+
+      el.a = 2000;
+      assert.equal(el.bc, 220);
+      assert.equal(el.bcd, 221);
+      assert.equal(el.abbcd, 2421);
+      assert.equal(el.computeBC.callCount, 2);
+      assert.equal(el.computeBCD.callCount, 2);
+      assert.equal(el.computeABBCD.callCount, 3);
+
+      el.c = 30;
+      assert.equal(el.bc, 230);
+      assert.equal(el.bcd, 231);
+      assert.equal(el.abbcd, 2431);
+      assert.equal(el.computeBC.callCount, 3);
+      assert.equal(el.computeBCD.callCount, 3);
+      assert.equal(el.computeABBCD.callCount, 4);
+
+      el.d = 2;
+      assert.equal(el.bc, 230);
+      assert.equal(el.bcd, 232);
+      assert.equal(el.abbcd, 2432);
+      assert.equal(el.computeBC.callCount, 3);
+      assert.equal(el.computeBCD.callCount, 4);
+      assert.equal(el.computeABBCD.callCount, 5);
+
+      el.setProperties({
+        a: 1000,
+        b: 100,
+        c: 10,
+        d: 1
+      });
+      assert.equal(el.bc, 110);
+      assert.equal(el.bcd, 111);
+      assert.equal(el.abbcd, 1211);
+      assert.equal(el.computeBC.callCount, 4);
+      assert.equal(el.computeBCD.callCount, 5);
+      assert.equal(el.computeABBCD.callCount, 6);
+
+    });
+
+    test('computing functions as dependencies', function() {
+      assert.equal(el.xy, '222');
+      assert.equal(el.computeXYSpy.callCount, 1);
+      assert.equal(el.xyChanged.callCount, 1);
+
+      el.setProperties({
+        x: 3,
+        z: 300
+      });
+      assert.equal(el.xy, '323');
+      assert.equal(el.computeXYSpy.callCount, 2);
+      assert.equal(el.xyChanged.callCount, 2);
+    });
+
+    test('ensure circular dependencies do not iloop', function() {
+      el.circIn = 1;
+      // The answers here don't _really_ matter; it just shouldn't iloop
+      // circA will go first (defined first), which will pull circB, which
+      // has no circA yet, and thus returns 1 for this turn
+      assert.ok(el.circA); // should be equal to 2, based on impl
+      assert.ok(el.circB); // should be equal to 1, based on impl
+    });
+
+  });
+
+}
+
 </script>
 
 </body>
diff --git a/test/unit/styling-build-adopted-stylesheets.html b/test/unit/styling-build-adopted-stylesheets.html
new file mode 100644
index 0000000000..ae11d5c336
--- /dev/null
+++ b/test/unit/styling-build-adopted-stylesheets.html
@@ -0,0 +1,1031 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <script src="../../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
+  <script>
+    window.ShadyCSS['cssBuild'] = true;
+  </script>
+  <script src="wct-browser-config.js"></script>
+  <script src="../../node_modules/wct-browser-legacy/browser.js"></script>
+  <script type="module">
+    import {
+      setUseAdoptedStyleSheetsWithBuiltCSS,
+      supportsAdoptingStyleSheets,
+    } from '../../lib/utils/settings.js';
+    setUseAdoptedStyleSheetsWithBuiltCSS(true);
+    window.supportsAdoptingStyleSheets = supportsAdoptingStyleSheets;
+    let define = window.customElements.define;
+    let order = [];
+    window.customElements.define = function(name, fn, options) {
+      order.push(name);
+      return define.call(window.customElements, name, fn, options);
+    };
+    customElements.defineOrder = order;
+  </script>
+</head>
+<body>
+
+<dom-module id="x-keyframes">
+  <template css-build="shadow">
+    <style>
+      :host {
+        display: block;
+        position: relative;
+        border: 10px solid blue;
+        left: 0px;
+        /* Prefix required by Safari <= 8 */
+        -webkit-animation-duration: 0.3s;
+        animation-duration: 0.3s;
+        -webkit-animation-fill-mode: forwards;
+        animation-fill-mode: forwards;
+      }
+
+      :host([animated]) {
+        /* Prefix required by Safari <= 8 */
+        -webkit-animation-name: x-keyframes-animation;
+        animation-name: x-keyframes-animation;
+      }
+
+      /* Prefix required by Safari <= 8 */
+      @-webkit-keyframes x-keyframes-animation {
+        0% {
+          left: var(--keyframes0, 0px);
+        }
+
+        100% {
+          left: var(--keyframes100, 10px);
+        }
+      }
+      @keyframes x-keyframes-animation {
+        0% {
+          left: var(--keyframes0, 0px);
+        }
+
+        100% {
+          left: var(--keyframes100, 10px);
+        }
+      }
+    </style>
+    x-keyframes
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-keyframes',
+  properties: {
+    animated: {
+      type: Boolean,
+      value: false,
+      reflectToAttribute: true
+    }
+  }
+});
+</script>
+</dom-module>
+<dom-module id="x-gchild">
+  <template css-build="shadow">
+    <style>
+    </style>
+    <div id="target">x-gchild</div>
+  </template>
+</dom-module>
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-gchild'
+});
+</script>
+
+<dom-module id="x-child">
+  <template css-build="shadow">
+    <div id="simple">simple</div>
+    <div id="complex1" class="scoped">complex1</div>
+    <div id="complex2" selected>complex2</div>
+    <div id="media">media</div>
+    <div id="shadow" class="shadowTarget">shadowTarget</div>
+    <div id="deep" class="deepTarget">deepTarget</div>
+    <x-gchild id="gchild1"></x-gchild>
+    <x-gchild id="gchild2" class="wide"></x-gchild>
+  </template>
+</dom-module>
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-child',
+  hostAttributes: {
+    class: 'nug'
+  }
+});
+</script>
+
+<dom-module id="x-child2">
+  <template css-build="shadow">
+    <style>
+      :host(.wide) #target{
+        border: none;
+      }
+    </style>
+    <div id="target">x-child2</div>
+  </template>
+</dom-module>
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-child2'
+});
+</script>
+
+<dom-module id="x-scope-class">
+  <template css-build="shadow">
+    <div id="scope">Trivial</div>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-scope-class'
+});
+</script>
+</dom-module>
+
+<dom-module id="x-class-literal">
+  <template css-build="shadow">
+    <div id="scope" class$="a [[b]] c" class="d e">Trivial</div>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-class-literal'
+});
+</script>
+</dom-module>
+
+
+
+<dom-module id="x-styled">
+  <template css-build="shadow">
+    <style>
+      :host {
+        display: block;
+        border: 1px solid orange;
+        --keyframes100: 100px;
+      }
+
+      :host(.wide) {
+        border-width: 2px;
+      }
+
+      :host(.wide)::after {
+        content: '-content-';
+      }
+
+      #keyframes2.special {
+        --keyframes100: 200px;
+      }
+
+      #simple {
+        border: 3px solid orange;
+      }
+
+      .scoped, [selected] {
+        border: 4px solid pink;
+      }
+
+      @media(max-width: 10000px) {
+        .media {
+          border: 5px solid brown;
+        }
+      }
+
+      .container ::slotted(*) {
+        border: 6px solid navy;
+      }
+
+      #priority {
+        border: 9px solid orange;
+      }
+
+      .container1 > ::slotted([slot=content1]) {
+        border: 13px solid navy;
+      }
+
+      .container2 > ::slotted([slot=content2]) {
+        border: 14px solid navy;
+      }
+
+      .computed {
+        border: 15px solid orange;
+      }
+
+      .computeda {
+        border: 20px solid orange;
+      }
+
+      .a.computedb {
+        border: 16px solid gray;
+      }
+
+      #child {
+        border: 16px solid tomato;
+        display: block;
+      }
+
+      svg {
+        margin-top: 20px;
+      }
+
+      #circle {
+        fill: seagreen;
+        stroke-width: 1px;
+        stroke: tomato;
+      }
+    </style>
+    <slot name="blank"></slot>
+    <div id="simple">simple</div>
+    <div id="complex1" class="scoped">complex1</div>
+    <div id="complex2" selected>complex2</div>
+    <div id="media" class="media">media</div>
+    <div class="container1">
+      <slot name="content1"></slot>
+    </div>
+    <div class="container2">
+      <slot name="content2"></slot>
+    </div>
+    <div class="container">
+      <slot></slot>
+    </div>
+    <x-child id="child"></x-child>
+    <div id="priority">priority</div>
+    <x-child2 class="wide" id="child2"></x-child2>
+    <div id="computed" class$="{{computeClass(aClass)}}">Computed</div>
+    <div>
+      <div id="computed2" class$="a {{computeClass('computedb')}}">Computed</div>
+    </div>
+    <div id="repeatContainer">
+      <template css-build="shadow" id="repeat" is="dom-repeat" items="{{items}}">
+        <a class$="{{aaClass}}">A Computed</a>
+      </template>
+    </div>
+    <svg height="25" width="25">
+      <circle id="circle" cx="12" cy="12" r="10"></circle>
+    </svg>
+    <x-scope-class id="scopeClass"></x-scope-class>
+    <x-keyframes id="keyframes"></x-keyframes>
+    <x-keyframes id="keyframes2"></x-keyframes>
+  </template>
+</dom-module>
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-styled',
+
+  properties: {
+    items: {value: [{}]}
+  },
+
+  computeClass: function(className) {
+    return className;
+  }
+
+});
+</script>
+
+<template css-build="shadow" id="dynamic">
+  <div class="added">
+    Added
+    <div class="sub-added">
+      Sub-added
+    </div>
+  </div>
+</template>
+
+<dom-module id="x-dynamic-scope">
+  <template css-build="shadow">
+    <style>
+      .added {
+        border: 17px solid beige;
+      }
+
+      .sub-added {
+        border: 18px solid #fafafa;
+      }
+    </style>
+    <div id="container"></div>
+  </template>
+</dom-module>
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+var doc = window.document;
+var dynamic = doc.querySelector('template#dynamic');
+
+Polymer({
+  is: 'x-dynamic-scope',
+  ready: function() {
+    // simulate 3rd party action by using normal dom to add to element.
+    var dom = document.importNode(dynamic.content, true);
+    this.$.container.appendChild(dom);
+  }
+});
+</script>
+
+<template css-build="shadow" id="dynamic-style-template">
+  <style>
+    :host {
+      border: 40px solid tomato;
+    }
+  </style>
+  <div>big border</div>
+</template>
+
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+var doc = window.document;
+var template = doc.querySelector('template#dynamic-style-template');
+
+Polymer({
+  is: 'x-dynamic-template',
+  registered: function() {
+    this._template = template;
+  }
+});
+</script>
+
+<template css-build="shadow" id="svg">
+  <svg class="svg" viewBox="0 0 24 24">
+    <circle id="circle" r="12" cx="12" cy="12" />
+  </svg>
+</template>
+
+<dom-module id="x-dynamic-svg">
+  <template css-build="shadow">
+    <style>
+      .svg {
+        height: 24px;
+        width: 24px;
+      }
+      #circle {
+        fill: red;
+        fill-opacity: 0.5;
+      }
+    </style>
+    <div id="container"></div>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+var doc = window.document;
+var template = doc.querySelector('template#svg');
+
+Polymer({
+  is: 'x-dynamic-svg',
+  ready: function() {
+    this.scopeSubtree(this.$.container, true);
+    var dom = document.importNode(template.content, true);
+    this.$.container.appendChild(dom);
+  }
+});
+</script>
+</dom-module>
+
+<dom-module id="x-specificity">
+  <template css-build="shadow">
+    <style>
+      :host {
+        border-top: 1px solid red;
+      }
+      :host(.bar) {
+        border-top: 2px solid red;
+      }
+    </style>
+    <slot></slot>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-specificity'});
+</script>
+</dom-module>
+
+<custom-style>
+  <style>
+    html {
+      --x-specificity-parent: 10px solid blue;
+      --x-specificity-nested: 3px solid red;
+    }
+  </style>
+</custom-style>
+
+<dom-module id="x-specificity-parent">
+  <template css-build="shadow">
+    <style>
+      ::slotted(:not(template)) {
+        border: var(--x-specificity-parent);
+      }
+    </style>
+    <slot></slot>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-specificity-parent'});
+</script>
+</dom-module>
+
+<dom-module id="x-specificity-nested">
+  <template css-build="shadow">
+    <style>
+      :host {
+        border: var(--x-specificity-nested);
+      }
+    </style>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-specificity-nested'});
+</script>
+</dom-module>
+
+<custom-style>
+  <style>
+    html {
+      --x-overriding: 1px solid red;
+    }
+  </style>
+</custom-style>
+
+<dom-module id="x-overriding">
+  <template css-build="shadow">
+    <style>
+      .red {
+        border-top: var(--x-overriding);
+      }
+      .green {
+        border-top: var(--x-overriding);
+        border-top: 2px solid green;
+      }
+      .red-2 {
+        border-top: 2px solid green;
+        border-top: var(--x-overriding);
+      }
+      .blue {
+        border-top: var(--x-overriding);
+        border-top: 3px solid blue;
+      }
+    </style>
+
+    <div class="red">red</div>
+    <div class="green">green</div>
+    <div class="red-2">green-2</div>
+    <div class="blue">blue</div>
+  </template>
+</dom-module>
+
+<script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({
+  is: 'x-overriding'
+});
+</script>
+
+<dom-module id="x-attr-selector">
+  <template css-build="shadow">
+    <style>
+      #foo1 ~ #bar1 {
+        border: 2px solid red;
+      }
+
+      #foo1 ~ #bar1 ~ #foo2[attr~=foo2] ~ #bar2[attr~=bar2]  {
+        border: 4px solid red;
+      }
+
+      #foo1 ~ #bar1 ~ #foo2[attr~=foo2] ~ #bar2[attr~=bar2] ~ #foo3[attr~=foo3][a~=a] ~ #bar3[attr~=bar3][a~=a] {
+        border: 6px solid red;
+      }
+    </style>
+    <div id="foo1"></div>
+    <div id="bar1">bar1</div>
+    <div id="foo2" attr="foo2"></div>
+    <div id="bar2" attr="bar2">bar2</div>
+    <div id="foo3" attr="foo3" a="a"></div>
+    <div id="bar3" attr="bar3" a="a">bar3</div>
+
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-attr-selector'});
+</script>
+</dom-module>
+
+<dom-module id="x-shared1">
+  <template css-build="shadow">
+    <style>
+      :host(x-shared1) {
+        display: block;
+        border: 2px solid orange;
+      }
+
+      :host(x-shared2) {
+        display: block;
+        border: 4px solid orange;
+      }
+
+      :host(.x-shared1) {
+        top: 10px;
+      };
+    </style>
+    x-shared1
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-shared1'});
+</script>
+</dom-module>
+
+<dom-module id="x-shared2">
+  <template css-build="shadow">
+    <style>
+      :host(x-shared1) {
+        display: block;
+        border: 2px solid orange;
+      }
+
+      :host(x-shared2) {
+        display: block;
+        border: 4px solid orange;
+      }
+
+      :host(.x-shared1) {
+        top: 10px;
+      };
+    </style>
+    x-shared2
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-shared2'});
+</script>
+</dom-module>
+
+<dom-module id="x-slotted">
+  <template css-build="shadow">
+    <style>
+    ::slotted(.auto-content) {
+      border: 2px solid orange;
+    }
+    .bar, ::slotted(.complex-child) {
+      border: 6px solid navy;
+    }
+    #container ::slotted(*) {
+      border: 8px solid green;
+    }
+    </style>
+    <slot></slot>
+    <div id="container">
+      <slot name="container"></slot>
+    </div>
+  </template>
+  <script type="module">
+import { Polymer } from '../../polymer-legacy.js';
+Polymer({is: 'x-slotted'});
+</script>
+</dom-module>
+
+<template css-build="shadow" id="xClass">
+  <style>
+    :host {
+      display: block;
+      border: 1px solid orange;
+    }
+  </style>
+</template>
+<script type="module">
+import { PolymerElement, html } from '../../polymer-element.js';
+customElements.define('x-class-no-is', class extends PolymerElement {
+  static get template() {
+    return window.xClass;
+  }
+});
+
+customElements.define('x-template-string', class extends PolymerElement {
+  static get template() {
+    return html`<style>
+      :host {
+        display: block;
+        border: 1px solid orange;
+      }
+    </style>;`;
+  }
+});
+</script>
+
+
+  <div class="scoped">no margin</div>
+
+  <x-styled>
+    <div slot="content1">Foo</div>
+    <div slot="content2">Bar</div>
+    <div class="content">Content</div>
+  </x-styled>
+
+  <x-styled class="wide"></x-styled>
+
+  <x-dynamic-scope></x-dynamic-scope>
+
+  <dom-bind id="bind">
+    <template css-build="shadow">
+      <div id="dom-bind-static" class="static">static</div>
+      <span id="dom-bind-dynamic" class$="[[dynamic]]">[[dynamic]]</span>
+    </template>
+  </dom-bind>
+
+  <x-dynamic-svg></x-dynamic-svg>
+  <x-specificity></x-specificity>
+  <x-specificity class="bar"></x-specificity>
+  <x-specificity-parent>
+    <x-specificity-nested></x-specificity-nested>
+  </x-specificity-parent>
+  <x-overriding></x-overriding>
+
+  <dom-module id="x-nested-style">
+    <template css-build="shadow">
+      <div id="container">
+        <style>
+          :host {
+            display: block;
+            border: 10px solid black;
+          }
+        </style>
+        <style>
+            :host {
+              padding-top: 10px;
+            }
+          </style>
+      </div>
+    </template>
+    <script type="module">
+import { PolymerElement } from '../../polymer-element.js';
+class XNestedStyle extends PolymerElement {
+  static get is() {return 'x-nested-style';}
+}
+customElements.define(XNestedStyle.is, XNestedStyle);
+</script>
+  </dom-module>
+
+  <dom-module id="x-interleaved-styles">
+    <template css-build="shadow">
+      <style include="x-nested-style"></style>
+      <style>
+        :host {
+          padding-top: 5px;
+        }
+      </style>
+      <style>
+        :host {
+          color: blue;
+        }
+      </style>
+    </template>
+    <script type="module">
+import { PolymerElement } from '../../polymer-element.js';
+class XInterleaved extends PolymerElement {
+  static get is() {return 'x-interleaved-styles';}
+}
+customElements.define(XInterleaved.is, XInterleaved);
+</script>
+  </dom-module>
+
+<script type="module">
+  import { PolymerElement, html } from '../../polymer-element.js';
+  class ClassBindingUndefined extends PolymerElement {
+    static get is() { return 'class-binding-undefined'; }
+    static get properties() {
+      return {
+        data: {
+          type: Object
+        }
+      };
+    }
+    static get template() {
+      return html`
+      <style>
+        div {
+          border: 10px solid black;
+        }
+      </style>
+      <div id="div" class$="[[data.class]]">Foo</div>
+      `;
+    }
+  }
+  customElements.define(ClassBindingUndefined.is, ClassBindingUndefined);
+</script>
+
+<script type="module">
+import { dom } from '../../lib/legacy/polymer.dom.js';
+import { flush } from '../../lib/utils/flush.js';
+function assertComputed(element, value, property, pseudo) {
+  var computed = getComputedStyle(element, pseudo);
+  property = property || 'border-top-width';
+  if (Array.isArray(value)) {
+    assert.oneOf(computed[property], value, 'computed style incorrect for ' + property);
+  } else {
+    assert.equal(computed[property], value, 'computed style incorrect for ' + property);
+  }
+}
+
+var styled = document.querySelector('x-styled');
+var styledWide = document.querySelector('x-styled.wide');
+var unscoped = document.querySelector('.scoped');
+
+suite('scoped-styling', function() {
+
+  test('uses adoptedStyleSheets if possible', function() {
+    if (!window.supportsAdoptingStyleSheets) {
+      this.skip();
+    }
+    assert.ok(styled.shadowRoot.adoptedStyleSheets.length);
+  });
+
+  test(':host, :host(...)', function() {
+    assertComputed(styled, '1px');
+    assertComputed(styledWide, '2px');
+    assertComputed(styled, ['', 'none'], 'content', '::after');
+    assertComputed(styledWide, ['"-content-"', '-content-'], 'content', '::after');
+  });
+
+  test('scoped selectors, simple and complex', function() {
+    assertComputed(styled.$.simple, '3px');
+    assertComputed(styled.$.complex1, '4px');
+    assertComputed(styled.$.complex2, '4px');
+  });
+
+  test('media query scoped selectors', function() {
+    assertComputed(styled.$.media, '5px');
+  });
+
+  test('upper bound encapsulation', function() {
+    assertComputed(unscoped, '0px');
+  });
+
+  test('lower bound encapsulation', function() {
+    assertComputed(styled.$.child.$.simple, '0px');
+    assertComputed(styled.$.child.$.complex1, '0px');
+    assertComputed(styled.$.child.$.complex2, '0px');
+    assertComputed(styled.$.child.$.media, '0px');
+  });
+
+  test('::slotted selectors', function() {
+    var content = document.querySelector('.content');
+    var content1 = document.querySelector('[slot=content1]');
+    var content2 = document.querySelector('[slot=content2]');
+    assertComputed(content, '6px');
+    assertComputed(content1, '13px');
+    assertComputed(content2, '14px');
+  });
+
+  test('auto ::slotted selector', function() {
+    var x = document.createElement('x-slotted');
+    var d1 = document.createElement('div');
+    d1.classList.add('auto-content');
+    d1.textContent = 'auto-content';
+    document.body.appendChild(x);
+    dom(x).appendChild(d1);
+    flush();
+    assertComputed(d1, '2px');
+  });
+
+  test('::slotted + child in complex selector', function() {
+    var x = document.createElement('x-slotted');
+    var d1 = document.createElement('div');
+    d1.classList.add('complex-child');
+    d1.textContent = 'complex-child';
+    document.body.appendChild(x);
+    dom(x).appendChild(d1);
+    flush();
+    assertComputed(d1, '6px');
+  });
+
+  test('::slotted + named slot', function() {
+    var x = document.createElement('x-slotted');
+    var d1 = document.createElement('div');
+    d1.setAttribute('slot', 'container');
+    d1.textContent = 'named slot child';
+    document.body.appendChild(x);
+    dom(x).appendChild(d1);
+    flush();
+    assertComputed(d1, '8px');
+  });
+
+  test('elements dynamically added/removed from root', function() {
+    var d = document.createElement('div');
+    d.classList.add('scoped');
+    d.textContent = 'Dynamically... Scoped!';
+    dom(styled.root).appendChild(d);
+    flush();
+    assertComputed(d, '4px');
+    dom(document.body).appendChild(d);
+    flush();
+    assert.notInclude(d.getAttribute('style-scoped') || '', styled.is, 'scoping attribute not removed when added to other root');
+    assert.notInclude(d.className, styled.is, 'scoping class not removed when added to other root');
+    assertComputed(d, '0px');
+    dom(styled.root).appendChild(d);
+    flush();
+    assertComputed(d, '4px');
+  });
+
+  test('elements dynamically added/removed from host', function() {
+    var d = document.createElement('div');
+    d.classList.add('scoped');
+    d.slot = 'blank';
+    d.textContent = 'Dynamically... unScoped!';
+    dom(styled).appendChild(d);
+    flush();
+    assertComputed(d, '0px');
+    dom(document.body).appendChild(d);
+    flush();
+    assert.notInclude(d.getAttribute('style-scoped') || '', styled.is, 'scoping attribute not removed when added to other root');
+    assert.notInclude(d.className, styled.is, 'scoping class not removed when added to other root');
+    dom(styled).appendChild(d);
+    flush();
+    assertComputed(d, '0px');
+    dom(styled).removeChild(d);
+    flush();
+    assert.notInclude(d.getAttribute('style-scoped') || '', styled.is, 'scoping attribute not removed when removed from root');
+    assert.notInclude(d.className, styled.is, 'scoping class not removed when removed from root');
+    dom(styled).appendChild(d);
+    flush();
+    assertComputed(d, '0px');
+  });
+
+  test('keyframes change scope', function(done) {
+    if (navigator.userAgent.match('Edge') && (!window.ShadyCSS || window.ShadyCSS.nativeCss)) {
+      // skip test due to missing variable support in keyframes
+      // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12084341/
+      this.skip();
+    }
+    var xKeyframes = styled.$.keyframes;
+
+    var onAnimationEnd = function() {
+      xKeyframes.removeEventListener('animationend', onAnimationEnd);
+      xKeyframes.removeEventListener('webkitAnimationEnd', onAnimationEnd);
+      assertComputed(xKeyframes, '100px', 'left');
+
+      xKeyframes = styled.$.keyframes2;
+
+      onAnimationEnd = function() {
+        xKeyframes.removeEventListener('animationend', onAnimationEnd);
+        xKeyframes.removeEventListener('webkitAnimationEnd', onAnimationEnd);
+        assertComputed(xKeyframes, '200px', 'left');
+        done();
+      };
+
+      xKeyframes.addEventListener('animationend', onAnimationEnd);
+      xKeyframes.addEventListener('webkitAnimationEnd', onAnimationEnd);
+
+      dom(xKeyframes).classList.add('special');
+      xKeyframes.updateStyles();
+      xKeyframes.animated = true;
+    };
+
+    xKeyframes.addEventListener('animationend', onAnimationEnd);
+    xKeyframes.addEventListener('webkitAnimationEnd', onAnimationEnd);
+
+    xKeyframes.animated = true;
+    assertComputed(xKeyframes, '0px', 'left');
+  });
+
+  test('elements with computed classes', function() {
+    assertComputed(styled.$.computed, '0px');
+    styled.aClass = 'computed';
+    assertComputed(styled.$.computed, '15px');
+    assertComputed(styled.$.computed2, '16px');
+  });
+
+  test('<a> with computed classes dynamically added', function() {
+    assertComputed(styled.$.repeatContainer.firstElementChild, '0px');
+    styled.aaClass = 'computeda';
+    assertComputed(styled.$.repeatContainer.firstElementChild, '20px');
+  });
+
+  test('elements with hostAttributes: class', function() {
+    assertComputed(styled.$.child, '16px');
+  });
+
+  test('element subtree added via dom api', function() {
+    var container = document.querySelector('x-dynamic-scope').$.container;
+    var a = container.querySelector('.added');
+    assertComputed(a, '17px');
+    var b = container.querySelector('.sub-added');
+    assertComputed(b, '18px');
+  });
+
+  test('styles in dynamically selected template', function() {
+    var el = document.createElement('x-dynamic-template');
+    document.body.appendChild(el);
+    if (el.shadowRoot) {
+      // style properly removed
+      assert.notOk(el.querySelector('style'));
+    }
+    assertComputed(el, '40px');
+    document.body.removeChild(el);
+  });
+
+  test('attribute inclusive selector and general sibling selectors', function() {
+    var e = document.createElement('x-attr-selector');
+    document.body.appendChild(e);
+    flush();
+    assertComputed(e.$.bar1, '2px');
+    assertComputed(e.$.bar2, '4px');
+    assertComputed(e.$.bar3, '6px');
+  });
+
+  test('svg classes are dynamically scoped correctly', function() {
+    var container = document.querySelector('x-dynamic-svg').$.container;
+    var svg = container.querySelector('.svg');
+    var computed = getComputedStyle(svg);
+    assert.equal(computed.height, '24px');
+    assert.equal(computed.width, '24px');
+    var circle = container.querySelector('#circle');
+    computed = getComputedStyle(circle);
+    assert.equal(computed['fill-opacity'], '0.5');
+  });
+
+  test(':host with element tag selector', function() {
+    var s1 = document.createElement('x-shared1');
+    document.body.appendChild(s1);
+    assertComputed(s1, '2px');
+    var s2 = document.createElement('x-shared2');
+    document.body.appendChild(s2);
+    assertComputed(s2, '4px');
+  });
+
+  test(':host with superset of element tag selector does not leak', function() {
+    var t = document.createElement('div');
+    t.textContent = 'host leak test';
+    t.classList.add('x-shared1');
+    document.body.appendChild(t);
+    assertComputed(t, 'auto', 'top');
+  });
+
+  test(':host(...) with non-matching type selector does not leak', function() {
+    var t = document.createElement('x-shared1x-shared2');
+    t.textContent = ':host(non-matching-type-selector)';
+    document.body.appendChild(t);
+    assertComputed(t, '0px');
+    t = document.createElement('x-shared2x-shared1');
+    t.textContent = ':host(non-matching-type-selector)';
+    document.body.appendChild(t);
+    assertComputed(t, '0px');
+  });
+
+  test('static is not required for scoping styling', function() {
+    var e = document.createElement('x-class-no-is');
+    document.body.appendChild(e);
+    assertComputed(e, '1px');
+  });
+
+  test('template string has scoped styling', function() {
+    var e = document.createElement('x-template-string');
+    document.body.appendChild(e);
+    assertComputed(e, '1px');
+  });
+
+  test('styles work correctly when not direct children of the template', function() {
+    var e = document.createElement('x-nested-style');
+    document.body.appendChild(e);
+    assertComputed(e, '10px');
+    assertComputed(e, '10px', 'padding-top');
+  });
+
+  test('interleaved styles and styles with includes work as expected', function() {
+    var e = document.createElement('x-interleaved-styles');
+    document.body.appendChild(e);
+    assertComputed(e, '5px', 'padding-top');
+  });
+
+  test('initial literal values in class are preserved when a class$ binding is present', function() {
+    var e = document.createElement('x-class-literal');
+    document.body.appendChild(e);
+    var el = e.$.scope;
+    assert.isTrue(el.classList.contains('a'));
+    assert.isTrue(el.classList.contains('c'));
+    assert.isTrue(el.classList.contains('d'));
+    assert.isTrue(el.classList.contains('e'));
+  });
+
+  test('scoping classes are preserved when a class$ binding resolves to undefined', function() {
+    const e = document.createElement('class-binding-undefined');
+    document.body.appendChild(e);
+    const el = e.$.div;
+    assertComputed(el, '10px');
+  });
+
+});
+</script>
+</body>
+</html>
diff --git a/util/travis-sauce-test.sh b/util/travis-sauce-test.sh
index c2f80dd32b..ee4eb92a61 100755
--- a/util/travis-sauce-test.sh
+++ b/util/travis-sauce-test.sh
@@ -9,4 +9,4 @@
 # subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 #
 set -x
-node ./node_modules/.bin/polymer test --npm --module-resolution=node -s 'windows 10/microsoftedge@15' -s 'windows 10/microsoftedge@17' -s 'windows 8.1/internet explorer@11' -s 'os x 10.11/safari@9' -s 'macos 10.12/safari@10' -s 'macos 10.13/safari@11' -s 'Linux/chrome@41'
\ No newline at end of file
+node ./node_modules/.bin/polymer test --npm --module-resolution=node -s 'windows 10/microsoftedge@15' -s 'windows 10/microsoftedge@17' -s 'windows 8.1/internet explorer@11' -s 'macos 10.13/safari@11' -s 'macos 10.13/safari@12' -s 'macos 10.13/safari@13' -s 'Linux/chrome@41'
\ No newline at end of file