neo.mjs 5.15.1 → 5.15.2

package/apps/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='5.15.1'
+         * @member {String} version='5.15.2'
          */
-        version: '5.15.1'
+        version: '5.15.2'
     }
 
     /**

package/examples/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='5.15.1'
+         * @member {String} version='5.15.2'
          */
-        version: '5.15.1'
+        version: '5.15.2'
     }
 
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "neo.mjs",
-    "version": "5.15.1",
+    "version": "5.15.2",
     "description": "The webworkers driven UI framework",
     "type": "module",
     "repository": {

package/src/DefaultConfig.mjs

@@ -245,12 +245,12 @@ const DefaultConfig = {
     useVdomWorker: true,
     /**
      * buildScripts/injectPackageVersion.mjs will update this value
-     * @default '5.15.1'
+     * @default '5.15.2'
      * @memberOf! module:Neo
      * @name config.version
      * @type String
      */
-    version: '5.15.1'
+    version: '5.15.2'
 };
 
 Object.assign(DefaultConfig, {

package/src/component/Base.mjs

@@ -709,45 +709,7 @@ class Base extends CoreBase {
      * @protected
      */
     afterSetVdom(value, oldValue) {
-        let me   = this,
-            app  = Neo.apps[me.appName],
-            vdom = value,
-            listenerId;
-
-        // It is important to keep the vdom tree stable to ensure that containers do not lose the references to their
-        // child vdom trees. The if case should not happen, but in case it does, keeping the reference and merging
-        // the content over seems to be the best strategy
-        if (me._vdom !== vdom) {
-            Logger.warn('vdom got replaced for: ' + me.id + '. Copying the content into the reference holder object');
-
-            Object.keys(me._vdom).forEach(key => {
-                delete me._vdom[key]
-            });
-
-            vdom = Object.assign(me._vdom, vdom)
-        }
-
-        if (!me.needsParentUpdate()) {
-            if (me.silentVdomUpdate) {
-                me.needsVdomUpdate = true
-            } else {
-                if (!me.mounted && me.isConstructed && !me.hasRenderingListener && app?.rendering === true) {
-                    me.hasRenderingListener = true;
-
-                    listenerId = app.on('mounted', () => {
-                        app.un('mounted', listenerId);
-
-                        setTimeout(() => {
-                            me.vnode && me.updateVdom(me.vdom, me.vnode)
-                        }, 50)
-                    });
-                } else if (me.mounted && me.vnode && !me.isParentVdomUpdating()) {
-                    me.updateVdom(vdom, me.vnode)
-                }
-            }
-        }
-
-        me.hasUnmountedVdomChanges = !me.mounted && me.hasBeenMounted
+        this.updateVdom(value)
     }
 
     /**
@@ -1107,6 +1069,55 @@ class Base extends CoreBase {
         return ComponentManager.down(this, config, returnFirstMatch)
     }
 
+    /**
+     * Internal method to send update requests to the vdom worker
+     * @param {Object} vdom
+     * @param {Neo.vdom.VNode} vnode
+     * @param {function} [resolve] used by promiseVdomUpdate()
+     * @param {function} [reject] used by promiseVdomUpdate()
+     * @private
+     */
+    #executeVdomUpdate(vdom, vnode, resolve, reject) {
+        let me   = this,
+            opts = {vdom, vnode},
+            deltas;
+
+        me.isVdomUpdating = true;
+
+        // we can not set the config directly => it could already be false,
+        // and we still want to pass it further into subtrees
+        me._needsVdomUpdate = false;
+        me.afterSetNeedsVdomUpdate?.(false, true)
+
+        if (Neo.currentWorker.isSharedWorker) {
+            opts.appName = me.appName
+        }
+
+        Neo.vdom.Helper.update(opts).catch(err => {
+            console.log('Error attempting to update component dom', err, me);
+            me.isVdomUpdating = false;
+
+            reject?.()
+        }).then(data => {
+            // checking if the component got destroyed before the update cycle is done
+            if (me.id) {
+                // console.log('Component vnode updated', data);
+                me.vnode          = data.vnode;
+                me.isVdomUpdating = false;
+
+                deltas = data.deltas;
+
+                if (!Neo.config.useVdomWorker && deltas.length > 0) {
+                    Neo.applyDeltas(me.appName, deltas).then(() => {
+                        me.resolveVdomUpdate(resolve)
+                    })
+                } else {
+                    me.resolveVdomUpdate(resolve)
+                }
+            }
+        })
+    }
+
     /**
      * Calls focus() on the top level DOM node of this component or on a given node via id
      * @param {String} id=this.id
@@ -1397,6 +1408,7 @@ class Base extends CoreBase {
                         console.warn('vdom parent update conflict with:', parent, 'for:', me)
                     }
 
+                    console.log('add cache', me.id);
                     NeoArray.add(parent.childUpdateCache, me.id);
                     return true
                 } else {
@@ -1597,34 +1609,8 @@ class Base extends CoreBase {
      * @returns {Promise<any>}
      */
     promiseVdomUpdate(vdom=this.vdom, vnode=this.vnode) {
-        let me    = this,
-            _vdom = me.vdom;
-
-        // todo: updateVdom() should handle this
-        // It is important to keep the vdom tree stable to ensure that containers do not lose the references to their
-        // child vdom trees. The if case should not happen, but in case it does, keeping the reference and merging
-        // the content over seems to be the best strategy
-        if (_vdom !== vdom) {
-            Logger.warn('vdom got replaced for: ' + me.id + '. Copying the content into the reference holder object');
-
-            Object.keys(_vdom).forEach(key => {
-                delete _vdom[key];
-            });
-
-            vdom = Object.assign(me._vdom, vdom)
-        }
-
-        if (me.silentVdomUpdate) {
-            return Promise.resolve()
-        }
-
         return new Promise((resolve, reject) => {
-            if (me.mounted && me.vnode) {
-                me.updateVdom(vdom, vnode, resolve, reject)
-            } else {
-                me.update();
-                resolve()
-            }
+            this.updateVdom(vdom, vnode, resolve, reject)
         })
     }
 
@@ -1975,11 +1961,12 @@ class Base extends CoreBase {
     updateStyle(value, oldValue, id=this.id) {
         let me    = this,
             delta = Style.compareStyles(value, oldValue),
-            vdom  = VDomUtil.findVdomChild(me.vdom, id),
-            vnode = me.vnode && VNodeUtil.findChildVnode(me.vnode, id),
-            opts, vnodeStyle;
+            opts, vdom, vnode, vnodeStyle;
 
         if (delta) {
+            vdom  = VDomUtil.findVdomChild(me.vdom, id);
+            vnode = me.vnode && VNodeUtil.findChildVnode(me.vnode, id);
+
             if (!me.hasUnmountedVdomChanges) {
                 me.hasUnmountedVdomChanges = !me.mounted && me.hasBeenMounted
             }
@@ -2018,55 +2005,54 @@ class Base extends CoreBase {
 
     /**
      * Gets called after the vdom config gets changed in case the component is already mounted (delta updates).
-     * @param {Object} vdom
-     * @param {Neo.vdom.VNode} vnode
+     * @param {Object} vdom=this.vdom
+     * @param {Neo.vdom.VNode} vnode=this.vnode
      * @param {function} [resolve] used by promiseVdomUpdate()
      * @param {function} [reject] used by promiseVdomUpdate()
      * @protected
      */
-    updateVdom(vdom, vnode, resolve, reject) {
-        let me = this,
-            deltas, opts;
+    updateVdom(vdom=this.vdom, vnode=this.vnode, resolve, reject) {
+        let me   = this,
+            app  = Neo.apps[me.appName],
+            listenerId;
 
-        // console.log('updateVdom', me.id, Neo.clone(vdom, true), Neo.clone(vnode, true));
-        // console.log('updateVdom', me.id, me.isVdomUpdating);
+        // It is important to keep the vdom tree stable to ensure that containers do not lose the references to their
+        // child vdom trees. The if case should not happen, but in case it does, keeping the reference and merging
+        // the content over seems to be the best strategy
+        if (me._vdom !== vdom) {
+            Logger.warn('vdom got replaced for: ' + me.id + '. Copying the content into the reference holder object');
 
-        if (me.isVdomUpdating) {
-            me.needsVdomUpdate = true
-        } else {
-            me.isVdomUpdating  = true;
-            me.needsVdomUpdate = false;
+            Object.keys(me._vdom).forEach(key => {
+                delete me._vdom[key]
+            });
 
-            opts = { vdom, vnode };
+            vdom = Object.assign(me._vdom, vdom)
+        }
 
-            if (Neo.currentWorker.isSharedWorker) {
-                opts.appName = me.appName
-            }
+        if (me.silentVdomUpdate) {
+            me.needsVdomUpdate = true;
+            resolve?.()
+        } else {
+            if (!me.mounted && me.isConstructed && !me.hasRenderingListener && app?.rendering === true) {
+                me.hasRenderingListener = true;
 
-            Neo.vdom.Helper.update(opts).catch(err => {
-                console.log('Error attempting to update component dom', err, me);
-                me.isVdomUpdating = false;
+                listenerId = app.on('mounted', () => {
+                    app.un('mounted', listenerId);
 
-                reject?.()
-            }).then(data => {
-                // checking if the component got destroyed before the update cycle is done
-                if (me.id) {
-                    // console.log('Component vnode updated', data);
-                    me.vnode          = data.vnode;
-                    me.isVdomUpdating = false;
-
-                    deltas = data.deltas;
-
-                    if (!Neo.config.useVdomWorker && deltas.length > 0) {
-                        Neo.applyDeltas(me.appName, deltas).then(() => {
-                            me.resolveVdomUpdate(resolve)
-                        })
-                    } else {
-                        me.resolveVdomUpdate(resolve)
-                    }
+                    me.timeout(50).then(() => {
+                        me.vnode && me.updateVdom(me.vdom, me.vnode, resolve, reject)
+                    })
+                })
+            } else {
+                if (me.mounted && vnode && !me.needsParentUpdate() && !me.isParentVdomUpdating()) {
+                    me.#executeVdomUpdate(vdom, vnode, resolve, reject)
+                } else {
+                    resolve?.()
                 }
-            })
+            }
         }
+
+        me.hasUnmountedVdomChanges = !me.mounted && me.hasBeenMounted
     }
 }