Merge pull request #5452 from Polymer/shady-nopatch

Changes to make compatible with `noPatch` version of ShadyDOM [3.x]
Polymer · Feb 7, 2019 · 7823d8a · 7823d8a
2 parents d637b7a + 073d25f
commit 7823d8a
Show file tree

Hide file tree

Showing 24 changed files with 1,355 additions and 856 deletions.
diff --git a/lib/elements/dom-bind.js b/lib/elements/dom-bind.js
@@ -13,6 +13,7 @@ import { PropertyEffects } from '../mixins/property-effects.js';
 import { OptionalMutableData } from '../mixins/mutable-data.js';
 import { GestureEventListeners } from '../mixins/gesture-event-listeners.js';
 import { strictTemplatePolicy } from '../utils/settings.js';
+import { wrap } from '../utils/wrap.js';
 
 /**
  * @constructor
@@ -87,7 +88,7 @@ export class DomBind extends domBindBase {
   }
 
   __insertChildren() {
-    this.parentNode.insertBefore(this.root, this);
+    wrap(wrap(this).parentNode).insertBefore(this.root, this);
   }
 
   __removeChildren() {

diff --git a/lib/elements/dom-if.js b/lib/elements/dom-if.js
@@ -14,6 +14,7 @@ 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';
 
 /**
  * The `<dom-if>` element will stamp a light-dom `<template>` child when
@@ -120,9 +121,9 @@ export class DomIf extends PolymerElement {
    */
   disconnectedCallback() {
     super.disconnectedCallback();
-    if (!this.parentNode ||
-        (this.parentNode.nodeType == Node.DOCUMENT_FRAGMENT_NODE &&
-         !this.parentNode.host)) {
+    const parent = wrap(this).parentNode;
+    if (!parent || (parent.nodeType == Node.DOCUMENT_FRAGMENT_NODE &&
+        !wrap(parent).host)) {
       this.__teardownInstance();
     }
   }
@@ -174,15 +175,15 @@ export class DomIf extends PolymerElement {
   }
 
   __ensureInstance() {
-    let parentNode = this.parentNode;
+    let parentNode = wrap(this).parentNode;
     // Guard against element being detached while render was queued
     if (parentNode) {
       if (!this.__ctor) {
-        let template = /** @type {HTMLTemplateElement} */(this.querySelector('template'));
+        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 (this.querySelector('template')) {
+            if (wrap(this).querySelector('template')) {
               observer.disconnect();
               this.__render();
             } else {
@@ -219,16 +220,16 @@ export class DomIf extends PolymerElement {
       }
       if (!this.__instance) {
         this.__instance = new this.__ctor();
-        parentNode.insertBefore(this.__instance.root, this);
+        wrap(parentNode).insertBefore(this.__instance.root, this);
       } 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 = this.previousSibling;
+          let lastChild = wrap(this).previousSibling;
           if (lastChild !== c$[c$.length-1]) {
             for (let i=0, n; (i<c$.length) && (n=c$[i]); i++) {
-              parentNode.insertBefore(n, this);
+              wrap(parentNode).insertBefore(n, this);
             }
           }
         }
@@ -253,10 +254,11 @@ export class DomIf extends PolymerElement {
       let c$ = this.__instance.children;
       if (c$ && c$.length) {
         // use first child parent, for case when dom-if may have been detached
-        let parent = c$[0].parentNode;
-          // Instance children may be disconnected from parents when dom-if
-          // detaches if a tree was innerHTML'ed
-          if (parent) {
+        let parent = wrap(c$[0]).parentNode;
+        // Instance children may be disconnected from parents when dom-if
+        // detaches if a tree was innerHTML'ed
+        if (parent) {
+          parent = wrap(parent);
           for (let i=0, n; (i<c$.length) && (n=c$[i]); i++) {
             parent.removeChild(n);
           }

diff --git a/lib/elements/dom-repeat.js b/lib/elements/dom-repeat.js
@@ -15,6 +15,7 @@ import { enqueueDebouncer, flush } from '../utils/flush.js';
 import { OptionalMutableData } from '../mixins/mutable-data.js';
 import { matches, translate } from '../utils/path.js';
 import { timeOut, microTask } from '../utils/async.js';
+import { wrap } from '../utils/wrap.js';
 
 /**
  * @constructor
@@ -323,9 +324,9 @@ export class DomRepeat extends domRepeatBase {
     // only perform attachment if the element was previously detached.
     if (this.__isDetached) {
       this.__isDetached = false;
-      let parent = this.parentNode;
+      let wrappedParent = wrap(wrap(this).parentNode);
       for (let i=0; i<this.__instances.length; i++) {
-        this.__attachInstance(i, parent);
+        this.__attachInstance(i, wrappedParent);
       }
     }
   }
@@ -583,15 +584,17 @@ export class DomRepeat extends domRepeatBase {
 
   __detachInstance(idx) {
     let inst = this.__instances[idx];
+    const wrappedRoot = wrap(inst.root);
     for (let i=0; i<inst.children.length; i++) {
       let el = inst.children[i];
-      inst.root.appendChild(el);
+      wrappedRoot.appendChild(el);
     }
     return inst;
   }
 
   __attachInstance(idx, parent) {
     let inst = this.__instances[idx];
+    // Note, this is pre-wrapped as an optimization
     parent.insertBefore(inst.root, this);
   }
 
@@ -625,7 +628,7 @@ export class DomRepeat extends domRepeatBase {
     }
     let beforeRow = this.__instances[instIdx + 1];
     let beforeNode = beforeRow ? beforeRow.children[0] : this;
-    this.parentNode.insertBefore(inst.root, beforeNode);
+    wrap(wrap(this).parentNode).insertBefore(inst.root, beforeNode);
     this.__instances[instIdx] = inst;
     return inst;
   }

diff --git a/lib/legacy/class.js b/lib/legacy/class.js
@@ -180,7 +180,7 @@ function flattenBehaviors(behaviors, list, exclude) {
 /**
  * @param {!PolymerInit} info Polymer info object
  * @param {function(new:HTMLElement)} Base base class to extend with info object
- * @param {Object} behaviors behaviors to copy into the element
+ * @param {Object=} behaviors behaviors to copy into the element
  * @return {function(new:HTMLElement)} Generated class
  * @suppress {checkTypes}
  * @private
@@ -197,7 +197,7 @@ function GenerateClassFromInfo(info, Base, behaviors) {
     // explicitly not calling super._finalizeClass
     static _finalizeClass() {
       // if calling via a subclass that hasn't been generated, pass through to super
-      if (!this.hasOwnProperty(window.JSCompiler_renameProperty('generatedFrom', this))) {
+      if (!this.hasOwnProperty(JSCompiler_renameProperty('generatedFrom', this))) {
         super._finalizeClass();
       } else {
         // interleave properties and observers per behavior and `info`

diff --git a/lib/legacy/legacy-data-mixin.js b/lib/legacy/legacy-data-mixin.js
@@ -151,12 +151,31 @@ Polymer.Class = (info, mixin) => Class(info,
 
 // Apply LegacyDataMixin to Templatizer instances as well, and defer
 // runtime switch to the root's host (_methodHost)
-templatize.mixin = 
-  dedupingMixin(superClass => class extends LegacyDataMixin(superClass) {
-    get _legacyUndefinedCheck() {
-      return this._methodHost && this._methodHost._legacyUndefinedCheck;
+/**
+ * @mixinFunction
+ * @polymer
+ */
+const TemplatizeMixin =
+  dedupingMixin(superClass => {
+    /**
+     * @constructor
+     * @extends {HTMLElement}
+     */
+    const legacyBase = LegacyDataMixin(superClass);
+    /**
+     * @private
+     */
+    class TemplateLegacy extends legacyBase {
+      get _legacyUndefinedCheck() {
+        return this._methodHost && this._methodHost._legacyUndefinedCheck;
+      }
     }
+    /** @type {!Polymer_PropertyEffects} */
+    TemplateLegacy.prototype._methodHost;
+    return TemplateLegacy;
   });
 
+templatize.mixin = TemplatizeMixin;
+
 console.info('LegacyDataMixin will be applied to all legacy elements.\n' +
               'Set `_legacyUndefinedCheck: true` on element class to enable.');
diff --git a/lib/legacy/legacy-element-mixin.js b/lib/legacy/legacy-element-mixin.js
@@ -8,7 +8,6 @@ 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 { GestureEventListeners } from '../mixins/gesture-event-listeners.js';
 import { DirMixin } from '../mixins/dir-mixin.js';
@@ -20,6 +19,7 @@ import { setTouchAction } from '../utils/gestures.js';
 import { Debouncer } from '../utils/debounce.js';
 import { timeOut, microTask } from '../utils/async.js';
 import { get } from '../utils/path.js';
+import { wrap } from '../utils/wrap.js';
 
 let styleInterface = window.ShadyCSS;
 
@@ -419,7 +419,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
       });
       event.detail = detail;
       let node = options.node || this;
-      node.dispatchEvent(event);
+      wrap(node).dispatchEvent(event);
       return event;
     }
 
@@ -506,6 +506,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     $$(slctr) {
+      // Note, no need to `wrap` this because root is always patched
       return this.root.querySelector(slctr);
     }
 
@@ -516,7 +517,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @this {Element}
      */
     get domHost() {
-      let root = this.getRootNode();
+      let root = wrap(this).getRootNode();
       return (root instanceof DocumentFragment) ? /** @type {ShadowRoot} */ (root).host : root;
     }
 
@@ -528,7 +529,9 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     distributeContent() {
-      if (window.ShadyDOM && this.shadowRoot) {
+      const thisEl = /** @type {Element} */ (this);
+      const domApi = /** @type {PolymerDomApi} */(dom(thisEl));
+      if (window.ShadyDOM && domApi.shadowRoot) {
         ShadyDOM.flush();
       }
     }
@@ -638,6 +641,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     getContentChildNodes(slctr) {
+      // Note, no need to `wrap` this because root is always
       let content = this.root.querySelector(slctr || 'slot');
       return content ?
           /** @type {PolymerDomApi} */ (dom(content)).getDistributedNodes() :
@@ -678,8 +682,8 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      */
     isLightDescendant(node) {
       const thisNode = /** @type {Node} */ (this);
-      return thisNode !== node && thisNode.contains(node) &&
-        thisNode.getRootNode() === node.getRootNode();
+      return thisNode !== node && wrap(thisNode).contains(node) &&
+        wrap(thisNode).getRootNode() === wrap(node).getRootNode();
     }
 
     /**
@@ -690,7 +694,7 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     isLocalDescendant(node) {
-      return this.root === node.getRootNode();
+      return this.root === wrap(node).getRootNode();
     }
 
     /**
@@ -875,18 +879,18 @@ export const LegacyElementMixin = dedupingMixin((base) => {
      * @override
      */
     toggleAttribute(name, bool) {
-      let node = /** @type {Element} */ this;
+      let node = /** @type {Element} */(this);
       if (arguments.length === 3) {
-        node = /** @type {Element} */ arguments[2];
+        node = /** @type {Element} */(arguments[2]);
       }
       if (arguments.length == 1) {
         bool = !node.hasAttribute(name);
       }
       if (bool) {
-        node.setAttribute(name, '');
+        wrap(node).setAttribute(name, '');
         return true;
       } else {
-        node.removeAttribute(name);
+        wrap(node).removeAttribute(name);
         return false;
       }
     }