From b8f3b79c725749a360650a5e487759053f5f8329 Mon Sep 17 00:00:00 2001 From: Steven Orvell Date: Fri, 7 Dec 2018 16:22:54 -0800 Subject: [PATCH] More shady compatible wrapping Sync'd with Polymer 1 wrap locations --- lib/elements/dom-bind.js | 3 +- lib/legacy/legacy-element-mixin.js | 12 ++++-- lib/utils/gestures.js | 64 +++++++++++++++--------------- 3 files changed, 43 insertions(+), 36 deletions(-) diff --git a/lib/elements/dom-bind.js b/lib/elements/dom-bind.js index 9613ab9e3e..e02d041a90 100644 --- 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/legacy/legacy-element-mixin.js b/lib/legacy/legacy-element-mixin.js index 23e512e9a1..8315297c2e 100644 --- a/lib/legacy/legacy-element-mixin.js +++ b/lib/legacy/legacy-element-mixin.js @@ -482,7 +482,9 @@ export const LegacyElementMixin = dedupingMixin((base) => { * @return {Element} Element found by the selector, or null if not found. */ $$(slctr) { - return this.root.querySelector(slctr); + const root = /** @type {Element} */ (this.root); + const domApi = /** @type {DomApi} */(dom(root)); + return domApi.querySelector(slctr); } /** @@ -503,7 +505,9 @@ export const LegacyElementMixin = dedupingMixin((base) => { * @return {void} */ distributeContent() { - if (window.ShadyDOM && this.shadowRoot) { + const thisEl = /** @type {Element} */ (this); + const domApi = /** @type {DomApi} */(dom(thisEl)); + if (window.ShadyDOM && domApi.shadowRoot) { ShadyDOM.flush(); } } @@ -603,7 +607,9 @@ export const LegacyElementMixin = dedupingMixin((base) => { * @return {!Array} List of distributed nodes for the ``. */ getContentChildNodes(slctr) { - let content = this.root.querySelector(slctr || 'slot'); + const root = /** @type {Element} */ (this.root); + const domApi = /** @type {DomApi} */(dom(root)); + let content = domApi.querySelector(slctr || 'slot'); return content ? /** @type {DomApi} */(dom(content)).getDistributedNodes() : []; } diff --git a/lib/utils/gestures.js b/lib/utils/gestures.js index ce2342bfac..37cfaf6cce 100644 --- a/lib/utils/gestures.js +++ b/lib/utils/gestures.js @@ -173,23 +173,21 @@ let mouseCanceller = function(mouseEvent) { // disable "ghost clicks" if (mouseEvent.type === 'click') { let clickFromLabel = false; - let path = mouseEvent.composedPath && mouseEvent.composedPath(); - if (path) { - for (let i = 0; i < path.length; i++) { - if (path[i].nodeType === Node.ELEMENT_NODE) { - if (path[i].localName === 'label') { - clickedLabels.push(path[i]); - } else if (canBeLabelled(path[i])) { - let ownerLabels = matchingLabels(path[i]); - // check if one of the clicked labels is labelling this element - for (let j = 0; j < ownerLabels.length; j++) { - clickFromLabel = clickFromLabel || clickedLabels.indexOf(ownerLabels[j]) > -1; - } + let path = getComposedPath(mouseEvent); + for (let i = 0; i < path.length; i++) { + if (path[i].nodeType === Node.ELEMENT_NODE) { + if (path[i].localName === 'label') { + clickedLabels.push(path[i]); + } else if (canBeLabelled(path[i])) { + let ownerLabels = matchingLabels(path[i]); + // check if one of the clicked labels is labelling this element + for (let j = 0; j < ownerLabels.length; j++) { + clickFromLabel = clickFromLabel || clickedLabels.indexOf(ownerLabels[j]) > -1; } } - if (path[i] === POINTERSTATE.mouse.target) { - return; - } + } + if (path[i] === POINTERSTATE.mouse.target) { + return; } } // if one of the clicked labels was labelling the target element, @@ -229,7 +227,7 @@ function ignoreMouse(e) { POINTERSTATE.mouse.target = null; POINTERSTATE.mouse.mouseIgnoreJob = null; }; - POINTERSTATE.mouse.target = e.composedPath()[0]; + POINTERSTATE.mouse.target = getComposedPath(e)[0]; POINTERSTATE.mouse.mouseIgnoreJob = Debouncer.debounce( POINTERSTATE.mouse.mouseIgnoreJob , timeOut.after(MOUSE_TIMEOUT) @@ -303,14 +301,12 @@ let POINTERSTATE = { function firstTouchAction(ev) { let ta = 'auto'; - let path = ev.composedPath && ev.composedPath(); - if (path) { - for (let i = 0, n; i < path.length; i++) { - n = path[i]; - if (n[TOUCH_ACTION]) { - ta = n[TOUCH_ACTION]; - break; - } + let path = getComposedPath(ev); + for (let i = 0, n; i < path.length; i++) { + n = path[i]; + if (n[TOUCH_ACTION]) { + ta = n[TOUCH_ACTION]; + break; } } return ta; @@ -334,6 +330,15 @@ function untrackDocument(stateObj) { // Use passive event listeners, if supported, to not affect scrolling performance document.addEventListener('touchend', ignoreMouse, SUPPORTS_PASSIVE ? {passive: true} : false); +/** + * Returns the composedPath for the given event. + * @param {Event} event to process + * @return {!Array} Path of the event + */ +const getComposedPath = window.ShadyDOM && window.ShadyDOM.noPatch ? + window.ShadyDOM.composedPath : + (event) => event.composedPath && event.composedPath() || []; + /** @type {!Object} */ export const gestures = {}; @@ -380,14 +385,9 @@ export function deepTargetFind(x, y) { * @return {EventTarget} Returns the event target. */ function _findOriginalTarget(ev) { - // shadowdom - if (ev.composedPath) { - const targets = /** @type {!Array} */(ev.composedPath()); - // It shouldn't be, but sometimes targets is empty (window on Safari). - return targets.length > 0 ? targets[0] : ev.target; - } - // shadydom - return ev.target; + const path = getComposedPath(ev); + // It shouldn't be, but sometimes path is empty (window on Safari). + return path.length > 0 ? path[0] : ev.target; } /**