From 6dd540b8565399866fca8081de02216d8737a6c1 Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Wed, 9 Sep 2020 15:03:00 +0300 Subject: [PATCH 1/6] feat(framework): Make _property-change publicly available --- packages/base/src/UI5Element.js | 35 ++++++++++++++++++++++++--------- 1 file changed, 26 insertions(+), 9 deletions(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 4431a7af3d5e..54536506eb39 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -59,10 +59,28 @@ class UI5Element extends HTMLElement { this._domRefReadyPromise._deferredResolve = deferredResolve; this._monitoredChildProps = new Map(); - this._firePropertyChange = false; + this._propertyChangeListeners = new Set(); this._shouldInvalidateParent = false; } + addEventListener(type, listener, options) { + if (type === "_property-change") { + this._propertyChangeListeners.add(listener); + } + return super.addEventListener(type, listener, options); + } + + removeEventListener(type, listener, options) { + if (type === "_property-change") { + this._propertyChangeListeners.delete(listener); + } + return super.addEventListener(type, listener, options); + } + + _hasPropertyChangeListeners() { + return !!this._propertyChangeListeners.size; + } + /** * Returns a unique ID for this UI5 Element * @@ -394,9 +412,7 @@ class UI5Element extends HTMLElement { * @private */ _attachChildPropertyUpdated(child, listenFor) { - const childMetadata = child.constructor.getMetadata(), - slotName = this.constructor._getSlotName(child), // all slotted children have the same configuration - childProperties = childMetadata.getProperties(); + const slotName = this.constructor._getSlotName(child); // all slotted children have the same configuration let observedProps = [], notObservedProps = []; @@ -404,7 +420,7 @@ class UI5Element extends HTMLElement { if (Array.isArray(listenFor)) { observedProps = listenFor; } else { - observedProps = Array.isArray(listenFor.props) ? listenFor.props : Object.keys(childProperties); + observedProps = Array.isArray(listenFor.include) ? listenFor.include : []; notObservedProps = Array.isArray(listenFor.exclude) ? listenFor.exclude : []; } @@ -413,7 +429,6 @@ class UI5Element extends HTMLElement { } child.addEventListener("_property-change", this._invalidateParentOnPropertyUpdate); - child._firePropertyChange = true; } /** @@ -421,7 +436,6 @@ class UI5Element extends HTMLElement { */ _detachChildPropertyUpdated(child) { child.removeEventListener("_property-change", this._invalidateParentOnPropertyUpdate); - child._firePropertyChange = false; } /** @@ -430,7 +444,7 @@ class UI5Element extends HTMLElement { _propertyChange(name, value) { this._updateAttribute(name, value); - if (this._firePropertyChange) { + if (this._hasPropertyChangeListeners()) { this.dispatchEvent(new CustomEvent("_property-change", { detail: { name, newValue: value }, composed: false, @@ -457,7 +471,10 @@ class UI5Element extends HTMLElement { } const { observedProps, notObservedProps } = propsMetadata; - if (observedProps.includes(prop.detail.name) && !notObservedProps.includes(prop.detail.name)) { + const allPropertiesAreObserved = observedProps.length === 1 && observedProps[0] === "*"; + const shouldObserve = allPropertiesAreObserved || observedProps.includes(prop.detail.name); + const shouldSkip = notObservedProps.includes(prop.detail.name); + if (shouldObserve && !shouldSkip) { parentNode._invalidate("_parent_", this); } } From 083a0c106519750c0eeade20c0bebc0704759317 Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Tue, 15 Sep 2020 17:25:04 +0300 Subject: [PATCH 2/6] fix --- packages/base/src/UI5Element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 54536506eb39..6634bca6dcb8 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -74,7 +74,7 @@ class UI5Element extends HTMLElement { if (type === "_property-change") { this._propertyChangeListeners.delete(listener); } - return super.addEventListener(type, listener, options); + return super.removeEventListener(type, listener, options); } _hasPropertyChangeListeners() { From 4088da5d82bdb971a6e96a1fe017afdd907e42ce Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Wed, 16 Sep 2020 09:07:27 +0300 Subject: [PATCH 3/6] do not bubble --- packages/base/src/UI5Element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 6634bca6dcb8..174ec4beb747 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -448,7 +448,7 @@ class UI5Element extends HTMLElement { this.dispatchEvent(new CustomEvent("_property-change", { detail: { name, newValue: value }, composed: false, - bubbles: true, + bubbles: false, })); } } From af2ccc78ebd92ca0d17561bb5d874ea88ba1363f Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Wed, 16 Sep 2020 10:12:18 +0300 Subject: [PATCH 4/6] revert the bubbles change --- packages/base/src/UI5Element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 174ec4beb747..6634bca6dcb8 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -448,7 +448,7 @@ class UI5Element extends HTMLElement { this.dispatchEvent(new CustomEvent("_property-change", { detail: { name, newValue: value }, composed: false, - bubbles: false, + bubbles: true, })); } } From 9e2267371ac6d1f99967400d34b68fa5cf2edaa1 Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Wed, 16 Sep 2020 12:34:55 +0300 Subject: [PATCH 5/6] bubbles --- packages/base/src/UI5Element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 6634bca6dcb8..174ec4beb747 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -448,7 +448,7 @@ class UI5Element extends HTMLElement { this.dispatchEvent(new CustomEvent("_property-change", { detail: { name, newValue: value }, composed: false, - bubbles: true, + bubbles: false, })); } } From 1596bc1d59a8839d88c306c4e05ef107d7903a3b Mon Sep 17 00:00:00 2001 From: Vladislav Tasev Date: Wed, 16 Sep 2020 12:47:28 +0300 Subject: [PATCH 6/6] bump build --- packages/base/src/UI5Element.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js index 174ec4beb747..165e9edbd827 100644 --- a/packages/base/src/UI5Element.js +++ b/packages/base/src/UI5Element.js @@ -439,7 +439,7 @@ class UI5Element extends HTMLElement { } /** - * @private + * @private */ _propertyChange(name, value) { this._updateAttribute(name, value);