@odoo/owl 2.0.0-beta-4 → 2.0.0-beta-7

package/dist/owl.iife.js

@@ -1915,7 +1915,7 @@
     // Maps fibers to thrown errors
     const fibersInError = new WeakMap();
     const nodeErrorHandlers = new WeakMap();
-    function _handleError(node, error, isFirstRound = false) {
+    function _handleError(node, error) {
         if (!node) {
             return false;
         }
@@ -1925,23 +1925,19 @@
         }
         const errorHandlers = nodeErrorHandlers.get(node);
         if (errorHandlers) {
-            let stopped = false;
+            let handled = false;
             // execute in the opposite order
             for (let i = errorHandlers.length - 1; i >= 0; i--) {
                 try {
                     errorHandlers[i](error);
-                    stopped = true;
+                    handled = true;
                     break;
                 }
                 catch (e) {
                     error = e;
                 }
             }
-            if (stopped) {
-                if (isFirstRound && fiber && fiber.node.fiber) {
-                    const root = fiber.root;
-                    root.setCounter(root.counter - 1);
-                }
+            if (handled) {
                 return true;
             }
         }
@@ -1959,7 +1955,7 @@
             current = current.parent;
         } while (current);
         fibersInError.set(fiber.root, error);
-        const handled = _handleError(node, error, true);
+        const handled = _handleError(node, error);
         if (!handled) {
             console.warn(`[Owl] Unhandled error. Destroying the root component`);
             try {
@@ -1976,10 +1972,6 @@
         if (current) {
             cancelFibers(current.children);
             current.root = null;
-            if (current instanceof RootFiber && current.delayedRenders.length) {
-                let root = parent.root;
-                root.delayedRenders = root.delayedRenders.concat(current.delayedRenders);
-            }
         }
         return new Fiber(node, parent);
     }
@@ -1987,12 +1979,15 @@
         let current = node.fiber;
         if (current) {
             let root = current.root;
+            // lock root fiber because canceling children fibers may destroy components,
+            // which means any arbitrary code can be run in onWillDestroy, which may
+            // trigger new renderings
+            root.locked = true;
             root.setCounter(root.counter + 1 - cancelFibers(current.children));
+            root.locked = false;
             current.children = [];
+            current.childrenMap = {};
             current.bdom = null;
-            if (current === root) {
-                root.reachedChildren = new WeakSet();
-            }
             if (fibersInError.has(current)) {
                 fibersInError.delete(current);
                 fibersInError.delete(root);
@@ -2009,13 +2004,21 @@
         }
         return fiber;
     }
+    function throwOnRender() {
+        throw new Error("Attempted to render cancelled fiber");
+    }
     /**
      * @returns number of not-yet rendered fibers cancelled
      */
     function cancelFibers(fibers) {
         let result = 0;
         for (let fiber of fibers) {
-            fiber.node.fiber = null;
+            let node = fiber.node;
+            fiber.render = throwOnRender;
+            if (node.status === 0 /* NEW */) {
+                node.destroy();
+            }
+            node.fiber = null;
             if (fiber.bdom) {
                 // if fiber has been rendered, this means that the component props have
                 // been updated. however, this fiber will not be patched to the dom, so
@@ -2023,7 +2026,7 @@
                 // the same props, and skip the render completely. With the next line,
                 // we kindly request the component code to force a render, so it works as
                 // expected.
-                fiber.node.forceNextRender = true;
+                node.forceNextRender = true;
             }
             else {
                 result++;
@@ -2038,6 +2041,7 @@
             this.children = [];
             this.appliedToDom = false;
             this.deep = false;
+            this.childrenMap = {};
             this.node = node;
             this.parent = parent;
             if (parent) {
@@ -2054,21 +2058,17 @@
         render() {
             // if some parent has a fiber => register in followup
             let prev = this.root.node;
+            let scheduler = prev.app.scheduler;
             let current = prev.parent;
             while (current) {
                 if (current.fiber) {
                     let root = current.fiber.root;
-                    if (root.counter) {
-                        root.delayedRenders.push(this);
-                        return;
+                    if (root.counter === 0 && prev.parentKey in current.fiber.childrenMap) {
+                        current = root.node;
                     }
                     else {
-                        if (!root.reachedChildren.has(prev)) {
-                            // is dead
-                            this.node.app.scheduler.shouldClear = true;
-                            return;
-                        }
-                        current = root.node;
+                        scheduler.delayedRenders.push(this);
+                        return;
                     }
                 }
                 prev = current;
@@ -2082,12 +2082,13 @@
             const root = this.root;
             if (root) {
                 try {
+                    this.bdom = true;
                     this.bdom = node.renderFn();
-                    root.setCounter(root.counter - 1);
                 }
                 catch (e) {
                     handleError({ node, error: e });
                 }
+                root.setCounter(root.counter - 1);
             }
         }
     }
@@ -2102,8 +2103,6 @@
             // A fiber is typically locked when it is completing and the patch has not, or is being applied.
             // i.e.: render triggered in onWillUnmount or in willPatch will be delayed
             this.locked = false;
-            this.delayedRenders = [];
-            this.reachedChildren = new WeakSet();
         }
         complete() {
             const node = this.node;
@@ -2156,14 +2155,6 @@
         setCounter(newValue) {
             this.counter = newValue;
             if (newValue === 0) {
-                if (this.delayedRenders.length) {
-                    for (let f of this.delayedRenders) {
-                        if (f.root) {
-                            f.render();
-                        }
-                    }
-                    this.delayedRenders = [];
-                }
                 this.node.app.scheduler.flush();
             }
         }
@@ -2178,6 +2169,7 @@
             let current = this;
             try {
                 const node = this.node;
+                node.children = this.childrenMap;
                 node.app.constructor.validateTarget(this.target);
                 if (node.bdom) {
                     // this is a complicated situation: if we mount a fiber with an existing
@@ -2383,7 +2375,7 @@
         const node = getCurrent();
         let render = batchedRenderFunctions.get(node);
         if (!render) {
-            render = batched(node.render.bind(node));
+            render = batched(node.render.bind(node, false));
             batchedRenderFunctions.set(node, render);
             // manual implementation of onWillDestroy to break cyclic dependency
             node.willDestroy.push(clearReactivesForCallback.bind(null, render));
@@ -2401,14 +2393,8 @@
     function component(name, props, key, ctx, parent) {
         let node = ctx.children[key];
         let isDynamic = typeof name !== "string";
-        if (node) {
-            if (node.status < 1 /* MOUNTED */) {
-                node.destroy();
-                node = undefined;
-            }
-            else if (node.status === 2 /* DESTROYED */) {
-                node = undefined;
-            }
+        if (node && node.status === 2 /* DESTROYED */) {
+            node = undefined;
         }
         if (isDynamic && node && node.component.constructor !== name) {
             node = undefined;
@@ -2439,15 +2425,15 @@
                     throw new Error(`Cannot find the definition of component "${name}"`);
                 }
             }
-            node = new ComponentNode(C, props, ctx.app, ctx);
+            node = new ComponentNode(C, props, ctx.app, ctx, key);
             ctx.children[key] = node;
             node.initiateRender(new Fiber(node, parentFiber));
         }
-        parentFiber.root.reachedChildren.add(node);
+        parentFiber.childrenMap[key] = node;
         return node;
     }
     class ComponentNode {
-        constructor(C, props, app, parent) {
+        constructor(C, props, app, parent, parentKey) {
             this.fiber = null;
             this.bdom = null;
             this.status = 0 /* NEW */;
@@ -2463,7 +2449,8 @@
             this.willDestroy = [];
             currentNode = this;
             this.app = app;
-            this.parent = parent || null;
+            this.parent = parent;
+            this.parentKey = parentKey;
             this.level = parent ? parent.level + 1 : 0;
             applyDefaultProps(props, C);
             const env = (parent && parent.childEnv) || app.env;
@@ -2496,9 +2483,9 @@
                 fiber.render();
             }
         }
-        async render(deep = false) {
+        async render(deep) {
             let current = this.fiber;
-            if (current && current.root.locked) {
+            if (current && (current.root.locked || current.bdom === true)) {
                 await Promise.resolve();
                 // situation may have changed after the microtask tick
                 current = this.fiber;
@@ -2557,8 +2544,15 @@
             for (let child of Object.values(this.children)) {
                 child._destroy();
             }
-            for (let cb of this.willDestroy) {
-                cb.call(component);
+            if (this.willDestroy.length) {
+                try {
+                    for (let cb of this.willDestroy) {
+                        cb.call(component);
+                    }
+                }
+                catch (e) {
+                    handleError({ error: e, node: this });
+                }
             }
             this.status = 2 /* DESTROYED */;
         }
@@ -2624,6 +2618,7 @@
             bdom.mount(parent, anchor);
             this.status = 1 /* MOUNTED */;
             this.fiber.appliedToDom = true;
+            this.children = this.fiber.childrenMap;
             this.fiber = null;
         }
         moveBefore(other, afterNode) {
@@ -2639,10 +2634,8 @@
         }
         _patch() {
             const hasChildren = Object.keys(this.children).length > 0;
+            this.children = this.fiber.childrenMap;
             this.bdom.patch(this.fiber.bdom, hasChildren);
-            if (hasChildren) {
-                this.cleanOutdatedChildren();
-            }
             this.fiber.appliedToDom = true;
             this.fiber = null;
         }
@@ -2652,19 +2645,6 @@
         remove() {
             this.bdom.remove();
         }
-        cleanOutdatedChildren() {
-            const children = this.children;
-            for (const key in children) {
-                const node = children[key];
-                const status = node.status;
-                if (status !== 1 /* MOUNTED */) {
-                    delete children[key];
-                    if (status !== 2 /* DESTROYED */) {
-                        node.destroy();
-                    }
-                }
-            }
-        }
         // ---------------------------------------------------------------------------
         // Some debug helpers
         // ---------------------------------------------------------------------------
@@ -2684,7 +2664,7 @@
         constructor() {
             this.tasks = new Set();
             this.frame = 0;
-            this.shouldClear = false;
+            this.delayedRenders = [];
             this.requestAnimationFrame = Scheduler.requestAnimationFrame;
         }
         addFiber(fiber) {
@@ -2695,16 +2675,22 @@
          * Other tasks are left unchanged.
          */
         flush() {
+            if (this.delayedRenders.length) {
+                let renders = this.delayedRenders;
+                this.delayedRenders = [];
+                for (let f of renders) {
+                    if (f.root && f.node.status !== 2 /* DESTROYED */ && f.node.fiber === f) {
+                        f.render();
+                    }
+                }
+            }
             if (this.frame === 0) {
                 this.frame = this.requestAnimationFrame(() => {
                     this.frame = 0;
                     this.tasks.forEach((fiber) => this.processFiber(fiber));
-                    if (this.shouldClear) {
-                        this.shouldClear = false;
-                        for (let task of this.tasks) {
-                            if (task.node.status === 2 /* DESTROYED */) {
-                                this.tasks.delete(task);
-                            }
+                    for (let task of this.tasks) {
+                        if (task.node.status === 2 /* DESTROYED */) {
+                            this.tasks.delete(task);
                         }
                     }
                 });
@@ -4018,8 +4004,11 @@
                 let slotStr = [];
                 for (let slotName in ast.slots) {
                     const slotAst = ast.slots[slotName];
-                    const name = this.compileInNewTarget("slot", slotAst.content, ctx, slotAst.on);
-                    const params = [`__render: ${name}, __ctx: ${ctxStr}`];
+                    const params = [];
+                    if (slotAst.content) {
+                        const name = this.compileInNewTarget("slot", slotAst.content, ctx, slotAst.on);
+                        params.push(`__render: ${name}, __ctx: ${ctxStr}`);
+                    }
                     const scope = ast.slots[slotName].scope;
                     if (scope) {
                         params.push(`__scope: "${scope}"`);
@@ -4121,7 +4110,7 @@
                 if (dynamic) {
                     let name = this.generateId("slot");
                     this.define(name, slotName);
-                    blockString = `toggler(${name}, callSlot(ctx, node, key, ${name}), ${dynamic}, ${scope})`;
+                    blockString = `toggler(${name}, callSlot(ctx, node, key, ${name}, ${dynamic}, ${scope}))`;
                 }
                 else {
                     blockString = `callSlot(ctx, node, key, ${slotName}, ${dynamic}, ${scope})`;
@@ -4662,28 +4651,26 @@
                 slotNode.removeAttribute("t-set-slot");
                 slotNode.remove();
                 const slotAst = parseNode(slotNode, ctx);
-                if (slotAst) {
-                    let on = null;
-                    let attrs = null;
-                    let scope = null;
-                    for (let attributeName of slotNode.getAttributeNames()) {
-                        const value = slotNode.getAttribute(attributeName);
-                        if (attributeName === "t-slot-scope") {
-                            scope = value;
-                            continue;
-                        }
-                        else if (attributeName.startsWith("t-on-")) {
-                            on = on || {};
-                            on[attributeName.slice(5)] = value;
-                        }
-                        else {
-                            attrs = attrs || {};
-                            attrs[attributeName] = value;
-                        }
+                let on = null;
+                let attrs = null;
+                let scope = null;
+                for (let attributeName of slotNode.getAttributeNames()) {
+                    const value = slotNode.getAttribute(attributeName);
+                    if (attributeName === "t-slot-scope") {
+                        scope = value;
+                        continue;
+                    }
+                    else if (attributeName.startsWith("t-on-")) {
+                        on = on || {};
+                        on[attributeName.slice(5)] = value;
+                    }
+                    else {
+                        attrs = attrs || {};
+                        attrs[attributeName] = value;
                     }
-                    slots = slots || {};
-                    slots[name] = { content: slotAst, on, attrs, scope };
                 }
+                slots = slots || {};
+                slots[name] = { content: slotAst, on, attrs, scope };
             }
             // default slot
             const defaultContent = parseChildNodes(clone, ctx);
@@ -5029,7 +5016,7 @@
         }
         setup() { }
         render(deep = false) {
-            this.__owl__.render(deep);
+            this.__owl__.render(deep === true);
         }
     }
     Component.template = "";
@@ -5326,13 +5313,19 @@
             }
             this.helpers = makeHelpers(this.getTemplate.bind(this));
         }
-        addTemplate(name, template, options = {}) {
-            if (name in this.rawTemplates && !options.allowDuplicate) {
-                throw new Error(`Template ${name} already defined`);
+        addTemplate(name, template) {
+            if (name in this.rawTemplates) {
+                const rawTemplate = this.rawTemplates[name];
+                const currentAsString = typeof rawTemplate === "string" ? rawTemplate : rawTemplate.outerHTML;
+                const newAsString = typeof template === "string" ? template : template.outerHTML;
+                if (currentAsString === newAsString) {
+                    return;
+                }
+                throw new Error(`Template ${name} already defined with different content`);
             }
             this.rawTemplates[name] = template;
         }
-        addTemplates(xml, options = {}) {
+        addTemplates(xml) {
             if (!xml) {
                 // empty string
                 return;
@@ -5340,7 +5333,7 @@
             xml = xml instanceof Document ? xml : parseXML(xml);
             for (const template of xml.querySelectorAll("[t-name]")) {
                 const name = template.getAttribute("t-name");
-                this.addTemplate(name, template, options);
+                this.addTemplate(name, template);
             }
         }
         getTemplate(name) {
@@ -5411,7 +5404,7 @@ See https://github.com/odoo/owl/blob/${hash}/doc/reference/app.md#configuration
             return prom;
         }
         makeNode(Component, props) {
-            return new ComponentNode(Component, props, this);
+            return new ComponentNode(Component, props, this, null, null);
         }
         mountNode(node, target, options) {
             const promise = new Promise((resolve, reject) => {
@@ -5619,9 +5612,9 @@ See https://github.com/odoo/owl/blob/${hash}/doc/reference/app.md#configuration
     Object.defineProperty(exports, '__esModule', { value: true });
 
 
-    __info__.version = '2.0.0-beta-4';
-    __info__.date = '2022-03-29T13:50:04.545Z';
-    __info__.hash = '55dbc01';
+    __info__.version = '2.0.0-beta-7';
+    __info__.date = '2022-04-27T09:08:40.703Z';
+    __info__.hash = '0cd66c8';
     __info__.url = 'https://github.com/odoo/owl';