[REL] v2.2.6

# v2.2.6

 - [IMP] devtools: add svg elements detection
 - [FIX] reactivity: do not notify for NOOPs on collections
 - [IMP] app: export apps set as static property
 - [IMP] runtime: do not check template equality outside dev mode
 - [FIX] runtime: properly support t-foreach on strings

docs/owl.js

@@ -710,12 +710,7 @@ function buildTree(node, parent = null, domParentTree = null) {
                 info.push({ type: "child", idx: index });
                 el = document.createTextNode("");
             }
-            const attrs = node.attributes;
-            const ns = attrs.getNamedItem("block-ns");
-            if (ns) {
-                attrs.removeNamedItem("block-ns");
-                currentNS = ns.value;
-            }
+            currentNS || (currentNS = node.namespaceURI);
             if (!el) {
                 el = currentNS
                     ? document.createElementNS(currentNS, tagName)
@@ -731,6 +726,7 @@ function buildTree(node, parent = null, domParentTree = null) {
                     const fragment = document.createElement("template").content;
                     fragment.appendChild(el);
                 }
+                const attrs = node.attributes;
                 for (let i = 0; i < attrs.length; i++) {
                     const attrName = attrs[i].name;
                     const attrValue = attrs[i].value;
@@ -2181,7 +2177,7 @@ function delegateAndNotify(setterName, getterName, target) {
         if (hadKey !== hasKey) {
             notifyReactives(target, KEYCHANGES);
         }
-        if (originalValue !== value) {
+        if (originalValue !== target[getterName](key)) {
             notifyReactives(target, key);
         }
         return ret;
@@ -3002,15 +2998,13 @@ function prepareList(collection) {
         keys = [...collection.keys()];
         values = [...collection.values()];
     }
+    else if (Symbol.iterator in Object(collection)) {
+        keys = [...collection];
+        values = keys;
+    }
     else if (collection && typeof collection === "object") {
-        if (Symbol.iterator in collection) {
-            keys = [...collection];
-            values = keys;
-        }
-        else {
-            values = Object.values(collection);
-            keys = Object.keys(collection);
-        }
+        values = Object.values(collection);
+        keys = Object.keys(collection);
     }
     else {
         throw new OwlError(`Invalid loop expression: "${collection}" is not iterable`);
@@ -3211,6 +3205,10 @@ class TemplateSet {
     }
     addTemplate(name, template) {
         if (name in this.rawTemplates) {
+            // this check can be expensive, just silently ignore double definitions outside dev mode
+            if (!this.dev) {
+                return;
+            }
             const rawTemplate = this.rawTemplates[name];
             const currentAsString = typeof rawTemplate === "string"
                 ? rawTemplate
@@ -3854,7 +3852,7 @@ class CodeGenerator {
     createBlock(parentBlock, type, ctx) {
         const hasRoot = this.target.hasRoot;
         const block = new BlockDescription(this.target, type);
-        if (!hasRoot && !ctx.preventRoot) {
+        if (!hasRoot) {
             this.target.hasRoot = true;
             block.isRoot = true;
         }
@@ -3877,7 +3875,7 @@ class CodeGenerator {
         if (ctx.tKeyExpr) {
             blockExpr = `toggler(${ctx.tKeyExpr}, ${blockExpr})`;
         }
-        if (block.isRoot && !ctx.preventRoot) {
+        if (block.isRoot) {
             if (this.target.on) {
                 blockExpr = this.wrapWithEventCatcher(blockExpr, this.target.on);
             }
@@ -4053,11 +4051,6 @@ class CodeGenerator {
         }
         // attributes
         const attrs = {};
-        const nameSpace = ast.ns || ctx.nameSpace;
-        if (nameSpace && isNewBlock) {
-            // specific namespace uri
-            attrs["block-ns"] = nameSpace;
-        }
         for (let key in ast.attrs) {
             let expr, attrName;
             if (key.startsWith("t-attf")) {
@@ -4173,7 +4166,10 @@ class CodeGenerator {
             const idx = block.insertData(setRefStr, "ref");
             attrs["block-ref"] = String(idx);
         }
-        const dom = xmlDoc.createElement(ast.tag);
+        const nameSpace = ast.ns || ctx.nameSpace;
+        const dom = nameSpace
+            ? xmlDoc.createElementNS(nameSpace, ast.tag)
+            : xmlDoc.createElement(ast.tag);
         for (const [attr, val] of Object.entries(attrs)) {
             if (!(attr === "class" && val === "")) {
                 dom.setAttribute(attr, val);
@@ -4215,7 +4211,7 @@ class CodeGenerator {
                             break;
                     }
                 }
-                this.addLine(`let ${block.children.map((c) => c.varName)};`, codeIdx);
+                this.addLine(`let ${block.children.map((c) => c.varName).join(", ")};`, codeIdx);
             }
         }
         return block.varName;
@@ -4318,7 +4314,7 @@ class CodeGenerator {
                             break;
                     }
                 }
-                this.addLine(`let ${block.children.map((c) => c.varName)};`, codeIdx);
+                this.addLine(`let ${block.children.map((c) => c.varName).join(", ")};`, codeIdx);
             }
             // note: this part is duplicated from end of compilemulti:
             const args = block.children.map((c) => c.varName).join(", ");
@@ -4433,7 +4429,6 @@ class CodeGenerator {
                 block,
                 index,
                 forceNewBlock: !isTSet,
-                preventRoot: ctx.preventRoot,
                 isLast: ctx.isLast && i === l - 1,
             });
             this.compileAST(child, subCtx);
@@ -4442,21 +4437,19 @@ class CodeGenerator {
             }
         }
         if (isNewBlock) {
-            if (block.hasDynamicChildren) {
-                if (block.children.length) {
-                    const code = this.target.code;
-                    const children = block.children.slice();
-                    let current = children.shift();
-                    for (let i = codeIdx; i < code.length; i++) {
-                        if (code[i].trimStart().startsWith(`const ${current.varName} `)) {
-                            code[i] = code[i].replace(`const ${current.varName}`, current.varName);
-                            current = children.shift();
-                            if (!current)
-                                break;
-                        }
+            if (block.hasDynamicChildren && block.children.length) {
+                const code = this.target.code;
+                const children = block.children.slice();
+                let current = children.shift();
+                for (let i = codeIdx; i < code.length; i++) {
+                    if (code[i].trimStart().startsWith(`const ${current.varName} `)) {
+                        code[i] = code[i].replace(`const ${current.varName}`, current.varName);
+                        current = children.shift();
+                        if (!current)
+                            break;
                     }
-                    this.addLine(`let ${block.children.map((c) => c.varName)};`, codeIdx);
                 }
+                this.addLine(`let ${block.children.map((c) => c.varName).join(", ")};`, codeIdx);
             }
             const args = block.children.map((c) => c.varName).join(", ");
             this.insertBlock(`multi([${args}])`, block, ctx);
@@ -4470,24 +4463,23 @@ class CodeGenerator {
             ctxVar = generateId("ctx");
             this.addLine(`let ${ctxVar} = ${compileExpr(ast.context)};`);
         }
+        const isDynamic = INTERP_REGEXP.test(ast.name);
+        const subTemplate = isDynamic ? interpolate(ast.name) : "`" + ast.name + "`";
+        if (block && !forceNewBlock) {
+            this.insertAnchor(block);
+        }
+        block = this.createBlock(block, "multi", ctx);
         if (ast.body) {
             this.addLine(`${ctxVar} = Object.create(${ctxVar});`);
             this.addLine(`${ctxVar}[isBoundary] = 1;`);
             this.helpers.add("isBoundary");
-            const subCtx = createContext(ctx, { preventRoot: true, ctxVar });
+            const subCtx = createContext(ctx, { ctxVar });
             const bl = this.compileMulti({ type: 3 /* Multi */, content: ast.body }, subCtx);
             if (bl) {
                 this.helpers.add("zero");
                 this.addLine(`${ctxVar}[zero] = ${bl};`);
             }
         }
-        const isDynamic = INTERP_REGEXP.test(ast.name);
-        const subTemplate = isDynamic ? interpolate(ast.name) : "`" + ast.name + "`";
-        if (block) {
-            if (!forceNewBlock) {
-                this.insertAnchor(block);
-            }
-        }
         const key = `key + \`${this.generateComponentKey()}\``;
         if (isDynamic) {
             const templateVar = generateId("template");
@@ -4495,7 +4487,6 @@ class CodeGenerator {
                 this.staticDefs.push({ id: "call", expr: `app.callTemplate.bind(app)` });
             }
             this.define(templateVar, subTemplate);
-            block = this.createBlock(block, "multi", ctx);
             this.insertBlock(`call(this, ${templateVar}, ${ctxVar}, node, ${key})`, block, {
                 ...ctx,
                 forceNewBlock: !block,
@@ -4504,7 +4495,6 @@ class CodeGenerator {
         else {
             const id = generateId(`callTemplate_`);
             this.staticDefs.push({ id, expr: `app.getTemplate(${subTemplate})` });
-            block = this.createBlock(block, "multi", ctx);
             this.insertBlock(`${id}.call(this, ${ctxVar}, node, ${key})`, block, {
                 ...ctx,
                 forceNewBlock: !block,
@@ -4826,7 +4816,7 @@ function parse(xml) {
 }
 function _parse(xml) {
     normalizeXML(xml);
-    const ctx = { inPreTag: false, inSVG: false };
+    const ctx = { inPreTag: false };
     return parseNode(xml, ctx) || { type: 0 /* Text */, value: "" };
 }
 function parseNode(node, ctx) {
@@ -4917,9 +4907,7 @@ function parseDOMNode(node, ctx) {
     if (tagName === "pre") {
         ctx.inPreTag = true;
     }
-    const shouldAddSVGNS = ROOT_SVG_TAGS.has(tagName) && !ctx.inSVG;
-    ctx.inSVG = ctx.inSVG || shouldAddSVGNS;
-    const ns = shouldAddSVGNS ? "http://www.w3.org/2000/svg" : null;
+    let ns = !ctx.nameSpace && ROOT_SVG_TAGS.has(tagName) ? "http://www.w3.org/2000/svg" : null;
     const ref = node.getAttribute("t-ref");
     node.removeAttribute("t-ref");
     const nodeAttrsNames = node.getAttributeNames();
@@ -4981,6 +4969,9 @@ function parseDOMNode(node, ctx) {
         else if (attr.startsWith("block-")) {
             throw new OwlError(`Invalid attribute: '${attr}'`);
         }
+        else if (attr === "xmlns") {
+            ns = value;
+        }
         else if (attr !== "t-name") {
             if (attr.startsWith("t-") && !attr.startsWith("t-att")) {
                 throw new OwlError(`Unknown QWeb directive: '${attr}'`);
@@ -4993,6 +4984,9 @@ function parseDOMNode(node, ctx) {
             attrs[attr] = value;
         }
     }
+    if (ns) {
+        ctx.nameSpace = ns;
+    }
     const children = parseChildren(node, ctx);
     return {
         type: 2 /* DomNode */,
@@ -5561,7 +5555,7 @@ function compile(template, options = {}) {
 }
 
 // do not modify manually. This file is generated by the release script.
-const version = "2.2.4";
+const version = "2.2.6";
 
 // -----------------------------------------------------------------------------
 //  Scheduler
@@ -5650,13 +5644,8 @@ const DEV_MSG = () => {
 This is not suitable for production use.
 See https://github.com/odoo/owl/blob/${hash}/doc/reference/app.md#configuration for more information.`;
 };
-window.__OWL_DEVTOOLS__ || (window.__OWL_DEVTOOLS__ = {
-    apps: new Set(),
-    Fiber: Fiber,
-    RootFiber: RootFiber,
-    toRaw: toRaw,
-    reactive: reactive,
-});
+const apps = new Set();
+window.__OWL_DEVTOOLS__ || (window.__OWL_DEVTOOLS__ = { apps, Fiber, RootFiber, toRaw, reactive });
 class App extends TemplateSet {
     constructor(Root, config = {}) {
         super(config);
@@ -5664,7 +5653,7 @@ class App extends TemplateSet {
         this.root = null;
         this.name = config.name || "";
         this.Root = Root;
-        window.__OWL_DEVTOOLS__.apps.add(this);
+        apps.add(this);
         if (config.test) {
             this.dev = true;
         }
@@ -5721,7 +5710,7 @@ class App extends TemplateSet {
             this.root.destroy();
             this.scheduler.processTasks();
         }
-        window.__OWL_DEVTOOLS__.apps.delete(this);
+        apps.delete(this);
     }
     createComponent(name, isStatic, hasSlotsProp, hasDynamicPropList, propList) {
         const isDynamic = !isStatic;
@@ -5796,6 +5785,7 @@ class App extends TemplateSet {
     }
 }
 App.validateTarget = validateTarget;
+App.apps = apps;
 App.version = version;
 async function mount(C, target, config = {}) {
     return new App(C, config).mount(target, config);
@@ -5994,6 +5984,6 @@ TemplateSet.prototype._compileTemplate = function _compileTemplate(name, templat
 export { App, Component, EventBus, OwlError, __info__, blockDom, loadFile, markRaw, markup, mount, onError, onMounted, onPatched, onRendered, onWillDestroy, onWillPatch, onWillRender, onWillStart, onWillUnmount, onWillUpdateProps, reactive, status, toRaw, useChildSubEnv, useComponent, useEffect, useEnv, useExternalListener, useRef, useState, useSubEnv, validate, validateType, whenReady, xml };
 
 
-__info__.date = '2023-08-02T06:20:03.634Z';
-__info__.hash = '8f9ad98';
+__info__.date = '2023-09-25T11:48:01.531Z';
+__info__.hash = '752160f';
 __info__.url = 'https://github.com/odoo/owl';

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@odoo/owl",
-  "version": "2.2.4",
+  "version": "2.2.6",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odoo/owl",
-  "version": "2.2.4",
+  "version": "2.2.6",
   "description": "Odoo Web Library (OWL)",
   "main": "dist/owl.cjs.js",
   "module": "dist/owl.es.js",

src/compiler/code_generator.ts

@@ -160,7 +160,6 @@ interface Context {
   block: BlockDescription | null;
   index: number | string;
   forceNewBlock: boolean;
-  preventRoot?: boolean;
   isLast?: boolean;
   translate: boolean;
   tKeyExpr: string | null;
@@ -377,7 +376,7 @@ export class CodeGenerator {
   ): BlockDescription {
     const hasRoot = this.target.hasRoot;
     const block = new BlockDescription(this.target, type);
-    if (!hasRoot && !ctx.preventRoot) {
+    if (!hasRoot) {
       this.target.hasRoot = true;
       block.isRoot = true;
     }
@@ -403,7 +402,7 @@ export class CodeGenerator {
       blockExpr = `toggler(${ctx.tKeyExpr}, ${blockExpr})`;
     }
 
-    if (block.isRoot && !ctx.preventRoot) {
+    if (block.isRoot) {
       if (this.target.on) {
         blockExpr = this.wrapWithEventCatcher(blockExpr, this.target.on);
       }
@@ -586,11 +585,6 @@ export class CodeGenerator {
     }
     // attributes
     const attrs: Attrs = {};
-    const nameSpace = ast.ns || ctx.nameSpace;
-    if (nameSpace && isNewBlock) {
-      // specific namespace uri
-      attrs["block-ns"] = nameSpace;
-    }
 
     for (let key in ast.attrs) {
       let expr, attrName;
@@ -719,7 +713,10 @@ export class CodeGenerator {
       attrs["block-ref"] = String(idx);
     }
 
-    const dom = xmlDoc.createElement(ast.tag);
+    const nameSpace = ast.ns || ctx.nameSpace;
+    const dom = nameSpace
+      ? xmlDoc.createElementNS(nameSpace, ast.tag)
+      : xmlDoc.createElement(ast.tag);
     for (const [attr, val] of Object.entries(attrs)) {
       if (!(attr === "class" && val === "")) {
         dom.setAttribute(attr, val);
@@ -761,7 +758,7 @@ export class CodeGenerator {
             if (!current) break;
           }
         }
-        this.addLine(`let ${block!.children.map((c) => c.varName)};`, codeIdx);
+        this.addLine(`let ${block!.children.map((c) => c.varName).join(", ")};`, codeIdx);
       }
     }
     return block!.varName;
@@ -863,7 +860,7 @@ export class CodeGenerator {
             if (!current) break;
           }
         }
-        this.addLine(`let ${block!.children.map((c) => c.varName)};`, codeIdx);
+        this.addLine(`let ${block!.children.map((c) => c.varName).join(", ")};`, codeIdx);
       }
 
       // note: this part is duplicated from end of compilemulti:
@@ -989,7 +986,6 @@ export class CodeGenerator {
         block,
         index,
         forceNewBlock: !isTSet,
-        preventRoot: ctx.preventRoot,
         isLast: ctx.isLast && i === l - 1,
       });
       this.compileAST(child, subCtx);
@@ -998,20 +994,18 @@ export class CodeGenerator {
       }
     }
     if (isNewBlock) {
-      if (block!.hasDynamicChildren) {
-        if (block!.children.length) {
-          const code = this.target.code;
-          const children = block!.children.slice();
-          let current = children.shift();
-          for (let i = codeIdx; i < code.length; i++) {
-            if (code[i].trimStart().startsWith(`const ${current!.varName} `)) {
-              code[i] = code[i].replace(`const ${current!.varName}`, current!.varName);
-              current = children.shift();
-              if (!current) break;
-            }
+      if (block!.hasDynamicChildren && block!.children.length) {
+        const code = this.target.code;
+        const children = block!.children.slice();
+        let current = children.shift();
+        for (let i = codeIdx; i < code.length; i++) {
+          if (code[i].trimStart().startsWith(`const ${current!.varName} `)) {
+            code[i] = code[i].replace(`const ${current!.varName}`, current!.varName);
+            current = children.shift();
+            if (!current) break;
           }
-          this.addLine(`let ${block!.children.map((c) => c.varName)};`, codeIdx);
         }
+        this.addLine(`let ${block!.children.map((c) => c.varName).join(", ")};`, codeIdx);
       }
 
       const args = block!.children.map((c) => c.varName).join(", ");
@@ -1027,24 +1021,24 @@ export class CodeGenerator {
       ctxVar = generateId("ctx");
       this.addLine(`let ${ctxVar} = ${compileExpr(ast.context)};`);
     }
+    const isDynamic = INTERP_REGEXP.test(ast.name);
+    const subTemplate = isDynamic ? interpolate(ast.name) : "`" + ast.name + "`";
+    if (block && !forceNewBlock) {
+      this.insertAnchor(block);
+    }
+    block = this.createBlock(block, "multi", ctx);
     if (ast.body) {
       this.addLine(`${ctxVar} = Object.create(${ctxVar});`);
       this.addLine(`${ctxVar}[isBoundary] = 1;`);
       this.helpers.add("isBoundary");
-      const subCtx = createContext(ctx, { preventRoot: true, ctxVar });
+      const subCtx = createContext(ctx, { ctxVar });
       const bl = this.compileMulti({ type: ASTType.Multi, content: ast.body }, subCtx);
       if (bl) {
         this.helpers.add("zero");
         this.addLine(`${ctxVar}[zero] = ${bl};`);
       }
     }
-    const isDynamic = INTERP_REGEXP.test(ast.name);
-    const subTemplate = isDynamic ? interpolate(ast.name) : "`" + ast.name + "`";
-    if (block) {
-      if (!forceNewBlock) {
-        this.insertAnchor(block);
-      }
-    }
+
     const key = `key + \`${this.generateComponentKey()}\``;
     if (isDynamic) {
       const templateVar = generateId("template");
@@ -1052,7 +1046,6 @@ export class CodeGenerator {
         this.staticDefs.push({ id: "call", expr: `app.callTemplate.bind(app)` });
       }
       this.define(templateVar, subTemplate);
-      block = this.createBlock(block, "multi", ctx);
       this.insertBlock(`call(this, ${templateVar}, ${ctxVar}, node, ${key})`, block!, {
         ...ctx,
         forceNewBlock: !block,
@@ -1060,7 +1053,6 @@ export class CodeGenerator {
     } else {
       const id = generateId(`callTemplate_`);
       this.staticDefs.push({ id, expr: `app.getTemplate(${subTemplate})` });
-      block = this.createBlock(block, "multi", ctx);
       this.insertBlock(`${id}.call(this, ${ctxVar}, node, ${key})`, block!, {
         ...ctx,
         forceNewBlock: !block,

src/compiler/parser.ts

@@ -213,14 +213,14 @@ export function parse(xml: string | Element): AST {
 
 function _parse(xml: Element): AST {
   normalizeXML(xml);
-  const ctx = { inPreTag: false, inSVG: false };
+  const ctx = { inPreTag: false };
   return parseNode(xml, ctx) || { type: ASTType.Text, value: "" };
 }
 
 interface ParsingContext {
   tModelInfo?: TModelInfo | null;
+  nameSpace?: string;
   inPreTag: boolean;
-  inSVG: boolean;
 }
 
 function parseNode(node: Node, ctx: ParsingContext): AST | null {
@@ -323,9 +323,8 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
   if (tagName === "pre") {
     ctx.inPreTag = true;
   }
-  const shouldAddSVGNS = ROOT_SVG_TAGS.has(tagName) && !ctx.inSVG;
-  ctx.inSVG = ctx.inSVG || shouldAddSVGNS;
-  const ns = shouldAddSVGNS ? "http://www.w3.org/2000/svg" : null;
+
+  let ns = !ctx.nameSpace && ROOT_SVG_TAGS.has(tagName) ? "http://www.w3.org/2000/svg" : null;
   const ref = node.getAttribute("t-ref");
   node.removeAttribute("t-ref");
 
@@ -389,6 +388,8 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
       }
     } else if (attr.startsWith("block-")) {
       throw new OwlError(`Invalid attribute: '${attr}'`);
+    } else if (attr === "xmlns") {
+      ns = value;
     } else if (attr !== "t-name") {
       if (attr.startsWith("t-") && !attr.startsWith("t-att")) {
         throw new OwlError(`Unknown QWeb directive: '${attr}'`);
@@ -401,6 +402,9 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
       attrs[attr] = value;
     }
   }
+  if (ns) {
+    ctx.nameSpace = ns;
+  }
 
   const children = parseChildren(node, ctx);
   return {

src/runtime/app.ts

@@ -35,6 +35,8 @@ This is not suitable for production use.
 See https://github.com/odoo/owl/blob/${hash}/doc/reference/app.md#configuration for more information.`;
 };
 
+const apps = new Set<App>();
+
 declare global {
   interface Window {
     __OWL_DEVTOOLS__: {
@@ -47,13 +49,7 @@ declare global {
   }
 }
 
-window.__OWL_DEVTOOLS__ ||= {
-  apps: new Set<App>(),
-  Fiber: Fiber,
-  RootFiber: RootFiber,
-  toRaw: toRaw,
-  reactive: reactive,
-};
+window.__OWL_DEVTOOLS__ ||= { apps, Fiber, RootFiber, toRaw, reactive };
 
 export class App<
   T extends abstract new (...args: any) => any = any,
@@ -61,6 +57,7 @@ export class App<
   E = any
 > extends TemplateSet {
   static validateTarget = validateTarget;
+  static apps = apps;
   static version = version;
 
   name: string;
@@ -75,7 +72,7 @@ export class App<
     super(config);
     this.name = config.name || "";
     this.Root = Root;
-    window.__OWL_DEVTOOLS__.apps.add(this);
+    apps.add(this);
     if (config.test) {
       this.dev = true;
     }
@@ -140,7 +137,7 @@ export class App<
       this.root.destroy();
       this.scheduler.processTasks();
     }
-    window.__OWL_DEVTOOLS__.apps.delete(this);
+    apps.delete(this);
   }
 
   createComponent<P extends Props>(

src/runtime/blockdom/block_compiler.ts

@@ -144,12 +144,7 @@ function buildTree(
         info.push({ type: "child", idx: index });
         el = document.createTextNode("");
       }
-      const attrs = (node as Element).attributes;
-      const ns = attrs.getNamedItem("block-ns");
-      if (ns) {
-        attrs.removeNamedItem("block-ns");
-        currentNS = ns.value;
-      }
+      currentNS ||= (node as Element).namespaceURI;
       if (!el) {
         el = currentNS
           ? document.createElementNS(currentNS, tagName)
@@ -165,6 +160,7 @@ function buildTree(
           const fragment = document.createElement("template").content;
           fragment.appendChild(el);
         }
+        const attrs = (node as Element).attributes;
         for (let i = 0; i < attrs.length; i++) {
           const attrName = attrs[i].name;
           const attrValue = attrs[i].value;

src/runtime/reactivity.ts

@@ -368,7 +368,7 @@ function delegateAndNotify(
     if (hadKey !== hasKey) {
       notifyReactives(target, KEYCHANGES);
     }
-    if (originalValue !== value) {
+    if (originalValue !== target[getterName](key)) {
       notifyReactives(target, key);
     }
     return ret;

src/runtime/template_helpers.ts

@@ -70,14 +70,12 @@ function prepareList(collection: unknown): [unknown[], unknown[], number, undefi
   } else if (collection instanceof Map) {
     keys = [...collection.keys()];
     values = [...collection.values()];
+  } else if (Symbol.iterator in Object(collection)) {
+    keys = [...(<Iterable<unknown>>collection)];
+    values = keys;
   } else if (collection && typeof collection === "object") {
-    if (Symbol.iterator in collection) {
-      keys = [...(<Iterable<unknown>>collection)];
-      values = keys;
-    } else {
-      values = Object.values(collection);
-      keys = Object.keys(collection);
-    }
+    values = Object.values(collection);
+    keys = Object.keys(collection);
   } else {
     throw new OwlError(`Invalid loop expression: "${collection}" is not iterable`);
   }

src/runtime/template_set.ts

@@ -66,6 +66,10 @@ export class TemplateSet {
 
   addTemplate(name: string, template: string | Element) {
     if (name in this.rawTemplates) {
+      // this check can be expensive, just silently ignore double definitions outside dev mode
+      if (!this.dev) {
+        return;
+      }
       const rawTemplate = this.rawTemplates[name];
       const currentAsString =
         typeof rawTemplate === "string"

src/version.ts

@@ -1,2 +1,2 @@
 // do not modify manually. This file is generated by the release script.
-export const version = "2.2.4";
+export const version = "2.2.6";

tests/app/__snapshots__/app.test.ts.snap

@@ -22,7 +22,7 @@ exports[`app app: clear scheduler tasks and destroy cancelled nodes immediately
   const comp1 = app.createComponent(\`B\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`A\`);
     if (ctx['state'].value) {
       b3 = comp1({}, key + \`__1\`, node, this, null);

tests/blockdom/block.test.ts

@@ -244,12 +244,14 @@ describe("misc", () => {
   });
 
   test("namespace is not propagated to siblings", () => {
-    const block = createBlock(`<div><svg block-ns="someNameSpace"><g/></svg><div></div></div>`);
+    const block = createBlock(`<div><svg xmlns="someNameSpace"><g/></svg><div></div></div>`);
 
     const fixture = makeTestFixture();
     mount(block(), fixture);
 
-    expect(fixture.innerHTML).toBe("<div><svg><g></g></svg><div></div></div>");
+    expect(fixture.innerHTML).toBe(
+      '<div><svg xmlns="someNameSpace"><g></g></svg><div></div></div>'
+    );
     expect(fixture.querySelector("svg")!.namespaceURI).toBe("someNameSpace");
     expect(fixture.querySelector("g")!.namespaceURI).toBe("someNameSpace");
     const allDivs = fixture.querySelectorAll("div");

tests/blockdom/namespace.test.ts

@@ -30,22 +30,22 @@ describe("namespace", () => {
     expect(fixture.firstElementChild!.namespaceURI).toBe(XHTML_URI);
   });
 
-  test("namespace can be changed with block-ns", () => {
-    const block = createBlock(`<tag block-ns="${SVG_URI}"/>`);
+  test("namespace can be changed with xmlns", () => {
+    const block = createBlock(`<tag xmlns="${SVG_URI}"/>`);
     const tree = block();
     mount(tree, fixture);
-    expect(fixture.innerHTML).toBe("<tag></tag>");
+    expect(fixture.innerHTML).toBe(`<tag xmlns="${SVG_URI}"></tag>`);
     expect(fixture.firstElementChild!.namespaceURI).toBe(SVG_URI);
   });
 
   test("namespace is kept for children", () => {
     const block = createBlock(
-      `<parent block-ns="${SVG_URI}"><child><subchild/></child><child/></parent>`
+      `<parent xmlns="${SVG_URI}"><child><subchild/></child><child/></parent>`
     );
     const tree = block();
     mount(tree, fixture);
     expect(fixture.innerHTML).toBe(
-      "<parent><child><subchild></subchild></child><child></child></parent>"
+      `<parent xmlns="${SVG_URI}"><child><subchild></subchild></child><child></child></parent>`
     );
     const parent = fixture.firstElementChild!;
     const child1 = parent.firstElementChild!;
@@ -58,10 +58,10 @@ describe("namespace", () => {
   });
 
   test("various namespaces in same block", () => {
-    const block = createBlock(`<none><one block-ns="one"/><two block-ns="two"/></none>`);
+    const block = createBlock(`<none><one xmlns="one"/><two xmlns="two"/></none>`);
     const tree = block();
     mount(tree, fixture);
-    expect(fixture.innerHTML).toBe("<none><one></one><two></two></none>");
+    expect(fixture.innerHTML).toBe('<none><one xmlns="one"></one><two xmlns="two"></two></none>');
     const none = fixture.firstElementChild!;
     const one = none.firstElementChild!;
     const two = one.nextElementSibling!;

tests/compiler/__snapshots__/comments.test.ts.snap

@@ -34,7 +34,7 @@ exports[`comments properly handle comments between t-if/t-else 1`] = `
   let block3 = createBlock(\`<span>owl</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (true) {
       b2 = block2();
     } else {

tests/compiler/__snapshots__/misc.test.ts.snap

@@ -18,7 +18,7 @@ exports[`misc complex template 1`] = `
   let block13 = createBlock(\`<i class=\\"fa fa-fw fa-clock-o\\" title=\\"This commit is the head of a base branch\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b6,b8;
+    let b2, b3, b4, b6, b8;
     let attr1 = \`batch_tile \${ctx['options'].more?'more':'nomore'}\`;
     let attr2 = \`card bg-\${ctx['klass']}-light\`;
     let attr3 = \`/runbot/batch/\${ctx['batch'].id}\`;
@@ -53,7 +53,7 @@ exports[`misc complex template 1`] = `
     for (let i1 = 0; i1 < l_block8; i1++) {
       ctx[\`commit_link\`] = k_block8[i1];
       const key1 = ctx['commit_link'].id;
-      let b10,b11,b12,b13;
+      let b10, b11, b12, b13;
       let attr5 = \`/runbot/commit/\${ctx['commit_link'].commit_id}\`;
       let attr6 = \`badge badge-light batch_commit match_type_\${ctx['commit_link'].match_type}\`;
       if (ctx['commit_link'].match_type=='new') {
@@ -112,16 +112,16 @@ exports[`misc global 1`] = `
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"foo\\", 'aaa');
-      const b6 = callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`);
+      const b7 = callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`);
       ctx = ctx.__proto__;
-      const b7 = callTemplate_2.call(this, ctx, node, key + \`__2__\${key1}\`);
+      const b8 = callTemplate_2.call(this, ctx, node, key + \`__2__\${key1}\`);
       setContextValue(ctx, \\"foo\\", 'bbb');
-      const b8 = callTemplate_3.call(this, ctx, node, key + \`__3__\${key1}\`);
-      const b5 = multi([b6, b7, b8]);
-      ctx[zero] = b5;
-      const b9 = callTemplate_4.call(this, ctx, node, key + \`__4__\${key1}\`);
+      const b9 = callTemplate_3.call(this, ctx, node, key + \`__3__\${key1}\`);
+      const b6 = multi([b7, b8, b9]);
+      ctx[zero] = b6;
+      const b5 = callTemplate_4.call(this, ctx, node, key + \`__4__\${key1}\`);
       ctx = ctx.__proto__;
-      c_block2[i1] = withKey(multi([b4, b9]), key1);
+      c_block2[i1] = withKey(multi([b4, b5]), key1);
     }
     ctx = ctx.__proto__;
     const b2 = list(c_block2);
@@ -217,7 +217,7 @@ exports[`misc other complex template 1`] = `
   let block25 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b4,b14,b17,b22,b23,b24,b25;
+    let b2, b4, b14, b17, b22, b23, b24, b25;
     let attr1 = \`/runbot/\${ctx['project'].slug}\`;
     let txt1 = ctx['project'].name;
     ctx = Object.create(ctx);
@@ -232,12 +232,12 @@ exports[`misc other complex template 1`] = `
     ctx = ctx.__proto__;
     b2 = list(c_block2);
     if (ctx['user']) {
-      let b5,b6;
+      let b5, b6;
       if (ctx['user'].public) {
         let attr2 = \`/web/login?redirect=/\`;
         b5 = block5([attr2]);
       } else {
-        let b7,b10,b13;
+        let b7, b10, b13;
         if (ctx['nb_assigned_errors']&&ctx['nb_assigned_errors']>0) {
           let attr3 = \`You have \${ctx['nb_assigned_errors']} random bug assigned\`;
           let txt3 = ctx['nb_assigned_errors'];

tests/compiler/__snapshots__/svg.test.ts.snap

@@ -5,7 +5,7 @@ exports[`properly support svg add proper namespace to g tags 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<g block-ns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </g>\`);
+  let block1 = createBlock(\`<g xmlns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </g>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();
@@ -18,7 +18,7 @@ exports[`properly support svg add proper namespace to svg 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\" width=\\"100px\\" height=\\"90px\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </svg>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"100px\\" height=\\"90px\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();
@@ -31,7 +31,7 @@ exports[`properly support svg namespace to g tags not added if already in svg na
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><g/></svg>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><g/></svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();
@@ -44,7 +44,7 @@ exports[`properly support svg namespace to svg tags added even if already in svg
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><svg/></svg>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><svg/></svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();
@@ -58,8 +58,8 @@ exports[`properly support svg svg creates new block if it is within html -- 2 1`
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block2 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/><block-child-0/></svg>\`);
-  let block3 = createBlock(\`<path block-ns=\\"http://www.w3.org/2000/svg\\"/>\`);
+  let block2 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/><block-child-0 xmlns=\\"\\"/></svg>\`);
+  let block3 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
     let b3;
@@ -78,7 +78,7 @@ exports[`properly support svg svg creates new block if it is within html 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block2 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/></svg>\`);
+  let block2 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/></svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     const b2 = block2();
@@ -93,7 +93,7 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   const callTemplate_1 = app.getTemplate(\`path\`);
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><block-child-0 xmlns=\\"\\"/></svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -107,7 +107,7 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<path block-ns=\\"http://www.w3.org/2000/svg\\"/>\`);
+  let block1 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();
@@ -120,8 +120,8 @@ exports[`properly support svg svg namespace added to sub-blocks 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
-  let block2 = createBlock(\`<path block-ns=\\"http://www.w3.org/2000/svg\\"/>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><block-child-0 xmlns=\\"\\"/></svg>\`);
+  let block2 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
     let b2;

tests/compiler/__snapshots__/t_call.test.ts.snap

@@ -61,19 +61,19 @@ exports[`t-call (template calling) call with several sub nodes on same line 1`]
   const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block3 = createBlock(\`<span>hey</span>\`);
-  let block5 = createBlock(\`<span>yay</span>\`);
+  let block4 = createBlock(\`<span>hey</span>\`);
+  let block6 = createBlock(\`<span>yay</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b3 = block3();
-    const b4 = text(\` \`);
-    const b5 = block5();
-    const b2 = multi([b3, b4, b5]);
-    ctx[zero] = b2;
-    const b6 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b6]);
+    const b4 = block4();
+    const b5 = text(\` \`);
+    const b6 = block6();
+    const b3 = multi([b4, b5, b6]);
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -101,19 +101,19 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
   const callTemplate_1 = app.getTemplate(\`subTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block3 = createBlock(\`<span>hey</span>\`);
-  let block5 = createBlock(\`<span>yay</span>\`);
+  let block4 = createBlock(\`<span>hey</span>\`);
+  let block6 = createBlock(\`<span>yay</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b3 = block3();
-    const b4 = text(\` \`);
-    const b5 = block5();
-    const b2 = multi([b3, b4, b5]);
-    ctx[zero] = b2;
-    const b6 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b6]);
+    const b4 = block4();
+    const b5 = text(\` \`);
+    const b6 = block6();
+    const b3 = multi([b4, b5, b6]);
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -126,17 +126,17 @@ exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
   const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block3 = createBlock(\`<span>cascade 0</span>\`);
+  let block4 = createBlock(\`<span>cascade 0</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b3 = block3();
-    const b4 = ctx[zero];
-    const b2 = multi([b3, b4]);
-    ctx[zero] = b2;
-    const b5 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b5]);
+    const b4 = block4();
+    const b5 = ctx[zero];
+    const b3 = multi([b4, b5]);
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -149,17 +149,17 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
   const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block3 = createBlock(\`<span>cascade 1</span>\`);
+  let block4 = createBlock(\`<span>cascade 1</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b3 = block3();
-    const b4 = ctx[zero];
-    const b2 = multi([b3, b4]);
-    ctx[zero] = b2;
-    const b5 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b5]);
+    const b4 = block4();
+    const b5 = ctx[zero];
+    const b3 = multi([b4, b5]);
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -186,17 +186,17 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
   let { isBoundary, zero } = helpers;
   const callTemplate_1 = app.getTemplate(\`subTemplate\`);
   
-  let block2 = createBlock(\`<span>hey</span>\`);
-  let block4 = createBlock(\`<span>yay</span>\`);
+  let block3 = createBlock(\`<span>hey</span>\`);
+  let block5 = createBlock(\`<span>yay</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    const b3 = text(\` \`);
-    const b4 = block4();
-    const b1 = multi([b2, b3, b4]);
-    ctx[zero] = b1;
+    const b3 = block3();
+    const b4 = text(\` \`);
+    const b5 = block5();
+    const b2 = multi([b3, b4, b5]);
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
@@ -209,15 +209,15 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
   let { isBoundary, zero } = helpers;
   const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
   
-  let block2 = createBlock(\`<span>cascade 0</span>\`);
+  let block3 = createBlock(\`<span>cascade 0</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    const b3 = ctx[zero];
-    const b1 = multi([b2, b3]);
-    ctx[zero] = b1;
+    const b3 = block3();
+    const b4 = ctx[zero];
+    const b2 = multi([b3, b4]);
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
@@ -230,15 +230,15 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
   let { isBoundary, zero } = helpers;
   const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
   
-  let block2 = createBlock(\`<span>cascade 1</span>\`);
+  let block3 = createBlock(\`<span>cascade 1</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    const b3 = ctx[zero];
-    const b1 = multi([b2, b3]);
-    ctx[zero] = b1;
+    const b3 = block3();
+    const b4 = ctx[zero];
+    const b2 = multi([b3, b4]);
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
@@ -342,15 +342,15 @@ exports[`t-call (template calling) nested t-calls with magic variable 0 1`] = `
   const callTemplate_1 = app.getTemplate(\`grandchild\`);
   const callTemplate_2 = app.getTemplate(\`child\`);
   
-  let block1 = createBlock(\`<p>Some content...</p>\`);
+  let block3 = createBlock(\`<p>Some content...</p>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b1 = block1();
-    ctx[zero] = b1;
+    const b3 = block3();
+    ctx[zero] = b3;
     const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     ctx = ctx.__proto__;
     ctx[zero] = b2;
@@ -571,6 +571,134 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 }"
 `;
 
+exports[`t-call (template calling) root t-call with body: t-foreach 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  let { isBoundary, prepareList, withKey, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    ctx = Object.create(ctx);
+    ctx[isBoundary] = 1;
+    ctx = Object.create(ctx);
+    const [k_block2, v_block2, l_block2, c_block2] = prepareList([1]);;
+    for (let i1 = 0; i1 < l_block2; i1++) {
+      ctx[\`i\`] = k_block2[i1];
+      const key1 = ctx['i'];
+      c_block2[i1] = withKey(text(\`1\`), key1);
+    }
+    ctx = ctx.__proto__;
+    const b2 = list(c_block2);
+    ctx[zero] = b2;
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-foreach 2`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return text(\`sub\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-if false 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    ctx = Object.create(ctx);
+    ctx[isBoundary] = 1;
+    let b3;
+    if (false) {
+      b3 = text(\`zero\`);
+    }
+    const b2 = multi([b3]);
+    ctx[zero] = b2;
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-if false 2`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return text(\`sub\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-if true 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    ctx = Object.create(ctx);
+    ctx[isBoundary] = 1;
+    let b3;
+    if (true) {
+      b3 = text(\`zero\`);
+    }
+    const b2 = multi([b3]);
+    ctx[zero] = b2;
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-if true 2`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return text(\`sub\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-out with default 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  let { isBoundary, safeOutput, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    ctx = Object.create(ctx);
+    ctx[isBoundary] = 1;
+    const b2 = safeOutput(ctx['nothing']);
+    ctx[zero] = b2;
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
+  }
+}"
+`;
+
+exports[`t-call (template calling) root t-call with body: t-out with default 2`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return text(\`sub\`);
+  }
+}"
+`;
+
 exports[`t-call (template calling) scoped parameters 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
@@ -705,13 +833,13 @@ exports[`t-call (template calling) t-call with body content as root of a templat
   let { isBoundary, zero } = helpers;
   const callTemplate_1 = app.getTemplate(\`antony\`);
   
-  let block1 = createBlock(\`<p>antony</p>\`);
+  let block2 = createBlock(\`<p>antony</p>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b1 = block1();
-    ctx[zero] = b1;
+    const b2 = block2();
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
@@ -928,7 +1056,7 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
-    let b2,b3;
+    let b2, b3;
     setContextValue(ctx, \\"v1\\", 'elif');
     if (ctx['v1']==='if') {
       b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -1075,8 +1203,8 @@ exports[`t-call (template calling) with unused body 1`] = `
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b1 = text(\`WHEEE\`);
-    ctx[zero] = b1;
+    const b2 = text(\`WHEEE\`);
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
@@ -1136,8 +1264,8 @@ exports[`t-call (template calling) with used body 1`] = `
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b1 = text(\`ok\`);
-    ctx[zero] = b1;
+    const b2 = text(\`ok\`);
+    ctx[zero] = b2;
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"

tests/compiler/__snapshots__/t_esc.test.ts.snap

@@ -180,15 +180,15 @@ exports[`t-esc t-esc=0 is escaped 1`] = `
   const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block2 = createBlock(\`<p>escaped</p>\`);
+  let block3 = createBlock(\`<p>escaped</p>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    ctx[zero] = b2;
-    const b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b3]);
+    const b3 = block3();
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;

tests/compiler/__snapshots__/t_foreach.test.ts.snap

@@ -237,7 +237,7 @@ exports[`t-foreach iterate, position 1`] = `
       ctx[\`elem_last\`] = i1 === k_block2.length - 1;
       ctx[\`elem_index\`] = i1;
       const key1 = ctx['elem'];
-      let b4,b5,b6,b7,b8,b9;
+      let b4, b5, b6, b7, b8, b9;
       b4 = text(\` -\`);
       if (ctx['elem_first']) {
         b5 = text(\` first\`);
@@ -256,6 +256,34 @@ exports[`t-foreach iterate, position 1`] = `
 }"
 `;
 
+exports[`t-foreach iterate, string param 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
+  let { prepareList, withKey } = helpers;
+  
+  return function template(ctx, node, key = \\"\\") {
+    ctx = Object.create(ctx);
+    const [k_block1, v_block1, l_block1, c_block1] = prepareList('abc');;
+    for (let i1 = 0; i1 < l_block1; i1++) {
+      ctx[\`item\`] = k_block1[i1];
+      ctx[\`item_index\`] = i1;
+      ctx[\`item_value\`] = v_block1[i1];
+      const key1 = ctx['item_index'];
+      const b3 = text(\` [\`);
+      const b4 = text(ctx['item_index']);
+      const b5 = text(\`: \`);
+      const b6 = text(ctx['item']);
+      const b7 = text(\` \`);
+      const b8 = text(ctx['item_value']);
+      const b9 = text(\`] \`);
+      c_block1[i1] = withKey(multi([b3, b4, b5, b6, b7, b8, b9]), key1);
+    }
+    return list(c_block1);
+  }
+}"
+`;
+
 exports[`t-foreach simple iteration (in a node) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {

tests/compiler/__snapshots__/t_if.test.ts.snap

@@ -8,7 +8,7 @@ exports[`t-if a t-if next to a div 1`] = `
   let block2 = createBlock(\`<div>foo</div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = block2();
     if (ctx['cond']) {
       b3 = text(\`1\`);
@@ -44,7 +44,7 @@ exports[`t-if boolean value condition elif (no outside node) 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b5;
+    let b2, b3, b4, b5;
     if (ctx['color']=='black') {
       b2 = text(\`black pearl\`);
     } else if (ctx['color']=='yellow') {
@@ -67,7 +67,7 @@ exports[`t-if boolean value condition elif 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-2/><block-child-3/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b5;
+    let b2, b3, b4, b5;
     if (ctx['color']=='black') {
       b2 = text(\`black pearl\`);
     } else if (ctx['color']=='yellow') {
@@ -90,7 +90,7 @@ exports[`t-if boolean value condition else 1`] = `
   let block1 = createBlock(\`<div><span>begin</span><block-child-0/><block-child-1/><span>end</span></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`ok\`);
     } else {
@@ -109,7 +109,7 @@ exports[`t-if boolean value condition false else 1`] = `
   let block1 = createBlock(\`<div><span>begin</span><block-child-0/><block-child-1/><span>end</span></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`fail\`);
     } else {
@@ -145,7 +145,7 @@ exports[`t-if can use some boolean operators in expressions 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-2/><block-child-3/><block-child-4/><block-child-5/><block-child-6/><block-child-7/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b5,b6,b7,b8,b9;
+    let b2, b3, b4, b5, b6, b7, b8, b9;
     if (ctx['cond1']&&ctx['cond2']) {
       b2 = text(\`and\`);
     }
@@ -239,7 +239,7 @@ exports[`t-if simple t-if/t-else 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`1\`);
     } else {
@@ -258,7 +258,7 @@ exports[`t-if simple t-if/t-else in a div 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`1\`);
     } else {
@@ -277,7 +277,7 @@ exports[`t-if t-esc with t-elif 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (false) {
       b2 = text(\`abc\`);
     } else {
@@ -314,7 +314,7 @@ exports[`t-if t-if and t-else with two nodes 1`] = `
   let block5 = createBlock(\`<span>b</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`1\`);
     } else {
@@ -372,7 +372,7 @@ exports[`t-if t-if with empty content 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`hello\`);
     if (ctx['condition']) {
       b3 = text(\`\`);
@@ -388,7 +388,7 @@ exports[`t-if t-if/t-else with more content 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       if (ctx['condition']) {
         b2 = text(\`asf\`);
@@ -458,7 +458,7 @@ exports[`t-if t-set, then t-if, part 3 1`] = `
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
-    let b2,b3;
+    let b2, b3;
     setContextValue(ctx, \\"y\\", false);
     setContextValue(ctx, \\"x\\", ctx['y']);
     if (ctx['x']) {
@@ -477,7 +477,7 @@ exports[`t-if two consecutive t-if 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['cond1']) {
       b2 = text(\`1\`);
     }
@@ -497,7 +497,7 @@ exports[`t-if two consecutive t-if in a div 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['cond1']) {
       b2 = text(\`1\`);
     }
@@ -520,7 +520,7 @@ exports[`t-if two t-ifs next to each other 1`] = `
   let block5 = createBlock(\`<p>2</p>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       let txt1 = ctx['text'];
       b2 = block2([txt1]);

tests/compiler/__snapshots__/t_key.test.ts.snap

@@ -79,7 +79,7 @@ exports[`t-key t-key on sub dom node pushes a child block in its parent 1`] = `
   let block3 = createBlock(\`<div><h1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['hasSpan']) {
       b2 = block2();
     }

tests/compiler/__snapshots__/t_out.test.ts.snap

@@ -35,15 +35,15 @@ exports[`t-out multiple calls to t-out 1`] = `
   const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block2 = createBlock(\`<span>coucou</span>\`);
+  let block3 = createBlock(\`<span>coucou</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    ctx[zero] = b2;
-    const b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b3]);
+    const b3 = block3();
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -102,15 +102,15 @@ exports[`t-out t-out 0 1`] = `
   const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  let block2 = createBlock(\`<div>zero</div>\`);
+  let block3 = createBlock(\`<div>zero</div>\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b2 = block2();
-    ctx[zero] = b2;
-    const b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
-    return block1([], [b3]);
+    const b3 = block3();
+    ctx[zero] = b3;
+    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
+    return block1([], [b2]);
   }
 }"
 `;
@@ -309,7 +309,7 @@ exports[`t-out t-out switch markup on bdom 1`] = `
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
-    let b3,b5;
+    let b3, b5;
     ctx[\`bdom\`] = new LazyValue(value1, ctx, this, node, key);
     if (ctx['hasBdom']) {
       const b4 = safeOutput(ctx['bdom']);

tests/compiler/__snapshots__/t_set.test.ts.snap

@@ -94,7 +94,7 @@ exports[`t-set set from body literal (with t-if/t-else 1`] = `
   let { isBoundary, withDefault, LazyValue } = helpers;
   
   function value1(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['condition']) {
       b2 = text(\`true\`);
     } else {

tests/compiler/svg.test.ts

@@ -9,20 +9,20 @@ describe("properly support svg", () => {
   test("add proper namespace to svg", () => {
     const template = `<svg width="100px" height="90px"><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"/> </svg>`;
     expect(renderToString(template)).toBe(
-      `<svg width=\"100px\" height=\"90px\"><circle cx=\"50\" cy=\"50\" r=\"4\" stroke=\"green\" stroke-width=\"1\" fill=\"yellow\"></circle> </svg>`
+      `<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="90px"><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"></circle> </svg>`
     );
   });
 
   test("add proper namespace to g tags", () => {
     const template = `<g><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"/> </g>`;
     expect(renderToString(template)).toBe(
-      `<g><circle cx=\"50\" cy=\"50\" r=\"4\" stroke=\"green\" stroke-width=\"1\" fill=\"yellow\"></circle> </g>`
+      `<g xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"></circle> </g>`
     );
   });
 
   test("namespace to g tags not added if already in svg namespace", () => {
     const template = `<svg><g/></svg>`;
-    expect(renderToString(template)).toBe(`<svg><g></g></svg>`);
+    expect(renderToString(template)).toBe(`<svg xmlns="http://www.w3.org/2000/svg"><g></g></svg>`);
   });
 
   test("namespace to svg tags added even if already in svg namespace", () => {
@@ -41,8 +41,13 @@ describe("properly support svg", () => {
   test("svg namespace added to sub-blocks", () => {
     const template = `<svg><path t-if="path"/></svg>`;
 
-    expect(renderToString(template, { path: false })).toBe(`<svg></svg>`);
-    expect(renderToString(template, { path: true })).toBe(`<svg><path></path></svg>`);
+    expect(renderToString(template, { path: false })).toBe(
+      `<svg xmlns="http://www.w3.org/2000/svg"></svg>`
+    );
+    // Because the path is its own block, it has its own xmlns attribute
+    expect(renderToString(template, { path: true })).toBe(
+      `<svg xmlns="http://www.w3.org/2000/svg"><path xmlns="http://www.w3.org/2000/svg"></path></svg>`
+    );
 
     const bdom = renderToBdom(template, { path: true });
     const fixture = makeTestFixture();

tests/compiler/t_call.test.ts

@@ -430,6 +430,48 @@ describe("t-call (template calling)", () => {
     expect(context.renderToString("main")).toBe(expected);
   });
 
+  test("root t-call with body: t-if true", () => {
+    const context = new TestContext();
+    const subTemplate = `sub`;
+    const main = `<t t-call="subTemplate"><t t-if="true">zero</t></t>`;
+    context.addTemplate("subTemplate", subTemplate);
+    context.addTemplate("main", main);
+    const expected = "sub";
+    expect(context.renderToString("main")).toBe(expected);
+  });
+
+  test("root t-call with body: t-if false", () => {
+    const context = new TestContext();
+    const subTemplate = `sub`;
+    const main = `<t t-call="subTemplate"><t t-if="false">zero</t></t>`;
+    context.addTemplate("subTemplate", subTemplate);
+    context.addTemplate("main", main);
+    const expected = "sub";
+    expect(context.renderToString("main")).toBe(expected);
+  });
+
+  test("root t-call with body: t-out with default", () => {
+    const context = new TestContext();
+    const subTemplate = `sub`;
+    const main = `<t t-call="subTemplate"><t t-out="nothing">default</t></t>`;
+    context.addTemplate("subTemplate", subTemplate);
+    context.addTemplate("main", main);
+    const expected = "sub";
+    expect(context.renderToString("main")).toBe(expected);
+  });
+
+  test("root t-call with body: t-foreach", () => {
+    const context = new TestContext();
+    const subTemplate = `sub`;
+    const main = `<t t-call="subTemplate">
+      <t t-foreach="[1]" t-as="i" t-key="i">1</t>
+    </t>`;
+    context.addTemplate("subTemplate", subTemplate);
+    context.addTemplate("main", main);
+    const expected = "sub";
+    expect(context.renderToString("main")).toBe(expected);
+  });
+
   test("dynamic t-call", () => {
     const context = new TestContext();
     const foo = `<foo><t t-esc="val"/></foo>`;

tests/compiler/t_foreach.test.ts

@@ -131,6 +131,15 @@ describe("t-foreach", () => {
     expect(renderToString(template, context)).toBe(expected);
   });
 
+  test("iterate, string param", () => {
+    const template = `
+      <t t-foreach="'abc'" t-as="item" t-key="item_index">
+        [<t t-esc="item_index"/>: <t t-esc="item"/> <t t-esc="item_value"/>]
+      </t>`;
+    const expected = ` [0: a a]  [1: b b]  [2: c c] `;
+    expect(renderToString(template)).toBe(expected);
+  });
+
   test("iterate, iterable param", () => {
     const template = `
       <t t-foreach="map.values()" t-as="item" t-key="item_index">

tests/compiler/validation.test.ts

@@ -11,8 +11,8 @@ describe("basic validation", () => {
     expect(() => context.getTemplate("invalidname")).toThrow("Missing template");
   });
 
-  test("cannot add a different template with the same name", () => {
-    const context = new TemplateSet();
+  test("cannot add a different template with the same name in dev mode", () => {
+    const context = new TemplateSet({ dev: true });
     context.addTemplate("test", `<t/>`);
     // Same template with the same name is fine
     expect(() => context.addTemplate("test", "<t/>")).not.toThrow();
@@ -20,6 +20,13 @@ describe("basic validation", () => {
     expect(() => context.addTemplate("test", "<div/>")).toThrow("already defined");
   });
 
+  test("adding different template with same name outside dev mode silently ignores it", () => {
+    const context = new TemplateSet({ dev: false });
+    context.addTemplate("test", `<t/>`);
+    expect(() => context.addTemplate("test", "<div/>")).not.toThrow();
+    expect(context.rawTemplates.test).toBe("<t/>");
+  });
+
   test("invalid xml", () => {
     const template = "<div>";
     expect(() => snapshotTemplate(template)).toThrow("Invalid XML in template");

tests/components/__snapshots__/basics.test.ts.snap

@@ -440,7 +440,7 @@ exports[`basics higher order components parent and child 2`] = `
   const comp2 = app.createComponent(\`ChildB\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['props'].child==='a') {
       b2 = comp1({}, key + \`__1\`, node, this, null);
     } else {
@@ -738,7 +738,7 @@ exports[`basics sub components between t-ifs 1`] = `
   let block5 = createBlock(\`<span>test</span>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b5;
+    let b2, b3, b4, b5;
     if (ctx['state'].flag) {
       b2 = block2();
     } else {
@@ -776,7 +776,7 @@ exports[`basics t-elif works with t-component 1`] = `
   let block2 = createBlock(\`<div>somediv</div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flag) {
       b2 = block2();
     } else if (!ctx['state'].flag) {
@@ -810,7 +810,7 @@ exports[`basics t-else with empty string works with t-component 1`] = `
   let block2 = createBlock(\`<div>somediv</div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flag) {
       b2 = block2();
     } else {
@@ -844,7 +844,7 @@ exports[`basics t-else works with t-component 1`] = `
   let block2 = createBlock(\`<div>somediv</div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flag) {
       b2 = block2();
     } else {
@@ -909,7 +909,7 @@ exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (false) {
       const tKey_1 = 'str';
       b2 = toggler(tKey_1, comp1({}, tKey_1 + key + \`__1\`, node, this, null));
@@ -1248,7 +1248,7 @@ exports[`support svg components add proper namespace to svg 1`] = `
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   const comp1 = app.createComponent(\`GComp\`, true, false, false, []);
   
-  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
+  let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><block-child-0 xmlns=\\"\\"/></svg>\`);
   
   return function template(ctx, node, key = \\"\\") {
     const b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -1262,7 +1262,7 @@ exports[`support svg components add proper namespace to svg 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
   
-  let block1 = createBlock(\`<g block-ns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/></g>\`);
+  let block1 = createBlock(\`<g xmlns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/></g>\`);
   
   return function template(ctx, node, key = \\"\\") {
     return block1();

tests/components/__snapshots__/concurrency.test.ts.snap

@@ -61,7 +61,7 @@ exports[`another scenario with delayed rendering 1`] = `
   const comp1 = app.createComponent(\`B\`, true, false, false, [\\"value\\"]);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`A\`);
     if (ctx['state'].value<15) {
       b3 = comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null);
@@ -244,7 +244,7 @@ exports[`components are not destroyed between animation frame 1`] = `
   const comp1 = app.createComponent(\`B\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`A\`);
     if (ctx['state'].flag) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -831,7 +831,7 @@ exports[`concurrent renderings scenario 13 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = comp1({}, key + \`__1\`, node, this, null);
     if (ctx['state'].bool) {
       b3 = comp2({}, key + \`__2\`, node, this, null);
@@ -978,7 +978,7 @@ exports[`concurrent renderings scenario 16 3`] = `
   const comp1 = app.createComponent(\`D\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4,b5,b6,b7,b8;
+    let b2, b3, b4, b5, b6, b7, b8;
     b2 = text(ctx['props'].fromA);
     b3 = text(\`:\`);
     b4 = text(ctx['props'].fromB);
@@ -1012,7 +1012,7 @@ exports[`creating two async components, scenario 1 1`] = `
   const comp2 = app.createComponent(\`ChildB\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flagA) {
       b2 = comp1({}, key + \`__1\`, node, this, null);
     }
@@ -1061,7 +1061,7 @@ exports[`creating two async components, scenario 2 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = comp1({val: ctx['state'].valA}, key + \`__1\`, node, this, null);
     if (ctx['state'].flagB) {
       b3 = comp2({val: ctx['state'].valB}, key + \`__2\`, node, this, null);
@@ -1109,7 +1109,7 @@ exports[`creating two async components, scenario 3 (patching in the same frame)
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = comp1({val: ctx['state'].valA}, key + \`__1\`, node, this, null);
     if (ctx['state'].flagB) {
       b3 = comp2({val: ctx['state'].valB}, key + \`__2\`, node, this, null);
@@ -1421,7 +1421,7 @@ exports[`delayed rendering, destruction, stuff happens 2`] = `
   const comp1 = app.createComponent(\`C\`, true, false, false, [\\"value\\"]);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`B\`);
     if (ctx['state'].hasChild) {
       b3 = comp1({value: ctx['state'].someValue+ctx['props'].value}, key + \`__1\`, node, this, null);
@@ -1514,7 +1514,7 @@ exports[`delayed rendering, reusing fiber then component is destroyed and  stuff
   const comp1 = app.createComponent(\`B\`, true, false, false, [\\"value\\"]);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`A\`);
     if (ctx['state'].value<15) {
       b3 = comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null);
@@ -1572,7 +1572,7 @@ exports[`delayed rendering, then component is destroyed and  stuff 2`] = `
   const comp1 = app.createComponent(\`C\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(ctx['props'].value);
     if (ctx['props'].value<10) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -1605,7 +1605,7 @@ exports[`destroyed component causes other soon to be destroyed component to rere
   const comp2 = app.createComponent(\`C\`, true, false, false, [\\"value\\"]);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\` A \`);
     if (ctx['state'].flag) {
       const b4 = comp1({value: ctx['state'].valueB}, key + \`__1\`, node, this, null);
@@ -1646,7 +1646,7 @@ exports[`destroying/recreating a subcomponent, other scenario 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`parent\`);
     if (ctx['state'].hasChild) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -1846,7 +1846,7 @@ exports[`renderings, destruction, patch, stuff, ... yet another variation 2`] =
   const comp1 = app.createComponent(\`C\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(\`B\`);
     if (ctx['props'].value===33) {
       b3 = comp1({}, key + \`__1\`, node, this, null);

tests/components/__snapshots__/error_handling.test.ts.snap

@@ -103,7 +103,7 @@ exports[`basics simple catchError 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['error']) {
       b2 = text(\`Error\`);
     } else {
@@ -201,7 +201,7 @@ exports[`can catch errors an error in onWillDestroy 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(ctx['state'].value);
     if (ctx['state'].hasChild) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -231,7 +231,7 @@ exports[`can catch errors an error in onWillDestroy, variation 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     b2 = text(ctx['state'].value);
     if (ctx['state'].hasChild) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -295,7 +295,7 @@ exports[`can catch errors can catch an error in a component render function 2`]
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -350,7 +350,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -394,7 +394,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -474,7 +474,7 @@ exports[`can catch errors can catch an error in the initial call of a component
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -532,7 +532,7 @@ exports[`can catch errors can catch an error in the initial call of a component
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -593,7 +593,7 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -626,7 +626,7 @@ exports[`can catch errors can catch an error in the mounted call (in root compon
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -680,7 +680,7 @@ exports[`can catch errors can catch an error in the mounted call 2`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -735,7 +735,7 @@ exports[`can catch errors can catch an error in the willPatch call 2`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -790,7 +790,7 @@ exports[`can catch errors can catch an error in the willStart call 2`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -847,7 +847,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -893,7 +893,7 @@ exports[`can catch errors catchError in catchError 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['error']) {
       b2 = text(\`Error\`);
     } else {
@@ -1123,7 +1123,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].error) {
       b2 = text(\`Error handled\`);
     } else {
@@ -1167,7 +1167,7 @@ exports[`can catch errors onError in class inheritance is called if rethrown 2`]
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (!ctx['state'].error) {
       b2 = text(ctx['this'].will.crash);
     } else {
@@ -1198,7 +1198,7 @@ exports[`can catch errors onError in class inheritance is not called if no rethr
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (!ctx['state'].error) {
       b2 = text(ctx['this'].will.crash);
     } else {

tests/components/__snapshots__/higher_order_component.test.ts.snap

@@ -34,7 +34,7 @@ exports[`basics can select a sub widget  1`] = `
   const comp2 = app.createComponent(\`OtherChild\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['env'].options.flag) {
       b2 = comp1({}, key + \`__1\`, node, this, null);
     }
@@ -80,7 +80,7 @@ exports[`basics can select a sub widget, part 2 1`] = `
   const comp2 = app.createComponent(\`OtherChild\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flag) {
       b2 = comp1({}, key + \`__1\`, node, this, null);
     }

tests/components/__snapshots__/lifecycle.test.ts.snap

@@ -54,7 +54,7 @@ exports[`lifecycle hooks component semantics 3`] = `
   let block1 = createBlock(\`<div>C<block-child-0/><block-child-1/><block-child-2/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4;
+    let b2, b3, b4;
     b2 = comp1({}, key + \`__1\`, node, this, null);
     if (ctx['state'].flag) {
       b3 = comp2({}, key + \`__2\`, node, this, null);
@@ -174,7 +174,7 @@ exports[`lifecycle hooks destroy new children before being mountged 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, false, false, []);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3,b4;
+    let b2, b3, b4;
     b2 = text(\`before\`);
     if (ctx['state'].flag) {
       b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -826,7 +826,7 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
   let block3 = createBlock(\`<div/>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].ok) {
       b2 = comp1({}, key + \`__1\`, node, this, null);
     } else {

tests/components/__snapshots__/props_validation.test.ts.snap

@@ -39,7 +39,7 @@ exports[`default props can set default boolean values 2`] = `
   let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['props'].p) {
       b2 = text(\`hey\`);
     }

tests/components/__snapshots__/refs.test.ts.snap

@@ -23,7 +23,7 @@ exports[`refs can use 2 refs with same name in a t-if/t-else situation 1`] = `
   let block3 = createBlock(\`<span block-ref=\\"0\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].value) {
       let ref1 = (el) => this.__owl__.setRef((\`coucou\`), el);
       b2 = block2([ref1]);

tests/components/__snapshots__/slots.test.ts.snap

@@ -509,7 +509,7 @@ exports[`slots default slot with slot scope: shorthand syntax 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, true, false, []);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['slotScope'].bool) {
       b2 = text(\`some text\`);
     } else {
@@ -633,7 +633,7 @@ exports[`slots dynamic slot in multiple locations 2`] = `
   let block2 = createBlock(\`<p><block-child-0/></p>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b4;
+    let b2, b4;
     if (ctx['props'].location===1) {
       const slot1 = ('coffee');
       const b3 = toggler(slot1, callSlot(ctx, node, key + \`__1\`, slot1, true, {}));
@@ -1462,7 +1462,7 @@ exports[`slots simple default slot with params 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, true, false, []);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['slotScope'].bool) {
       b2 = text(\`some text\`);
     } else {
@@ -1558,7 +1558,7 @@ exports[`slots simple dynamic slot with slot scope 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, true, false, []);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['slotScope'].bool) {
       b2 = text(\`some text\`);
     } else {
@@ -1665,7 +1665,7 @@ exports[`slots simple slot with slot scope 1`] = `
   const comp1 = app.createComponent(\`Child\`, true, true, false, []);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['slotScope'].bool) {
       b2 = text(\`some text\`);
     } else {
@@ -2082,7 +2082,7 @@ exports[`slots slot in multiple locations 2`] = `
   let block2 = createBlock(\`<p><block-child-0/></p>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b4;
+    let b2, b4;
     if (ctx['props'].location===1) {
       const b3 = callSlot(ctx, node, key, 'default', false, {});
       b2 = block2([], [b3]);
@@ -2887,7 +2887,7 @@ exports[`slots t-slot in recursive templates 1`] = `
       ctx[\`item_index\`] = i1;
       ctx[\`item_value\`] = v_block3[i1];
       const key1 = ctx['item'].name;
-      let b5,b6;
+      let b5, b6;
       if (!ctx['item'].children.length) {
         b5 = text(ctx['item'].name);
       } else {

tests/components/__snapshots__/style_class.test.ts.snap

@@ -166,7 +166,7 @@ exports[`style and class handling class on sub component, which is switched to a
   const comp2 = app.createComponent(\`ChildB\`, true, false, false, [\\"class\\"]);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['props'].child==='a') {
       b2 = comp1({class: ctx['props'].class}, key + \`__1\`, node, this, null);
     } else {

tests/components/__snapshots__/t_call.test.ts.snap

@@ -10,8 +10,8 @@ exports[`t-call dynamic t-call 1`] = `
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
-    const b1 = text(\` owl \`);
-    ctx[zero] = b1;
+    const b2 = text(\` owl \`);
+    ctx[zero] = b2;
     const template1 = (ctx['current'].template);
     return call(this, template1, ctx, node, key + \`__1\`);
   }
@@ -364,7 +364,7 @@ exports[`t-call sub components in two t-calls 1`] = `
   let block3 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].val===1) {
       b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     } else {

tests/components/__snapshots__/t_model.test.ts.snap

@@ -376,7 +376,7 @@ exports[`t-model directive on an input, type=checkbox 1`] = `
   let block1 = createBlock(\`<div><input type=\\"checkbox\\" block-property-0=\\"checked\\" block-handler-1=\\"input\\"/><span><block-child-0/><block-child-1/></span></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     const bExpr1 = ctx['state'];
     const expr1 = 'flag';
     let prop1 = bExpr1[expr1];
@@ -640,7 +640,7 @@ exports[`t-model directive two inputs in a div alternating with a t-if 1`] = `
   let block3 = createBlock(\`<input class=\\"b\\" block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['state'].flag) {
       const bExpr1 = ctx['state'];
       const expr1 = 'text1';

tests/components/basics.test.ts

@@ -1024,7 +1024,7 @@ describe("support svg components", () => {
     await mount(Svg, fixture);
 
     expect(fixture.innerHTML).toBe(
-      '<svg><g><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"></circle></g></svg>'
+      '<svg xmlns="http://www.w3.org/2000/svg"><g xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="4" stroke="green" stroke-width="1" fill="yellow"></circle></g></svg>'
     );
   });
 });

tests/misc/__snapshots__/portal.test.ts.snap

@@ -345,7 +345,7 @@ exports[`Portal conditional use of Portal (with sub Component) 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b4;
+    let b2, b4;
     b2 = block2();
     if (ctx['state'].hasPortal) {
       b4 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
@@ -384,7 +384,7 @@ exports[`Portal conditional use of Portal 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b4;
+    let b2, b4;
     b2 = block2();
     if (ctx['state'].hasPortal) {
       b4 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
@@ -699,7 +699,7 @@ exports[`Portal portal with dynamic body 1`] = `
   let block4 = createBlock(\`<div/>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b3,b4;
+    let b3, b4;
     if (ctx['state'].val) {
       let txt1 = ctx['state'].val;
       b3 = block3([txt1]);
@@ -848,7 +848,7 @@ exports[`Portal simple catchError with portal 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2,b3;
+    let b2, b3;
     if (ctx['error']) {
       b2 = text(\`Error\`);
     } else {

tests/reactivity.test.ts

@@ -1292,6 +1292,12 @@ describe("Collections", () => {
 
       state.add(3); // setting unobserved key doesn't notify
       expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.has(3)).toBe(true); // subscribe to 3
+      state.add(3); // adding observed key doesn't notify if key was already present
+      expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.has(4)).toBe(false); // subscribe to 4
+      state.delete(4); // deleting observed key doesn't notify if key was already not present
+      expect(observer).toHaveBeenCalledTimes(3);
     });
 
     test("iterating on keys returns reactives", async () => {
@@ -1485,6 +1491,12 @@ describe("Collections", () => {
 
       state.set(3, 4); // setting unobserved key doesn't notify
       expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.has(3)).toBe(true); // subscribe to 3
+      state.set(3, 4); // setting the same value doesn't notify
+      expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.has(4)).toBe(false); // subscribe to 4
+      state.delete(4); // deleting observed key doesn't notify if key was already not present
+      expect(observer).toHaveBeenCalledTimes(3);
     });
 
     test("checking for a key with 'get' subscribes the callback to changes to that key", () => {
@@ -1510,6 +1522,12 @@ describe("Collections", () => {
 
       state.set(3, 4); // setting unobserved key doesn't notify
       expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.get(3)).toBe(4); // subscribe to 3
+      state.set(3, 4); // setting the same value doesn't notify
+      expect(observer).toHaveBeenCalledTimes(3);
+      expect(state.get(4)).toBe(undefined); // subscribe to 4
+      state.delete(4); // deleting observed key doesn't notify if key was already not present
+      expect(observer).toHaveBeenCalledTimes(3);
     });
 
     test("getting values returns a reactive", async () => {

tools/devtools/manifest-chrome.json

@@ -1,6 +1,6 @@
 {
   "name": "Owl devtools",
-  "version": "1.1.1",
+  "version": "1.2.1",
   "manifest_version": 3,
   "description": "Chrome devtools extension for Odoo Owl framework",
   "icons": {

tools/devtools/src/page_scripts/owl_devtools_global_hook.js

@@ -1396,7 +1396,7 @@
         return this.getDOMElementsRecursive(node.content);
       }
       if (node.hasOwnProperty("el")) {
-        if (node.el instanceof HTMLElement || node.el instanceof Text) {
+        if (node.el instanceof Element || node.el instanceof Text) {
           return [node.el];
         }
       }
@@ -1415,7 +1415,7 @@
         }
       }
       if (node.hasOwnProperty("parentEl")) {
-        if (node.parentEl instanceof HTMLElement) {
+        if (node.parentEl instanceof Element) {
           return [node.parentEl];
         }
       }
@@ -1527,6 +1527,9 @@
     // Use inspectedPath to specify the path of the selected component
     getComponentsTree(inspectedPath = null, oldTrees = null, oldDetails = null) {
       const appsArray = [...this.apps];
+      if (inspectedPath && !this.getComponentNode(inspectedPath)) {
+        inspectedPath = null;
+      }
       const trees = appsArray.map((app, index) => {
         let oldTree;
         if (oldTrees) {