[IMP] portal: add support for .closest modifier

It is sometimes useful in practice to be able to configure the portal so that it looks for a target as close as possible as the portal location. For example, in odoo, a portal may be set up in a form view that should target the current form view. But if the form view itself is in a dialog, it may fail, because it may find a valid target in the form view that is located underneath. With this commit, we add a .closest modifier to the `t-portal` directive.
2025-10-06 19:59:41 +07:00 · 2023-05-08 11:58:56 +02:00
92 changed files with 1829 additions and 4098 deletions
@@ -451,6 +451,5 @@ console.log(status(component));
 // logs either:
 // - 'new', if the component is new and has not been mounted yet
 // - 'mounted', if the component is currently mounted
 // - 'cancelled', if the component has not been mounted yet but will be destroyed soon
 // - 'destroyed' if the component is currently destroyed
 ```
@@ -15,3 +15,11 @@ class SomeComponent extends Component {
 The `t-portal` directive takes a valid css selector as argument. The content of
 the portalled template will be mounted at the corresponding location. Note that
 Owl need to insert an empty text node at the location of the portalled content.
 The `t-portal` directive supports a `.closest` modifier. It is useful to select
 the closest target from the portal location: Owl will look for a target in the
 current parent element, then in its parent, and so on until it finds it.
 ```xml
      <div t-portal.closest="'.target'">some content</div>
 ```
@@ -376,16 +376,15 @@ An important difference should be made with the usual `QWeb` behaviour: Owl
 requires the presence of a `t-key` directive, to be able to properly reconcile
 renderings.
-`t-foreach` can iterate on any iterable, and also has special support for objects
+`t-foreach` can iterate on an array (the current item will be the current value)
-and maps, it will expose the key of the current iteration as the contents of the
+or an object (the current item will be the current key).
 `t-as`, and the corresponding value with the same name and the suffix `_value`.
-In addition to the name passed via t-as, `t-foreach` provides a few other useful
+In addition to the name passed via t-as, `t-foreach` provides a few other
-variables (note: `$as` will be replaced with the name passed to `t-as`):
+variables for various data points (note: `$as` will be replaced with the name
 passed to `t-as`):
- `$as_value`: the current iteration value, identical to `$as` for arrays and
+- `$as_value`: the current iteration value, identical to `$as` for lists and
-  other iterables, but for objects and maps, it provides the value (where `$as`
+  integers, but for objects, it provides the value (where `$as` provides the key)
  provides the key)
 - `$as_index`: the current iteration index (the first item of the iteration has index 0)
 - `$as_first`: whether the current item is the first of the iteration
  (equivalent to `$as_index == 0`)
@@ -10,7 +10,7 @@
  <link rel="stylesheet" href="assets/milligram.css">
  <link rel="stylesheet" href="assets/highlight.tomorrow.css">
  <link rel="stylesheet" href="assets/main.css">
-  <script type="importmap">{ "imports": { "@odoo/owl": "./owl.js" } }</script>
+  <script src="./owl.js"></script>
 </head>
 <body>
  <header class="container">
@@ -68,6 +68,7 @@
    <p><a href=".">OWL</a> is licensed under LGPLv3.<br>Logo from <a href="https://github.com/googlefonts/noto-emoji">Google Noto Emoji Font</a>, licensed under Apache License 2.0</p>
  </footer>
  <script src="assets/highlight.pack.js"></script>
  <script type="importmap">{ "imports": { "@odoo/owl": "./owl.js" } }</script>
  <script type="module" src="display_code.js"></script>
  <script type="module" src="counter.js"></script>
 </body>
@@ -122,16 +122,14 @@ function handleError(params) {
    }
    const node = "node" in params ? params.node : params.fiber.node;
    const fiber = "fiber" in params ? params.fiber : node.fiber;
-    if (fiber) {
+    // resets the fibers on components if possible. This is important so that
-        // resets the fibers on components if possible. This is important so that
+    // new renderings can be properly included in the initial one, if any.
-        // new renderings can be properly included in the initial one, if any.
+    let current = fiber;
-        let current = fiber;
+    do {
-        do {
+        current.node.fiber = current;
-            current.node.fiber = current;
+        current = current.parent;
-            current = current.parent;
+    } while (current);
-        } while (current);
+    fibersInError.set(fiber.root, error);
        fibersInError.set(fiber.root, error);
    }
    const handled = _handleError(node, error);
    if (!handled) {
        console.warn(`[Owl] Unhandled error. Destroying the root component`);
@@ -177,21 +175,11 @@ function createAttrUpdater(attr) {
 }
 function attrsSetter(attrs) {
    if (isArray(attrs)) {
-        if (attrs[0] === "class") {
+        setAttribute.call(this, attrs[0], attrs[1]);
            setClass.call(this, attrs[1]);
        }
        else {
            setAttribute.call(this, attrs[0], attrs[1]);
        }
    }
    else {
        for (let k in attrs) {
-            if (k === "class") {
+            setAttribute.call(this, k, attrs[k]);
                setClass.call(this, attrs[k]);
            }
            else {
                setAttribute.call(this, k, attrs[k]);
            }
        }
    }
 }
@@ -203,12 +191,7 @@ function attrsUpdater(attrs, oldAttrs) {
            if (val === oldAttrs[1]) {
                return;
            }
-            if (name === "class") {
+            setAttribute.call(this, name, val);
                updateClass.call(this, val, oldAttrs[1]);
            }
            else {
                setAttribute.call(this, name, val);
            }
        }
        else {
            removeAttribute.call(this, oldAttrs[0]);
@@ -218,23 +201,13 @@ function attrsUpdater(attrs, oldAttrs) {
    else {
        for (let k in oldAttrs) {
            if (!(k in attrs)) {
-                if (k === "class") {
+                removeAttribute.call(this, k);
                    updateClass.call(this, "", oldAttrs[k]);
                }
                else {
                    removeAttribute.call(this, k);
                }
            }
        }
        for (let k in attrs) {
            const val = attrs[k];
            if (val !== oldAttrs[k]) {
-                if (k === "class") {
+                setAttribute.call(this, k, val);
                    updateClass.call(this, val, oldAttrs[k]);
                }
                else {
                    setAttribute.call(this, k, val);
                }
            }
        }
    }
@@ -313,13 +286,20 @@ function updateClass(val, oldVal) {
 * @returns a batched version of the original callback
 */
 function batched(callback) {
-    let scheduled = false;
+    let called = false;
-    return async (...args) => {
+    return async () => {
-        if (!scheduled) {
+        // This await blocks all calls to the callback here, then releases them sequentially
-            scheduled = true;
+        // in the next microtick. This line decides the granularity of the batch.
-            await Promise.resolve();
+        await Promise.resolve();
-            scheduled = false;
+        if (!called) {
-            callback(...args);
+            called = true;
            // wait for all calls in this microtick to fall through before resetting "called"
            // so that only the first call to the batched function calls the original callback.
            // Schedule this before calling the callback so that calls to the batched function
            // within the callback will proceed only after resetting called to false, and have
            // a chance to execute the callback again
            Promise.resolve().then(() => (called = false));
            callback();
        }
    };
 }
@@ -1652,7 +1632,8 @@ function cancelFibers(fibers) {
        let node = fiber.node;
        fiber.render = throwOnRender;
        if (node.status === 0 /* NEW */) {
-            node.cancel();
+            node.destroy();
            delete node.parent.children[node.parentKey];
        }
        node.fiber = null;
        if (fiber.bdom) {
@@ -2379,9 +2360,6 @@ class ComponentNode {
        }
    }
    async render(deep) {
        if (this.status >= 2 /* CANCELLED */) {
            return;
        }
        let current = this.fiber;
        if (current && (current.root.locked || current.bdom === true)) {
            await Promise.resolve();
@@ -2407,7 +2385,7 @@ class ComponentNode {
        this.fiber = fiber;
        this.app.scheduler.addFiber(fiber);
        await Promise.resolve();
-        if (this.status >= 2 /* CANCELLED */) {
+        if (this.status === 2 /* DESTROYED */) {
            return;
        }
        // We only want to actually render the component if the following two
@@ -2425,18 +2403,6 @@ class ComponentNode {
            fiber.render();
        }
    }
    cancel() {
        this._cancel();
        delete this.parent.children[this.parentKey];
        this.app.scheduler.scheduleDestroy(this);
    }
    _cancel() {
        this.status = 2 /* CANCELLED */;
        const children = this.children;
        for (let childKey in children) {
            children[childKey]._cancel();
        }
    }
    destroy() {
        let shouldRemove = this.status === 1 /* MOUNTED */;
        this._destroy();
@@ -2464,7 +2430,7 @@ class ComponentNode {
                this.app.handleError({ error: e, node: this });
            }
        }
-        this.status = 3 /* DESTROYED */;
+        this.status = 2 /* DESTROYED */;
    }
    async updateAndRender(props, parentFiber) {
        this.nextProps = props;
@@ -2997,22 +2963,12 @@ function prepareList(collection) {
        keys = collection;
        values = collection;
    }
-    else if (collection instanceof Map) {
+    else if (collection) {
-        keys = [...collection.keys()];
+        values = Object.keys(collection);
-        values = [...collection.values()];
+        keys = Object.values(collection);
    }
    else if (collection && typeof collection === "object") {
        if (Symbol.iterator in collection) {
            keys = [...collection];
            values = keys;
        }
        else {
            values = Object.keys(collection);
            keys = Object.values(collection);
        }
    }
    else {
-        throw new OwlError(`Invalid loop expression: "${collection}" is not iterable`);
+        throw new OwlError("Invalid loop expression");
    }
    const n = values.length;
    return [keys, values, n, new Array(n)];
@@ -3919,10 +3875,6 @@ class CodeGenerator {
        })
            .join("");
    }
    translate(str) {
        const match = translationRE.exec(str);
        return match[1] + this.translateFn(match[2]) + match[3];
    }
    /**
     * @returns the newly created block name, if any
     */
@@ -4000,7 +3952,8 @@ class CodeGenerator {
        let { block, forceNewBlock } = ctx;
        let value = ast.value;
        if (value && ctx.translate !== false) {
-            value = this.translate(value);
+            const match = translationRE.exec(value);
            value = match[1] + this.translateFn(match[2]) + match[3];
        }
        if (!ctx.inPreTag) {
            value = value.replace(whitespaceRE, " ");
@@ -4541,12 +4494,11 @@ class CodeGenerator {
        else {
            let value;
            if (ast.defaultValue) {
                const defaultValue = ctx.translate ? this.translate(ast.defaultValue) : ast.defaultValue;
                if (ast.value) {
-                    value = `withDefault(${expr}, \`${defaultValue}\`)`;
+                    value = `withDefault(${expr}, \`${ast.defaultValue}\`)`;
                }
                else {
-                    value = `\`${defaultValue}\``;
+                    value = `\`${ast.defaultValue}\``;
                }
            }
            else {
@@ -4839,10 +4791,10 @@ function parseNode(node, ctx) {
        parseTCall(node, ctx) ||
        parseTCallBlock(node) ||
        parseTEscNode(node, ctx) ||
        parseTOutNode(node, ctx) ||
        parseTKey(node, ctx) ||
        parseTTranslation(node, ctx) ||
        parseTSlot(node, ctx) ||
        parseTOutNode(node, ctx) ||
        parseComponent(node, ctx) ||
        parseDOMNode(node, ctx) ||
        parseTSetNode(node, ctx) ||
@@ -4927,10 +4879,10 @@ function parseDOMNode(node, ctx) {
    let model = null;
    for (let attr of nodeAttrsNames) {
        const value = node.getAttribute(attr);
-        if (attr === "t-on" || attr === "t-on-") {
+        if (attr.startsWith("t-on")) {
-            throw new OwlError("Missing event name with t-on directive");
+            if (attr === "t-on") {
-        }
+                throw new OwlError("Missing event name with t-on directive");
-        if (attr.startsWith("t-on-")) {
+            }
            on = on || {};
            on[attr.slice(5)] = value;
        }
@@ -4955,8 +4907,10 @@ function parseDOMNode(node, ctx) {
            const typeAttr = node.getAttribute("type");
            const isInput = tagName === "input";
            const isSelect = tagName === "select";
            const isTextarea = tagName === "textarea";
            const isCheckboxInput = isInput && typeAttr === "checkbox";
            const isRadioInput = isInput && typeAttr === "radio";
            const isOtherInput = isInput && !isCheckboxInput && !isRadioInput;
            const hasLazyMod = attr.includes(".lazy");
            const hasNumberMod = attr.includes(".number");
            const hasTrimMod = attr.includes(".trim");
@@ -4968,8 +4922,8 @@ function parseDOMNode(node, ctx) {
                specialInitTargetAttr: isRadioInput ? "checked" : null,
                eventType,
                hasDynamicChildren: false,
-                shouldTrim: hasTrimMod,
+                shouldTrim: hasTrimMod && (isOtherInput || isTextarea),
-                shouldNumberize: hasNumberMod,
+                shouldNumberize: hasNumberMod && (isOtherInput || isTextarea),
            };
            if (isSelect) {
                // don't pollute the original ctx
@@ -5032,6 +4986,9 @@ function parseTEscNode(node, ctx) {
            content: [tesc],
        };
    }
    if (ast.type === 11 /* TComponent */) {
        throw new OwlError("t-esc is not supported on Component nodes");
    }
    return tesc;
 }
 // -----------------------------------------------------------------------------
@@ -5473,21 +5430,19 @@ function normalizeTIf(el) {
 *
 * @param el the element containing the tree that should be normalized
 */
-function normalizeTEscTOut(el) {
+function normalizeTEsc(el) {
-    for (const d of ["t-esc", "t-out"]) {
+    const elements = [...el.querySelectorAll("[t-esc]")].filter((el) => el.tagName[0] === el.tagName[0].toUpperCase() || el.hasAttribute("t-component"));
-        const elements = [...el.querySelectorAll(`[${d}]`)].filter((el) => el.tagName[0] === el.tagName[0].toUpperCase() || el.hasAttribute("t-component"));
+    for (const el of elements) {
-        for (const el of elements) {
+        if (el.childNodes.length) {
-            if (el.childNodes.length) {
+            throw new OwlError("Cannot have t-esc on a component that already has content");
                throw new OwlError(`Cannot have ${d} on a component that already has content`);
            }
            const value = el.getAttribute(d);
            el.removeAttribute(d);
            const t = el.ownerDocument.createElement("t");
            if (value != null) {
                t.setAttribute(d, value);
            }
            el.appendChild(t);
        }
        const value = el.getAttribute("t-esc");
        el.removeAttribute("t-esc");
        const t = el.ownerDocument.createElement("t");
        if (value != null) {
            t.setAttribute("t-esc", value);
        }
        el.appendChild(t);
    }
 }
 /**
@@ -5498,7 +5453,7 @@ function normalizeTEscTOut(el) {
 */
 function normalizeXML(el) {
    normalizeTIf(el);
-    normalizeTEscTOut(el);
+    normalizeTEsc(el);
 }
 /**
 * Parses an XML string into an XML document, throwing errors on parser errors
@@ -5551,7 +5506,7 @@ function compile(template, options = {}) {
 }
 // do not modify manually. This file is generated by the release script.
-const version = "2.2.3";
+const version = "2.1.2";
 // -----------------------------------------------------------------------------
 //  Scheduler
@@ -5561,18 +5516,11 @@ class Scheduler {
        this.tasks = new Set();
        this.frame = 0;
        this.delayedRenders = [];
        this.cancelledNodes = new Set();
        this.requestAnimationFrame = Scheduler.requestAnimationFrame;
    }
    addFiber(fiber) {
        this.tasks.add(fiber.root);
    }
    scheduleDestroy(node) {
        this.cancelledNodes.add(node);
        if (this.frame === 0) {
            this.frame = this.requestAnimationFrame(() => this.processTasks());
        }
    }
    /**
     * Process all current tasks. This only applies to the fibers that are ready.
     * Other tasks are left unchanged.
@@ -5582,28 +5530,21 @@ class Scheduler {
            let renders = this.delayedRenders;
            this.delayedRenders = [];
            for (let f of renders) {
-                if (f.root && f.node.status !== 3 /* DESTROYED */ && f.node.fiber === f) {
+                if (f.root && f.node.status !== 2 /* DESTROYED */ && f.node.fiber === f) {
                    f.render();
                }
            }
        }
        if (this.frame === 0) {
-            this.frame = this.requestAnimationFrame(() => this.processTasks());
+            this.frame = this.requestAnimationFrame(() => {
-        }
+                this.frame = 0;
-    }
+                this.tasks.forEach((fiber) => this.processFiber(fiber));
-    processTasks() {
+                for (let task of this.tasks) {
-        this.frame = 0;
+                    if (task.node.status === 2 /* DESTROYED */) {
-        for (let node of this.cancelledNodes) {
+                        this.tasks.delete(task);
-            node._destroy();
+                    }
-        }
+                }
-        this.cancelledNodes.clear();
+            });
        for (let task of this.tasks) {
            this.processFiber(task);
        }
        for (let task of this.tasks) {
            if (task.node.status === 3 /* DESTROYED */) {
                this.tasks.delete(task);
            }
        }
    }
    processFiber(fiber) {
@@ -5616,7 +5557,7 @@ class Scheduler {
            this.tasks.delete(fiber);
            return;
        }
-        if (fiber.node.status === 3 /* DESTROYED */) {
+        if (fiber.node.status === 2 /* DESTROYED */) {
            this.tasks.delete(fiber);
            return;
        }
@@ -5644,8 +5585,6 @@ window.__OWL_DEVTOOLS__ || (window.__OWL_DEVTOOLS__ = {
    apps: new Set(),
    Fiber: Fiber,
    RootFiber: RootFiber,
    toRaw: toRaw,
    reactive: reactive,
 });
 class App extends TemplateSet {
    constructor(Root, config = {}) {
@@ -5708,8 +5647,8 @@ class App extends TemplateSet {
    }
    destroy() {
        if (this.root) {
            this.scheduler.flush();
            this.root.destroy();
            this.scheduler.processTasks();
        }
        window.__OWL_DEVTOOLS__.apps.delete(this);
    }
@@ -5840,11 +5779,9 @@ function status(component) {
    switch (component.__owl__.status) {
        case 0 /* NEW */:
            return "new";
        case 2 /* CANCELLED */:
            return "cancelled";
        case 1 /* MOUNTED */:
            return "mounted";
-        case 3 /* DESTROYED */:
+        case 2 /* DESTROYED */:
            return "destroyed";
    }
 }
@@ -5900,9 +5837,8 @@ function useChildSubEnv(envExtension) {
 * will run a cleanup function before patching and before unmounting the
 * the component.
 *
- * @template T
+ * @param {Effect} effect the effect to run on component mount and/or patch
- * @param {Effect<T>} effect the effect to run on component mount and/or patch
+ * @param {()=>any[]} [computeDependencies=()=>[NaN]] a callback to compute
 * @param {()=>T} [computeDependencies=()=>[NaN]] a callback to compute
 *      dependencies that will decide if the effect needs to be cleaned up and
 *      run again. If the dependencies did not change, the effect will not run
 *      again. The default value returns an array containing only NaN because
@@ -5984,6 +5920,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-07-20T06:05:29.796Z';
+__info__.date = '2023-04-29T07:45:54.333Z';
-__info__.hash = 'b1a3b32';
+__info__.hash = 'aabb755';
 __info__.url = 'https://github.com/odoo/owl';
@@ -1,6 +1,6 @@
 {
  "name": "@odoo/owl",
-  "version": "2.2.3",
+  "version": "2.1.3",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {
@@ -1,6 +1,6 @@
 {
  "name": "@odoo/owl",
-  "version": "2.2.3",
+  "version": "2.1.3",
  "description": "Odoo Web Library (OWL)",
  "main": "dist/owl.cjs.js",
  "module": "dist/owl.es.js",
@@ -43,7 +43,6 @@ export interface Config {
 export interface CodeGenOptions extends Config {
  hasSafeContext?: boolean;
  name?: string;
  alias?: string;
 }
 // using a non-html document so that <inner/outer>HTML serializes as XML instead
@@ -198,7 +197,6 @@ class CodeTarget {
  hasRefWrapper: boolean = false;
  constructor(name: string, on?: EventHandlers | null) {
    debugger
    this.name = name;
    this.on = on || null;
  }
@@ -245,13 +243,6 @@ class CodeTarget {
  }
 }
 function toFnName(name: string = "", alias?: string) {
  if (alias) {
    name += `_${alias}`;
  }
  return name.replace(/[^A-Za-z_$0-9]+/g, "_") || "template";
 }
 const TRANSLATABLE_ATTRS = ["label", "title", "placeholder", "alt"];
 const translationRE = /^(\s*)([\s\S]+?)(\s*)$/;
@@ -261,7 +252,7 @@ export class CodeGenerator {
  hasSafeContext: boolean;
  isDebug: boolean = false;
  targets: CodeTarget[] = [];
-  target: CodeTarget;
+  target = new CodeTarget("template");
  templateName?: string;
  dev: boolean;
  translateFn: (s: string) => string;
@@ -272,7 +263,6 @@ export class CodeGenerator {
  helpers: Set<string> = new Set();
  constructor(ast: AST, options: CodeGenOptions) {
    this.target = new CodeTarget(toFnName(options.name, options.alias));
    this.translateFn = options.translateFn || ((s: string) => s);
    if (options.translatableAttributes) {
      const attrs = new Set(TRANSLATABLE_ATTRS);
@@ -457,11 +447,6 @@ export class CodeGenerator {
      .join("");
  }
  translate(str: string): string {
    const match = translationRE.exec(str) as any;
    return match[1] + this.translateFn(match[2]) + match[3];
  }
  /**
   * @returns the newly created block name, if any
   */
@@ -542,7 +527,8 @@ export class CodeGenerator {
    let value = ast.value;
    if (value && ctx.translate !== false) {
-      value = this.translate(value);
+      const match = translationRE.exec(value) as any;
      value = match[1] + this.translateFn(match[2]) + match[3];
    }
    if (!ctx.inPreTag) {
      value = value.replace(whitespaceRE, " ");
@@ -1109,11 +1095,10 @@ export class CodeGenerator {
    } else {
      let value: string;
      if (ast.defaultValue) {
        const defaultValue = ctx.translate ? this.translate(ast.defaultValue) : ast.defaultValue;
        if (ast.value) {
-          value = `withDefault(${expr}, \`${defaultValue}\`)`;
+          value = `withDefault(${expr}, \`${ast.defaultValue}\`)`;
        } else {
-          value = `\`${defaultValue}\``;
+          value = `\`${ast.defaultValue}\``;
        }
      } else {
        value = expr;
@@ -1386,7 +1371,9 @@ export class CodeGenerator {
    });
    const target = compileExpr(ast.target);
-    const blockString = `${id}({target: ${target},slots: {'default': {__render: ${name}.bind(this), __ctx: ${ctxStr}}}}, key + \`${key}\`, node, ctx, Portal)`;
+    const blockString = `${id}({target: ${target},${
      ast.isClosest ? "isClosest: true," : ""
    }slots: {'default': {__render: ${name}.bind(this), __ctx: ${ctxStr}}}}, key + \`${key}\`, node, ctx, Portal)`;
    if (block) {
      this.insertAnchor(block);
    }
@@ -2,7 +2,6 @@ import type { TemplateSet } from "../runtime/template_set";
 import type { BDom } from "../runtime/blockdom";
 import { CodeGenerator, Config } from "./code_generator";
 import { parse } from "./parser";
 import { OwlError } from "../runtime";
 export type Template = (context: any, vnode: any, key?: string) => BDom;
@@ -10,7 +9,6 @@ export type TemplateFunction = (app: TemplateSet, bdom: any, helpers: any) => Te
 interface CompileOptions extends Config {
  name?: string;
  alias?: string;
 }
 export function compile(
  template: string | Element,
@@ -29,15 +27,5 @@ export function compile(
  const codeGenerator = new CodeGenerator(ast, { ...options, hasSafeContext });
  const code = codeGenerator.generateCode();
  // template function
-  try {
+  return new Function("app, bdom, helpers", code) as TemplateFunction;
    return new Function("app, bdom, helpers", code) as TemplateFunction;
  } catch (originalError: any) {
    const { name } = options;
    const nameStr = name ? `template "${name}"` : "anonymous template";
    const err = new OwlError(
      `Failed to compile ${nameStr}: ${originalError.message}\n\ngenerated code:\nfunction(app, bdom, helpers) {\n${code}\n}`
    );
    err.cause = originalError;
    throw err;
  }
 }
@@ -169,6 +169,7 @@ export interface ASTTranslation {
 export interface ASTTPortal {
  type: ASTType.TPortal;
  target: string;
  isClosest: boolean;
  content: AST;
 }
@@ -235,10 +236,10 @@ function parseNode(node: Node, ctx: ParsingContext): AST | null {
    parseTCall(node, ctx) ||
    parseTCallBlock(node, ctx) ||
    parseTEscNode(node, ctx) ||
    parseTOutNode(node, ctx) ||
    parseTKey(node, ctx) ||
    parseTTranslation(node, ctx) ||
    parseTSlot(node, ctx) ||
    parseTOutNode(node, ctx) ||
    parseComponent(node, ctx) ||
    parseDOMNode(node, ctx) ||
    parseTSetNode(node, ctx) ||
@@ -336,10 +337,10 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
  for (let attr of nodeAttrsNames) {
    const value = node.getAttribute(attr)!;
-    if (attr === "t-on" || attr === "t-on-") {
+    if (attr.startsWith("t-on")) {
-      throw new OwlError("Missing event name with t-on directive");
+      if (attr === "t-on") {
-    }
+        throw new OwlError("Missing event name with t-on directive");
-    if (attr.startsWith("t-on-")) {
+      }
      on = on || {};
      on[attr.slice(5)] = value;
    } else if (attr.startsWith("t-model")) {
@@ -365,8 +366,10 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
      const typeAttr = node.getAttribute("type");
      const isInput = tagName === "input";
      const isSelect = tagName === "select";
      const isTextarea = tagName === "textarea";
      const isCheckboxInput = isInput && typeAttr === "checkbox";
      const isRadioInput = isInput && typeAttr === "radio";
      const isOtherInput = isInput && !isCheckboxInput && !isRadioInput;
      const hasLazyMod = attr.includes(".lazy");
      const hasNumberMod = attr.includes(".number");
      const hasTrimMod = attr.includes(".trim");
@@ -379,8 +382,8 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
        specialInitTargetAttr: isRadioInput ? "checked" : null,
        eventType,
        hasDynamicChildren: false,
-        shouldTrim: hasTrimMod,
+        shouldTrim: hasTrimMod && (isOtherInput || isTextarea),
-        shouldNumberize: hasNumberMod,
+        shouldNumberize: hasNumberMod && (isOtherInput || isTextarea),
      };
      if (isSelect) {
        // don't pollute the original ctx
@@ -444,6 +447,9 @@ function parseTEscNode(node: Element, ctx: ParsingContext): AST | null {
      content: [tesc],
    };
  }
  if (ast.type === ASTType.TComponent) {
    throw new OwlError("t-esc is not supported on Component nodes");
  }
  return tesc;
 }
@@ -828,11 +834,18 @@ function parseTTranslation(node: Element, ctx: ParsingContext): AST | null {
 // -----------------------------------------------------------------------------
 function parseTPortal(node: Element, ctx: ParsingContext): AST | null {
-  if (!node.hasAttribute("t-portal")) {
+  let target, isClosest;
  if (node.hasAttribute("t-portal")) {
    target = node.getAttribute("t-portal")!;
    node.removeAttribute("t-portal");
    isClosest = false;
  } else if (node.hasAttribute("t-portal.closest")) {
    target = node.getAttribute("t-portal.closest")!;
    node.removeAttribute("t-portal.closest");
    isClosest = true;
  } else {
    return null;
  }
  const target = node.getAttribute("t-portal")!;
  node.removeAttribute("t-portal");
  const content = parseNode(node, ctx);
  if (!content) {
    return {
@@ -843,6 +856,7 @@ function parseTPortal(node: Element, ctx: ParsingContext): AST | null {
  return {
    type: ASTType.TPortal,
    target,
    isClosest,
    content,
  };
 }
@@ -938,23 +952,21 @@ function normalizeTIf(el: Element) {
 *
 * @param el the element containing the tree that should be normalized
 */
-function normalizeTEscTOut(el: Element) {
+function normalizeTEsc(el: Element) {
-  for (const d of ["t-esc", "t-out"]) {
+  const elements = [...el.querySelectorAll("[t-esc]")].filter(
-    const elements = [...el.querySelectorAll(`[${d}]`)].filter(
+    (el) => el.tagName[0] === el.tagName[0].toUpperCase() || el.hasAttribute("t-component")
-      (el) => el.tagName[0] === el.tagName[0].toUpperCase() || el.hasAttribute("t-component")
+  );
-    );
+  for (const el of elements) {
-    for (const el of elements) {
+    if (el.childNodes.length) {
-      if (el.childNodes.length) {
+      throw new OwlError("Cannot have t-esc on a component that already has content");
        throw new OwlError(`Cannot have ${d} on a component that already has content`);
      }
      const value = el.getAttribute(d);
      el.removeAttribute(d);
      const t = el.ownerDocument.createElement("t");
      if (value != null) {
        t.setAttribute(d, value);
      }
      el.appendChild(t);
    }
    const value = el.getAttribute("t-esc");
    el.removeAttribute("t-esc");
    const t = el.ownerDocument.createElement("t");
    if (value != null) {
      t.setAttribute("t-esc", value);
    }
    el.appendChild(t);
  }
 }
@@ -966,7 +978,7 @@ function normalizeTEscTOut(el: Element) {
 */
 function normalizeXML(el: Element) {
  normalizeTIf(el);
-  normalizeTEscTOut(el);
+  normalizeTEsc(el);
 }
 /**
@@ -5,12 +5,10 @@ export * from "./runtime";
 TemplateSet.prototype._compileTemplate = function _compileTemplate(
  name: string,
-  template: string | Element,
+  template: string | Element
  alias?: string
 ) {
  return compile(template, {
    name,
    alias,
    dev: this.dev,
    translateFn: this.translateFn,
    translatableAttributes: this.translatableAttributes,
@@ -7,7 +7,6 @@ import { Scheduler } from "./scheduler";
 import { validateProps } from "./template_helpers";
 import { TemplateSet, TemplateSetConfig } from "./template_set";
 import { validateTarget } from "./utils";
 import { toRaw, reactive } from "./reactivity";
 // reimplement dev mode stuff see last change in 0f7a8289a6fb8387c3c1af41c6664b2a8448758f
@@ -40,8 +39,6 @@ declare global {
      apps: Set<App>;
      Fiber: typeof Fiber;
      RootFiber: typeof RootFiber;
      toRaw: typeof toRaw;
      reactive: typeof reactive;
    };
  }
 }
@@ -50,8 +47,6 @@ window.__OWL_DEVTOOLS__ ||= {
  apps: new Set<App>(),
  Fiber: Fiber,
  RootFiber: RootFiber,
  toRaw: toRaw,
  reactive: reactive,
 };
 export class App<
@@ -136,8 +131,8 @@ export class App<
  destroy() {
    if (this.root) {
      this.scheduler.flush();
      this.root.destroy();
      this.scheduler.processTasks();
    }
    window.__OWL_DEVTOOLS__.apps.delete(this);
  }
@@ -36,18 +36,10 @@ export function createAttrUpdater(attr: string): Setter<HTMLElement> {
 export function attrsSetter(this: HTMLElement, attrs: any) {
  if (isArray(attrs)) {
-    if (attrs[0] === "class") {
+    setAttribute.call(this, attrs[0], attrs[1]);
      setClass.call(this, attrs[1]);
    } else {
      setAttribute.call(this, attrs[0], attrs[1]);
    }
  } else {
    for (let k in attrs) {
-      if (k === "class") {
+      setAttribute.call(this, k, attrs[k]);
        setClass.call(this, attrs[k]);
      } else {
        setAttribute.call(this, k, attrs[k]);
      }
    }
  }
 }
@@ -60,11 +52,7 @@ export function attrsUpdater(this: HTMLElement, attrs: any, oldAttrs: any) {
      if (val === oldAttrs[1]) {
        return;
      }
-      if (name === "class") {
+      setAttribute.call(this, name, val);
        updateClass.call(this, val, oldAttrs[1]);
      } else {
        setAttribute.call(this, name, val);
      }
    } else {
      removeAttribute.call(this, oldAttrs[0]);
      setAttribute.call(this, name, val);
@@ -72,21 +60,13 @@ export function attrsUpdater(this: HTMLElement, attrs: any, oldAttrs: any) {
  } else {
    for (let k in oldAttrs) {
      if (!(k in attrs)) {
-        if (k === "class") {
+        removeAttribute.call(this, k);
          updateClass.call(this, "", oldAttrs[k]);
        } else {
          removeAttribute.call(this, k);
        }
      }
    }
    for (let k in attrs) {
      const val = attrs[k];
      if (val !== oldAttrs[k]) {
-        if (k === "class") {
+        setAttribute.call(this, k, val);
          updateClass.call(this, val, oldAttrs[k]);
        } else {
          setAttribute.call(this, k, val);
        }
      }
    }
  }
@@ -116,7 +116,7 @@ export class ComponentNode<P extends Props = any, E = any> implements VNode<Comp
    }
    this.component = new C(props, env, this);
    const ctx = Object.assign(Object.create(this.component), { this: this.component });
-    this.renderFn = app.getTemplate(C.template, C.name).bind(this.component, ctx, this);
+    this.renderFn = app.getTemplate(C.template).bind(this.component, ctx, this);
    this.component.setup();
    currentNode = null;
  }
@@ -145,9 +145,6 @@ export class ComponentNode<P extends Props = any, E = any> implements VNode<Comp
  }
  async render(deep: boolean) {
    if (this.status >= STATUS.CANCELLED) {
      return;
    }
    let current = this.fiber;
    if (current && (current.root!.locked || (current as any).bdom === true)) {
      await Promise.resolve();
@@ -174,7 +171,7 @@ export class ComponentNode<P extends Props = any, E = any> implements VNode<Comp
    this.app.scheduler.addFiber(fiber);
    await Promise.resolve();
-    if (this.status >= STATUS.CANCELLED) {
+    if (this.status === STATUS.DESTROYED) {
      return;
    }
    // We only want to actually render the component if the following two
@@ -193,20 +190,6 @@ export class ComponentNode<P extends Props = any, E = any> implements VNode<Comp
    }
  }
  cancel() {
    this._cancel();
    delete this.parent!.children[this.parentKey!];
    this.app.scheduler.scheduleDestroy(this);
  }
  _cancel() {
    this.status = STATUS.CANCELLED;
    const children = this.children;
    for (let childKey in children) {
      children[childKey]._cancel();
    }
  }
  destroy() {
    let shouldRemove = this.status === STATUS.MOUNTED;
    this._destroy();
@@ -51,19 +51,17 @@ export function handleError(params: ErrorParams) {
    );
  }
  const node = "node" in params ? params.node : params.fiber.node;
-  const fiber = "fiber" in params ? params.fiber : node.fiber;
+  const fiber = "fiber" in params ? params.fiber : node.fiber!;
-  if (fiber) {
+  // resets the fibers on components if possible. This is important so that
-    // resets the fibers on components if possible. This is important so that
+  // new renderings can be properly included in the initial one, if any.
-    // new renderings can be properly included in the initial one, if any.
+  let current: Fiber | null = fiber;
-    let current: Fiber | null = fiber;
+  do {
-    do {
+    current.node.fiber = current;
-      current.node.fiber = current;
+    current = current.parent;
-      current = current.parent;
+  } while (current);
    } while (current);
-    fibersInError.set(fiber.root!, error);
+  fibersInError.set(fiber.root!, error);
  }
  const handled = _handleError(node, error);
  if (!handled) {
@@ -55,7 +55,8 @@ function cancelFibers(fibers: Fiber[]): number {
    let node = fiber.node;
    fiber.render = throwOnRender;
    if (node.status === STATUS.NEW) {
-      node.cancel();
+      node.destroy();
      delete node.parent!.children[node.parentKey!];
    }
    node.fiber = null;
    if (fiber.bdom) {
@@ -59,35 +59,28 @@ export function useChildSubEnv(envExtension: Env) {
 // useEffect
 // -----------------------------------------------------------------------------
 type EffectDeps<T extends any[]> = T | (T extends [...infer H, never] ? EffectDeps<H> : never);
 /**
- * @template T
+ * @param {...any} dependencies the dependencies computed by computeDependencies
 * @param {...T} dependencies the dependencies computed by computeDependencies
 * @returns {void|(()=>void)} a cleanup function that reverses the side
 *      effects of the effect callback.
 */
-type Effect<T extends [...T]> = (...dependencies: EffectDeps<T>) => void | (() => void);
+type Effect = (...dependencies: any[]) => void | (() => void);
 /**
 * This hook will run a callback when a component is mounted and patched, and
 * will run a cleanup function before patching and before unmounting the
 * the component.
 *
- * @template T
+ * @param {Effect} effect the effect to run on component mount and/or patch
- * @param {Effect<T>} effect the effect to run on component mount and/or patch
+ * @param {()=>any[]} [computeDependencies=()=>[NaN]] a callback to compute
 * @param {()=>T} [computeDependencies=()=>[NaN]] a callback to compute
 *      dependencies that will decide if the effect needs to be cleaned up and
 *      run again. If the dependencies did not change, the effect will not run
 *      again. The default value returns an array containing only NaN because
 *      NaN !== NaN, which will cause the effect to rerun on every patch.
 */
-export function useEffect<T extends [...T]>(
+export function useEffect(effect: Effect, computeDependencies: () => any[] = () => [NaN]) {
  effect: Effect<T>,
  computeDependencies: () => T = () => [NaN] as never
 ) {
  let cleanup: (() => void) | void;
-  let dependencies: T;
+  let dependencies: any[];
  onMounted(() => {
    dependencies = computeDependencies();
    cleanup = effect(...dependencies);
@@ -5,20 +5,34 @@ import { OwlError } from "./error_handling";
 const VText: any = text("").constructor;
 function getTarget(
  currentParentEl: HTMLElement | Document,
  selector: string,
  isClosest: boolean
 ): HTMLElement | null {
  if (!isClosest || currentParentEl === document) {
    return document.querySelector(selector);
  }
  const attempt = currentParentEl.querySelector(selector) as HTMLElement | null;
  return attempt || getTarget(currentParentEl.parentElement!, selector, true);
 }
 class VPortal extends VText implements Partial<VNode<VPortal>> {
  content: BDom | null;
  selector: string;
  isClosest: boolean;
  target: HTMLElement | null = null;
-  constructor(selector: string, content: BDom) {
+  constructor(selector: string, isClosest: boolean, content: BDom) {
    super("");
    this.selector = selector;
    this.isClosest = isClosest;
    this.content = content;
  }
  mount(parent: HTMLElement, anchor: ChildNode) {
    super.mount(parent, anchor);
-    this.target = document.querySelector(this.selector) as any;
+    this.target = getTarget(parent, this.selector, this.isClosest);
    if (this.target) {
      this.content!.mount(this.target!, null);
    } else {
@@ -54,16 +68,19 @@ class VPortal extends VText implements Partial<VNode<VPortal>> {
 export function portalTemplate(app: any, bdom: any, helpers: any) {
  let { callSlot } = helpers;
  return function template(ctx: any, node: any, key = ""): any {
-    return new VPortal(ctx.props.target, callSlot(ctx, node, key, "default", false, null));
+    return new VPortal(
      ctx.props.target,
      ctx.props.isClosest,
      callSlot(ctx, node, key, "default", false, null)
    );
  };
 }
 export class Portal extends Component {
  static template = "__portal__";
  static props = {
-    target: {
+    target: String,
-      type: String,
+    isClosest: { type: Boolean, optional: true },
    },
    slots: true,
  };
@@ -73,7 +90,7 @@ export class Portal extends Component {
    onMounted(() => {
      const portal: VPortal = node.bdom;
      if (!portal.target) {
-        const target: HTMLElement = document.querySelector(this.props.target);
+        const target = getTarget(portal.parentEl, this.props.target, this.props.isClosest);
        if (target) {
          portal.content!.moveBeforeDOMNode(target.firstChild, target);
        } else {
@@ -1,4 +1,3 @@
 import type { ComponentNode } from "./component_node";
 import { fibersInError } from "./error_handling";
 import { Fiber, RootFiber } from "./fibers";
 import { STATUS } from "./status";
@@ -15,7 +14,6 @@ export class Scheduler {
  requestAnimationFrame: Window["requestAnimationFrame"];
  frame: number = 0;
  delayedRenders: Fiber[] = [];
  cancelledNodes: Set<ComponentNode> = new Set();
  constructor() {
    this.requestAnimationFrame = Scheduler.requestAnimationFrame;
@@ -25,13 +23,6 @@ export class Scheduler {
    this.tasks.add(fiber.root!);
  }
  scheduleDestroy(node: ComponentNode) {
    this.cancelledNodes.add(node);
    if (this.frame === 0) {
      this.frame = this.requestAnimationFrame(() => this.processTasks());
    }
  }
  /**
   * Process all current tasks. This only applies to the fibers that are ready.
   * Other tasks are left unchanged.
@@ -48,23 +39,15 @@ export class Scheduler {
    }
    if (this.frame === 0) {
-      this.frame = this.requestAnimationFrame(() => this.processTasks());
+      this.frame = this.requestAnimationFrame(() => {
-    }
+        this.frame = 0;
-  }
+        this.tasks.forEach((fiber) => this.processFiber(fiber));
-
+        for (let task of this.tasks) {
-  processTasks() {
+          if (task.node.status === STATUS.DESTROYED) {
-    this.frame = 0;
+            this.tasks.delete(task);
-    for (let node of this.cancelledNodes) {
+          }
-      node._destroy();
+        }
-    }
+      });
    this.cancelledNodes.clear();
    for (let task of this.tasks) {
      this.processFiber(task);
    }
    for (let task of this.tasks) {
      if (task.node.status === STATUS.DESTROYED) {
        this.tasks.delete(task);
      }
    }
  }
@@ -7,20 +7,15 @@ import type { Component } from "./component";
 export const enum STATUS {
  NEW,
  MOUNTED, // is ready, and in DOM. It has a valid el
  // component has been created, but has been replaced by a newer component before being mounted
  // it is cancelled until the next animation frame where it will be destroyed
  CANCELLED,
  DESTROYED,
 }
-type STATUS_DESCR = "new" | "mounted" | "cancelled" | "destroyed";
+type STATUS_DESCR = "new" | "mounted" | "destroyed";
 export function status(component: Component): STATUS_DESCR {
  switch (component.__owl__.status) {
    case STATUS.NEW:
      return "new";
    case STATUS.CANCELLED:
      return "cancelled";
    case STATUS.MOUNTED:
      return "mounted";
    case STATUS.DESTROYED:
@@ -60,26 +60,18 @@ function withKey(elem: any, k: string) {
  return elem;
 }
-function prepareList(collection: unknown): [unknown[], unknown[], number, undefined[]] {
+function prepareList(collection: any): [any[], any[], number, any[]] {
-  let keys: unknown[];
+  let keys: any[];
-  let values: unknown[];
+  let values: any[];
  if (Array.isArray(collection)) {
    keys = collection;
    values = collection;
-  } else if (collection instanceof Map) {
+  } else if (collection) {
-    keys = [...collection.keys()];
+    values = Object.keys(collection);
-    values = [...collection.values()];
+    keys = Object.values(collection);
  } else if (collection && typeof collection === "object") {
    if (Symbol.iterator in collection) {
      keys = [...(<Iterable<unknown>>collection)];
      values = keys;
    } else {
      values = Object.keys(collection);
      keys = Object.values(collection);
    }
  } else {
-    throw new OwlError(`Invalid loop expression: "${collection}" is not iterable`);
+    throw new OwlError("Invalid loop expression");
  }
  const n = values.length;
  return [keys, values, n, new Array(n)];
@@ -94,7 +94,7 @@ export class TemplateSet {
    }
  }
-  getTemplate(name: string, alias?: string): Template {
+  getTemplate(name: string): Template {
    if (!(name in this.templates)) {
      const rawTemplate = this.rawTemplates[name];
      if (rawTemplate === undefined) {
@@ -106,7 +106,7 @@ export class TemplateSet {
        throw new OwlError(`Missing template: "${name}"${extraInfo}`);
      }
      const isFn = typeof rawTemplate === "function" && !(rawTemplate instanceof Element);
-      const templateFn = isFn ? rawTemplate : this._compileTemplate(name, rawTemplate, alias);
+      const templateFn = isFn ? rawTemplate : this._compileTemplate(name, rawTemplate);
      // first add a function to lazily get the template, in case there is a
      // recursive call to the template name
      const templates = this.templates;
@@ -119,7 +119,7 @@ export class TemplateSet {
    return this.templates[name];
  }
-  _compileTemplate(name: string, template: string | Element, alias?: string): ReturnType<typeof compile> {
+  _compileTemplate(name: string, template: string | Element): ReturnType<typeof compile> {
    throw new OwlError(`Unable to compile a template. Please use owl full build instead`);
  }
@@ -135,7 +135,7 @@ export class TemplateSet {
 export const globalTemplates: { [key: string]: string | Element | TemplateFunction } = {};
 export function xml(...args: Parameters<typeof String.raw>) {
-  const name = `xml_template_${xml.nextId++}`;
+  const name = `__template__${xml.nextId++}`;
  const value = String.raw(...args);
  globalTemplates[name] = value;
  return name;
@@ -9,13 +9,20 @@ export type Callback = () => void;
 * @returns a batched version of the original callback
 */
 export function batched(callback: Callback): Callback {
-  let scheduled = false;
+  let called = false;
-  return async (...args) => {
+  return async () => {
-    if (!scheduled) {
+    // This await blocks all calls to the callback here, then releases them sequentially
-      scheduled = true;
+    // in the next microtick. This line decides the granularity of the batch.
-      await Promise.resolve();
+    await Promise.resolve();
-      scheduled = false;
+    if (!called) {
-      callback(...args);
+      called = true;
      // wait for all calls in this microtick to fall through before resetting "called"
      // so that only the first call to the batched function calls the original callback.
      // Schedule this before calling the callback so that calls to the batched function
      // within the callback will proceed only after resetting called to false, and have
      // a chance to execute the callback again
      Promise.resolve().then(() => (called = false));
      callback();
    }
  };
 }
@@ -1,2 +1,2 @@
 // do not modify manually. This file is generated by the release script.
-export const version = "2.2.3";
+export const version = "2.1.3";
@@ -50,12 +50,11 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -69,11 +68,10 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].a;
    return block1([txt1]);
  }
@@ -84,12 +82,11 @@ exports[`Reactivity: useState destroyed component is inactive 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -103,11 +100,10 @@ exports[`Reactivity: useState destroyed component is inactive 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].a;
    return block1([txt1]);
  }
@@ -118,11 +114,10 @@ exports[`Reactivity: useState one components can subscribe twice to same context
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj1'].a;
    let txt2 = ctx['contextObj2'].b;
    return block1([txt1, txt2]);
@@ -134,12 +129,11 @@ exports[`Reactivity: useState parent and children subscribed to same context 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    let txt1 = ctx['contextObj'].b;
    return block1([txt1], [b2]);
@@ -151,11 +145,10 @@ exports[`Reactivity: useState parent and children subscribed to same context 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].a;
    return block1([txt1]);
  }
@@ -229,13 +222,12 @@ exports[`Reactivity: useState two components are updated in parallel 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = comp2({}, key + \`__2\`, node, this, null);
    return block1([], [b2, b3]);
@@ -247,11 +239,10 @@ exports[`Reactivity: useState two components are updated in parallel 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].value;
    return block1([txt1]);
  }
@@ -262,13 +253,12 @@ exports[`Reactivity: useState two components can subscribe to same context 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = comp2({}, key + \`__2\`, node, this, null);
    return block1([], [b2, b3]);
@@ -280,11 +270,10 @@ exports[`Reactivity: useState two components can subscribe to same context 2`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].value;
    return block1([txt1]);
  }
@@ -295,13 +284,12 @@ exports[`Reactivity: useState two independent components on different levels are
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`Parent\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
-  return function xml_template_1001_GrandFather(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = comp2({}, key + \`__2\`, node, this, null);
    return block1([], [b2, b3]);
@@ -313,11 +301,10 @@ exports[`Reactivity: useState two independent components on different levels are
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].value;
    return block1([txt1]);
  }
@@ -328,12 +315,11 @@ exports[`Reactivity: useState two independent components on different levels are
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -344,11 +330,10 @@ exports[`Reactivity: useState useContext=useState hook is reactive, for one comp
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].value;
    return block1([txt1]);
  }
@@ -360,12 +345,11 @@ exports[`Reactivity: useState useless atoms should be deleted 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Quantity\`, true, false, false, [\\"id\\"]);
  let block1 = createBlock(\`<div><block-child-0/> Total: <block-text-0/> Count: <block-text-1/></div>\`);
-  return function xml_template_1000_ListOfQuantities(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(Object.keys(ctx['state']));;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -386,11 +370,10 @@ exports[`Reactivity: useState useless atoms should be deleted 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Quantity(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].quantity;
    return block1([txt1]);
  }
@@ -401,11 +384,10 @@ exports[`Reactivity: useState very simple use, with initial value 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['contextObj'].value;
    return block1([txt1]);
  }
@@ -4,11 +4,10 @@ exports[`app App supports env with getters/setters 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/> <block-text-1/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].someVal;
    let txt2 = Object.keys(ctx['env'].services);
    return block1([txt1, txt2]);
@@ -16,45 +15,14 @@ exports[`app App supports env with getters/setters 1`] = `
 }"
 `;
 exports[`app app: clear scheduler tasks and destroy cancelled nodes immediately on destroy 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`B\`, true, false, false, []);
  return function xml_template_1000_A(ctx, node, key = \\"\\") {
    let b2,b3;
    b2 = text(\`A\`);
    if (ctx['state'].value) {
      b3 = comp1({}, key + \`__1\`, node, this, null);
    }
    return multi([b2, b3]);
  }
 }"
 `;
 exports[`app app: clear scheduler tasks and destroy cancelled nodes immediately on destroy 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  return function xml_template_999_B(ctx, node, key = \\"\\") {
    return text(\`B\`);
  }
 }"
 `;
 exports[`app can configure an app with props 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -65,11 +33,10 @@ exports[`app can mount app in an iframe 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div class=\\"my-div\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -79,11 +46,10 @@ exports[`app destroy remove the widget from the DOM 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -93,11 +59,10 @@ exports[`app warnIfNoStaticProps works as expected 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['message'];
    return block1([txt1]);
  }
@@ -1,14 +1,6 @@
-import { App, Component, mount, onWillStart, useState, xml } from "../../src";
+import { App, Component, mount, xml } from "../../src";
 import { status } from "../../src/runtime/status";
-import {
+import { makeTestFixture, snapshotEverything, nextTick, elem } from "../helpers";
  makeTestFixture,
  snapshotEverything,
  nextTick,
  elem,
  useLogLifecycle,
  makeDeferred,
  nextMicroTick,
 } from "../helpers";
 let fixture: HTMLElement;
@@ -102,44 +94,4 @@ describe("app", () => {
    expect(iframeDoc.contains(div)).toBe(false);
    expect(status(comp)).toBe("destroyed");
  });
  test("app: clear scheduler tasks and destroy cancelled nodes immediately on destroy", async () => {
    let def = makeDeferred();
    class B extends Component {
      static template = xml`B`;
      setup() {
        useLogLifecycle();
        onWillStart(() => def);
      }
    }
    class A extends Component {
      static template = xml`A<t t-if="state.value"><B/></t>`;
      static components = { B };
      state = useState({ value: false });
      setup() {
        useLogLifecycle();
      }
    }
    const app = new App(A);
    const comp = await app.mount(fixture);
    expect(["A:setup", "A:willStart", "A:willRender", "A:rendered", "A:mounted"]).toBeLogged();
    comp.state.value = true;
    await nextTick();
    expect(["A:willRender", "B:setup", "B:willStart", "A:rendered"]).toBeLogged();
    // rerender to force the instantiation of a new B component (and cancelling the first)
    comp.render();
    await nextMicroTick();
    expect(["A:willRender", "B:setup", "B:willStart", "A:rendered"]).toBeLogged();
    app.destroy();
    expect([
      "A:willUnmount",
      "B:willDestroy",
      "A:willDestroy",
      "B:willDestroy", // make sure the 2 B instances have been destroyed synchronously
    ]).toBeLogged();
  });
 });
@@ -145,34 +145,3 @@ test("class attribute (with a preexisting value", async () => {
  patch(tree, block([""]));
  expect(fixture.innerHTML).toBe(`<div class="tomato"></div>`);
 });
 test("block-class attributes with preexisting class attribute", async () => {
  const block = createBlock('<div block-attributes="0" class="owl"></div>');
  const tree = block([{ class: "eagle" }]);
  mount(tree, fixture);
  expect(fixture.innerHTML).toBe(`<div class="owl eagle"></div>`);
  patch(tree, block([{ class: "falcon" }]));
  expect(fixture.innerHTML).toBe(`<div class="owl falcon"></div>`);
  patch(tree, block([{}]));
  expect(fixture.innerHTML).toBe(`<div class="owl"></div>`);
 });
 test("block-class attributes (array syntax) with preexisting class attribute", async () => {
  const block = createBlock('<div block-attributes="0" class="owl"></div>');
  const tree = block([["class", "eagle"]]);
  mount(tree, fixture);
  expect(fixture.innerHTML).toBe(`<div class="owl eagle"></div>`);
  patch(tree, block([["class", "falcon"]]));
  expect(fixture.innerHTML).toBe(`<div class="owl falcon"></div>`);
  patch(tree, block([["class", ""]]));
  expect(fixture.innerHTML).toBe(`<div class="owl"></div>`);
  patch(tree, block([["class", "buzzard"]]));
  expect(fixture.innerHTML).toBe(`<div class="owl buzzard"></div>`);
 });
@@ -707,123 +707,6 @@ exports[`attributes updating classes (with obj notation) 1`] = `
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div block-attributes=\\"0\\" class=\\"c\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {class:'a'};
    return block1([attr1]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div block-attributes=\\"0\\" block-attribute-1=\\"class\\" class=\\"c\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {class:'a'};
    let attr2 = {'b':true};
    return block1([attr1, attr2]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div block-attributes=\\"0\\" class=\\"c\\" block-attribute-1=\\"class\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {class:'a'};
    let attr2 = {'b':true};
    return block1([attr1, attr2]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 4`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div class=\\"c\\" block-attributes=\\"0\\" block-attribute-1=\\"class\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {class:'a'};
    let attr2 = {'b':true};
    return block1([attr1, attr2]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 5`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div class=\\"c\\" block-attribute-0=\\"class\\" block-attributes=\\"1\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {'b':true};
    let attr2 = {class:'a'};
    return block1([attr1, attr2]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 6`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div class=\\"c\\" block-attribute-0=\\"class\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {'b':true};
    return block1([attr1]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 7`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div class=\\"c\\" block-attribute-0=\\"class\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = ('b');
    return block1([attr1]);
  }
 }"
 `;
 exports[`attributes various combinations of class, t-att-class, and t-att 8`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div block-attributes=\\"0\\" block-attribute-1=\\"class\\">content</div>\`);
  return function template(ctx, node, key = \\"\\") {
    let attr1 = {class:'a'};
    let attr2 = {'b':true};
    return block1([attr1, attr2]);
  }
 }"
 `;
 exports[`attributes various escapes 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
@@ -156,10 +156,9 @@ exports[`t-on handler is bound to proper owner, part 3 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
  }
 }"
@@ -169,11 +168,10 @@ exports[`t-on handler is bound to proper owner, part 3 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\">Click</button>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['add'], ctx];
    return block1([hdlr1]);
  }
@@ -185,10 +183,9 @@ exports[`t-on handler is bound to proper owner, part 4 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList([1]);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -209,11 +206,10 @@ exports[`t-on handler is bound to proper owner, part 4 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\">Click</button>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['add'], ctx];
    return block1([hdlr1]);
  }
@@ -475,12 +471,11 @@ exports[`t-on t-on with t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -491,11 +486,10 @@ exports[`t-on t-on with t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<p block-handler-0=\\"click\\">lucas</p>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['update'], ctx];
    return block1([hdlr1]);
  }
@@ -506,12 +500,11 @@ exports[`t-on t-on, with arguments and t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -522,11 +515,10 @@ exports[`t-on t-on, with arguments and t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<p block-handler-0=\\"click\\">lucas</p>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const v1 = ctx['this'];
    const v2 = ctx['value'];
    let hdlr1 = [()=>v1.update(v2), ctx];
@@ -84,7 +84,6 @@ exports[`misc global 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, zero, withKey } = helpers;
  // Template name: \\"caller\\"
  const callTemplate_1 = app.getTemplate(\`_callee-uses-foo\`);
  const callTemplate_2 = app.getTemplate(\`_callee-uses-foo\`);
  const callTemplate_3 = app.getTemplate(\`_callee-uses-foo\`);
@@ -94,7 +93,7 @@ exports[`misc global 1`] = `
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
  let block4 = createBlock(\`<span><block-text-0/></span>\`);
-  return function caller(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -137,11 +136,10 @@ exports[`misc global 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { withDefault } = helpers;
  // Template name: \\"_callee-uses-foo\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function _callee_uses_foo(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = withDefault(ctx['foo'], \`foo default\`);
    return block1([txt1]);
  }
@@ -153,11 +151,10 @@ exports[`misc global 3`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"_callee-asc\\"
  let block1 = createBlock(\`<año block-attribute-0=\\"falló\\"><block-child-0/></año>\`);
-  return function _callee_asc(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = 'agüero';
    const b2 = ctx[zero];
    return block1([attr1], [b2]);
@@ -170,11 +167,10 @@ exports[`misc global 4`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { safeOutput } = helpers;
  // Template name: \\"_callee-asc-toto\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function _callee_asc_toto(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = text(\`toto default\`);
    const b2 = safeOutput(ctx['toto'], b3);
    return block1([], [b2]);
@@ -158,9 +158,8 @@ exports[`simple templates, mostly static empty string in a template set 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"potato\\"
-  return function potato(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`\`);
  }
 }"
@@ -56,13 +56,12 @@ exports[`properly support svg svg creates new block if it is within html -- 2 1`
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  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\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b3;
    if (ctx['hasPath']) {
      b3 = block3();
@@ -77,12 +76,11 @@ exports[`properly support svg svg creates new block if it is within html 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  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>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    return block1([], [b2]);
  }
@@ -93,12 +91,11 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"svg\\"
  const callTemplate_1 = app.getTemplate(\`path\`);
  let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
-  return function svg_Svg(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -109,11 +106,10 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"path\\"
  let block1 = createBlock(\`<path block-ns=\\"http://www.w3.org/2000/svg\\"/>\`);
-  return function path(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -4,12 +4,11 @@ exports[`t-call (template calling) basic caller 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"caller\\"
  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function caller(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -20,11 +19,10 @@ exports[`t-call (template calling) basic caller 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"_basic-callee\\"
  let block1 = createBlock(\`<span>ok</span>\`);
-  return function _basic_callee(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -34,10 +32,9 @@ exports[`t-call (template calling) basic caller, no parent node 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"caller\\"
  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
-  return function caller(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
  }
 }"
@@ -47,11 +44,10 @@ exports[`t-call (template calling) basic caller, no parent node 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"_basic-callee\\"
  let block1 = createBlock(\`<span>ok</span>\`);
-  return function _basic_callee(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -62,14 +58,13 @@ exports[`t-call (template calling) call with several sub nodes on same line 1`]
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  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>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b3 = block3();
@@ -88,11 +83,10 @@ exports[`t-call (template calling) call with several sub nodes on same line 2`]
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx[zero];
    return block1([], [b2]);
  }
@@ -104,14 +98,13 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  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>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b3 = block3();
@@ -130,13 +123,12 @@ exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"subTemplate\\"
  const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<span>cascade 0</span>\`);
-  return function subTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b3 = block3();
@@ -154,13 +146,12 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"subSubTemplate\\"
  const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<span>cascade 1</span>\`);
-  return function subSubTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b3 = block3();
@@ -178,11 +169,10 @@ exports[`t-call (template calling) cascading t-call t-out='0' 4`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"finalTemplate\\"
  let block1 = createBlock(\`<div><span>cascade 2</span><block-child-0/></div>\`);
-  return function finalTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx[zero];
    return block1([], [b2]);
  }
@@ -194,13 +184,12 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
  let block2 = createBlock(\`<span>hey</span>\`);
  let block4 = createBlock(\`<span>yay</span>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -218,12 +207,11 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"subTemplate\\"
  const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
  let block2 = createBlock(\`<span>cascade 0</span>\`);
-  return function subTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -240,12 +228,11 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"subSubTemplate\\"
  const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
  let block2 = createBlock(\`<span>cascade 1</span>\`);
-  return function subSubTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -262,11 +249,10 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"finalTemplate\\"
  let block2 = createBlock(\`<span>cascade 2</span>\`);
-  return function finalTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b3 = ctx[zero];
    return multi([b2, b3]);
@@ -278,12 +264,11 @@ exports[`t-call (template calling) dynamic t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const call = app.callTemplate.bind(app);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const template1 = (ctx['template']);
    const b2 = call(this, template1, ctx, node, key + \`__1\`);
    return block1([], [b2]);
@@ -295,11 +280,10 @@ exports[`t-call (template calling) dynamic t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"foo\\"
  let block1 = createBlock(\`<foo><block-text-0/></foo>\`);
-  return function foo(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['val'];
    return block1([txt1]);
  }
@@ -310,11 +294,10 @@ exports[`t-call (template calling) dynamic t-call 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"bar\\"
  let block1 = createBlock(\`<bar><block-text-0/></bar>\`);
-  return function bar(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['val'];
    return block1([txt1]);
  }
@@ -326,12 +309,11 @@ exports[`t-call (template calling) inherit context 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"foo\\", 1);
@@ -345,9 +327,8 @@ exports[`t-call (template calling) inherit context 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['foo']);
  }
 }"
@@ -358,13 +339,12 @@ exports[`t-call (template calling) nested t-calls with magic variable 0 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`grandchild\`);
  const callTemplate_2 = app.getTemplate(\`child\`);
  let block1 = createBlock(\`<p>Some content...</p>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    ctx = Object.create(ctx);
@@ -384,9 +364,8 @@ exports[`t-call (template calling) nested t-calls with magic variable 0 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"grandchild\\"
-  return function grandchild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`grandchild\`);
    const b3 = ctx[zero];
    return multi([b2, b3]);
@@ -399,9 +378,8 @@ exports[`t-call (template calling) nested t-calls with magic variable 0 3`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"child\\"
-  return function child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return ctx[zero];
  }
 }"
@@ -411,12 +389,11 @@ exports[`t-call (template calling) recursive template, part 1 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"recursive\\"
  const callTemplate_1 = app.getTemplate(\`recursive\`);
  let block1 = createBlock(\`<div><span>hey</span><block-child-0/></div>\`);
-  return function recursive(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (false) {
      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -431,12 +408,11 @@ exports[`t-call (template calling) recursive template, part 2 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"Parent\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -453,12 +429,11 @@ exports[`t-call (template calling) recursive template, part 2 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
  // Template name: \\"nodeTemplate\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
-  return function nodeTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['node'].val;
@@ -488,12 +463,11 @@ exports[`t-call (template calling) recursive template, part 3 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"Parent\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -510,12 +484,11 @@ exports[`t-call (template calling) recursive template, part 3 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
  // Template name: \\"nodeTemplate\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
-  return function nodeTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['node'].val;
@@ -545,12 +518,11 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"Parent\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -568,12 +540,11 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
  // Template name: \\"nodeTemplate\\"
  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
  let block1 = createBlock(\`<div><p><block-text-0/> <block-text-1/></p><block-child-0/></div>\`);
-  return function nodeTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"recursive_idx\\", ctx['recursive_idx']+1);
@@ -605,12 +576,11 @@ exports[`t-call (template calling) scoped parameters 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -628,9 +598,8 @@ exports[`t-call (template calling) scoped parameters 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`ok\`);
  }
 }"
@@ -641,12 +610,11 @@ exports[`t-call (template calling) scoped parameters, part 2 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"foo\\", 11);
@@ -665,9 +633,8 @@ exports[`t-call (template calling) scoped parameters, part 2 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['foo']);
  }
 }"
@@ -677,12 +644,11 @@ exports[`t-call (template calling) t-call allowed on a non t node 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -693,11 +659,10 @@ exports[`t-call (template calling) t-call allowed on a non t node 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span>ok</span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -707,12 +672,11 @@ exports[`t-call (template calling) t-call on a div with t-call-context 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = ctx['obj'];
    const b2 = callTemplate_1.call(this, ctx1, node, key + \`__1\`);
    return block1([], [b2]);
@@ -724,11 +688,10 @@ exports[`t-call (template calling) t-call on a div with t-call-context 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['value'];
    return block1([txt1]);
  }
@@ -740,12 +703,11 @@ exports[`t-call (template calling) t-call with body content as root of a templat
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`antony\`);
  let block1 = createBlock(\`<p>antony</p>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b1 = block1();
@@ -760,11 +722,10 @@ exports[`t-call (template calling) t-call with body content as root of a templat
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"antony\\"
  let block1 = createBlock(\`<foo><block-child-0/></foo>\`);
-  return function antony(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx[zero];
    return block1([], [b2]);
  }
@@ -775,12 +736,11 @@ exports[`t-call (template calling) t-call with t-if 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['flag']) {
      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -794,11 +754,10 @@ exports[`t-call (template calling) t-call with t-if 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span>ok</span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -809,12 +768,11 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -830,11 +788,10 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<p><block-text-0/></p>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['val'];
    return block1([txt1]);
  }
@@ -846,12 +803,11 @@ exports[`t-call (template calling) t-call with t-set inside and outside 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -880,11 +836,10 @@ exports[`t-call (template calling) t-call with t-set inside and outside 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['val3'];
    return block1([txt1]);
  }
@@ -896,12 +851,11 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] =
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"wrapper\\"
  const callTemplate_1 = app.getTemplate(\`main\`);
  let block1 = createBlock(\`<p><block-child-0/></p>\`);
-  return function wrapper(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"w\\", 'fromwrapper');
@@ -916,12 +870,11 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] =
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -950,11 +903,10 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 3`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block2 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['val3'];
    const b2 = block2([txt1]);
    const b3 = text(ctx['w']);
@@ -968,13 +920,12 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"caller\\"
  const callTemplate_1 = app.getTemplate(\`callee1\`);
  const callTemplate_2 = app.getTemplate(\`callee2\`);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
-  return function caller(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let b2,b3;
@@ -997,11 +948,10 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"callee1\\"
  let block1 = createBlock(\`<div>callee1</div>\`);
-  return function callee1(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -1011,11 +961,10 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"callee2\\"
  let block1 = createBlock(\`<div>callee2 <block-text-0/></div>\`);
-  return function callee2(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['v'];
    return block1([txt1]);
  }
@@ -1026,10 +975,9 @@ exports[`t-call (template calling) t-call-context 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = ctx['obj'];
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -1040,11 +988,10 @@ exports[`t-call (template calling) t-call-context 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['value'];
    return block1([txt1]);
  }
@@ -1056,10 +1003,9 @@ exports[`t-call (template calling) t-call-context and value in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let ctx1 = ctx['obj'];
@@ -1075,11 +1021,10 @@ exports[`t-call (template calling) t-call-context and value in body 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['value1'];
    let txt2 = ctx['value2'];
    return block1([txt1, txt2]);
@@ -1092,12 +1037,11 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] =
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"v\\", \`Hi\`);
@@ -1111,11 +1055,10 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 2`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['v'];
    return block1([txt1]);
  }
@@ -1127,10 +1070,9 @@ exports[`t-call (template calling) with unused body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b1 = text(\`WHEEE\`);
@@ -1144,11 +1086,10 @@ exports[`t-call (template calling) with unused body 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div>ok</div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -1159,10 +1100,9 @@ exports[`t-call (template calling) with unused setbody 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -1177,11 +1117,10 @@ exports[`t-call (template calling) with unused setbody 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div>ok</div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -1192,10 +1131,9 @@ exports[`t-call (template calling) with used body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b1 = text(\`ok\`);
@@ -1210,11 +1148,10 @@ exports[`t-call (template calling) with used body 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<h1><block-text-0/></h1>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx[zero];
    return block1([txt1]);
  }
@@ -1226,12 +1163,11 @@ exports[`t-call (template calling) with used setbody 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -1247,9 +1183,8 @@ exports[`t-call (template calling) with used setbody 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['foo']);
  }
 }"
@@ -177,13 +177,12 @@ exports[`t-esc t-esc=0 is escaped 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block2 = createBlock(\`<p>escaped</p>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -199,11 +198,10 @@ exports[`t-esc t-esc=0 is escaped 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx[zero];
    return block1([txt1]);
  }
@@ -77,62 +77,6 @@ exports[`t-foreach iterate on items 1`] = `
 }"
 `;
 exports[`t-foreach iterate, Map 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(ctx['value']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
      ctx[\`item\`] = v_block1[i1];
      ctx[\`item_index\`] = i1;
      ctx[\`item_value\`] = k_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 iterate, Set 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(ctx['value']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
      ctx[\`item\`] = v_block1[i1];
      ctx[\`item_index\`] = i1;
      ctx[\`item_value\`] = k_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 iterate, dict param 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
@@ -164,62 +108,6 @@ exports[`t-foreach iterate, dict param 1`] = `
 }"
 `;
 exports[`t-foreach iterate, generator 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(ctx['gen']());;
    for (let i1 = 0; i1 < l_block1; i1++) {
      ctx[\`item\`] = v_block1[i1];
      ctx[\`item_index\`] = i1;
      ctx[\`item_value\`] = k_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 iterate, iterable 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(ctx['map'].values());;
    for (let i1 = 0; i1 < l_block1; i1++) {
      ctx[\`item\`] = v_block1[i1];
      ctx[\`item_index\`] = i1;
      ctx[\`item_value\`] = k_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 iterate, position 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
@@ -328,13 +216,12 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/><span>[<block-text-0/>][<block-text-1/>][<block-text-2/>]</span></div>\`);
  let block6 = createBlock(\`<span><block-text-0/></span>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -381,9 +268,8 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\` [\`);
    const b3 = text(ctx['a']);
    const b4 = text(\`] [\`);
@@ -401,13 +287,12 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/><span>[<block-text-0/>][<block-text-1/>][<block-text-2/>]</span></div>\`);
  let block6 = createBlock(\`<span><block-text-0/></span>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['numbers']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -449,9 +334,8 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"sub\\"
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"c\\", 'x'+'_'+ctx['a']+'_'+ctx['b']);
@@ -32,13 +32,12 @@ exports[`t-out multiple calls to t-out 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block2 = createBlock(\`<span>coucou</span>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -54,11 +53,10 @@ exports[`t-out multiple calls to t-out 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div><block-child-0/><div>Greeter</div><block-child-1/></div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx[zero];
    const b3 = ctx[zero];
    return block1([], [b2, b3]);
@@ -101,13 +99,12 @@ exports[`t-out t-out 0 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"caller\\"
  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block2 = createBlock(\`<div>zero</div>\`);
-  return function caller(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b2 = block2();
@@ -123,11 +120,10 @@ exports[`t-out t-out 0 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { zero } = helpers;
  // Template name: \\"_basic-callee\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function _basic_callee(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx[zero];
    return block1([], [b2]);
  }
@@ -48,12 +48,11 @@ exports[`t-ref ref in a t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -64,11 +63,10 @@ exports[`t-ref ref in a t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div>1<span block-ref=\\"0\\"/>2</div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`name\`), el);
    return block1([ref1]);
  }
@@ -219,12 +219,11 @@ exports[`t-set t-set can't alter from within callee 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 'source');
@@ -241,11 +240,10 @@ exports[`t-set t-set can't alter from within callee 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -261,12 +259,11 @@ exports[`t-set t-set can't alter in t-call body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 'source');
@@ -287,11 +284,10 @@ exports[`t-set t-set can't alter in t-call body 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"sub\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -4,11 +4,10 @@ exports[`loading templates addTemplates does not modify its xml document in plac
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"hey\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function hey(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['value'];
    return block1([txt1]);
  }
@@ -19,11 +18,10 @@ exports[`loading templates can initialize qweb with a string 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"hey\\"
  let block1 = createBlock(\`<div>jupiler</div>\`);
-  return function hey(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -33,11 +31,10 @@ exports[`loading templates can initialize qweb with an XMLDocument 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"hey\\"
  let block1 = createBlock(\`<div>jupiler</div>\`);
-  return function hey(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -47,12 +44,11 @@ exports[`loading templates can load a few templates from a xml string 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`items\`);
  let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -63,12 +59,11 @@ exports[`loading templates can load a few templates from a xml string 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"items\\"
  let block2 = createBlock(\`<li>ok</li>\`);
  let block3 = createBlock(\`<li>foo</li>\`);
-  return function items(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b3 = block3();
    return multi([b2, b3]);
@@ -80,12 +75,11 @@ exports[`loading templates can load a few templates from an XMLDocument 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"main\\"
  const callTemplate_1 = app.getTemplate(\`items\`);
  let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
-  return function main(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -96,12 +90,11 @@ exports[`loading templates can load a few templates from an XMLDocument 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"items\\"
  let block2 = createBlock(\`<li>ok</li>\`);
  let block3 = createBlock(\`<li>foo</li>\`);
-  return function items(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b3 = block3();
    return multi([b2, b3]);
@@ -1,92 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 exports[`translation support body of t-sets are translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"label\\", \`translated\`);
    return text(ctx['label']);
  }
 }"
 `;
 exports[`translation support body of t-sets inside translation=off are not translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"label\\", \`untranslated\`);
    return text(ctx['label']);
  }
 }"
 `;
 exports[`translation support body of t-sets with html content are translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>translated</div>\`);
  function value1(ctx, node, key = \\"\\") {
    return block1();
  }
  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx[\`label\`] = new LazyValue(value1, ctx, this, node, key);
    return safeOutput(ctx['label']);
  }
 }"
 `;
 exports[`translation support body of t-sets with text and html content are translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
  // Template name: \\"xml_template_999\\"
  let block3 = createBlock(\`<div>translated</div>\`);
  function value1(ctx, node, key = \\"\\") {
    const b2 = text(\` translated \`);
    const b3 = block3();
    return multi([b2, b3]);
  }
  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx[\`label\`] = new LazyValue(value1, ctx, this, node, key);
    return safeOutput(ctx['label']);
  }
 }"
 `;
 exports[`translation support can set and remove translatable attributes 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div tomato=\\"word\\" potato=\\"mot\\" title=\\"mot\\" label=\\"word\\">text</div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -96,11 +17,10 @@ exports[`translation support can translate node content 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>mot</div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -110,11 +30,10 @@ exports[`translation support does not translate node content if disabled 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><span>mot</span><span>word</span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -124,41 +43,23 @@ exports[`translation support some attributes are translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><p label=\\"mot\\">mot</p><p title=\\"mot\\">mot</p><p placeholder=\\"mot\\">mot</p><p alt=\\"mot\\">mot</p><p something=\\"word\\">mot</p></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
 `;
 exports[`translation support t-set and falsy t-value: t-body are translated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"label\\", withDefault(false, \`translated\`));
    return text(ctx['label']);
  }
 }"
 `;
 exports[`translation support translation is done on the trimmed text, with extra spaces readded after 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div> mot </div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -168,11 +69,10 @@ exports[`translation support translation works, even if initial string has inner
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>un mot</div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -371,33 +371,4 @@ describe("attributes", () => {
    // not sure about this. maybe we want to remove the attribute?
    expect(fixture.innerHTML).toBe('<div class="hoy a b"></div>');
  });
  test("various combinations of class, t-att-class, and t-att", () => {
    const template1 = `<div t-att="{ class: 'a' }" class="c">content</div>`;
    expect(renderToString(template1)).toBe('<div class="c a">content</div>');
    const template2 = `<div t-att="{ class: 'a' }" t-att-class="{'b': true}" class="c">content</div>`;
    expect(renderToString(template2)).toBe('<div class="c a b">content</div>');
    const template3 = `<div t-att="{ class: 'a' }" class="c" t-att-class="{'b': true}">content</div>`;
    expect(renderToString(template3)).toBe('<div class="c a b">content</div>');
    const template4 = `<div class="c" t-att="{ class: 'a' }" t-att-class="{'b': true}">content</div>`;
    expect(renderToString(template4)).toBe('<div class="c a b">content</div>');
    const template5 = `<div class="c" t-att-class="{'b': true}" t-att="{ class: 'a' }">content</div>`;
    expect(renderToString(template5)).toBe('<div class="c b a">content</div>');
    const template6 = `<div class="c" t-att-class="{'b': true}">content</div>`;
    expect(renderToString(template6)).toBe('<div class="c b">content</div>');
    const template7 = `<div class="c" t-attf-class="{{'b'}}">content</div>`;
    expect(renderToString(template7)).toBe('<div class="c b">content</div>');
    const template8 = `<div t-att="{ class: 'a' }" class="c" t-att-class="{'b': true}">content</div>`;
    expect(renderToString(template8)).toBe('<div class="c a b">content</div>');
    const template9 = `<div t-att="{ class: 'a' }" t-att-class="{'b': true}">content</div>`;
    expect(renderToString(template9)).toBe('<div class="a b">content</div>');
  });
 });
@@ -1147,24 +1147,6 @@ describe("qweb parser", () => {
    });
  });
  test("t-onclick without dash", async () => {
    expect(() => parse(`<button t-onclick="add">Click</button>`)).toThrowError(
      "Unknown QWeb directive: 't-onclick'"
    );
  });
  test("t-on without event", async () => {
    expect(() => parse(`<button t-on="add">Click</button>`)).toThrowError(
      "Missing event name with t-on directive"
    );
  });
  test("t-on- without event", async () => {
    expect(() => parse(`<button t-on-="add">Click</button>`)).toThrowError(
      "Missing event name with t-on directive"
    );
  });
  // ---------------------------------------------------------------------------
  // t-model
  // ---------------------------------------------------------------------------
@@ -1293,12 +1275,6 @@ describe("qweb parser", () => {
    });
  });
  test("component with event handler", async () => {
    expect(() => parse(`<MyComponent t-onclick="someMethod"/>`)).toThrowError(
      "unsupported directive on Component: t-onclick"
    );
  });
  test("component with t-ref", async () => {
    expect(() => parse(`<MyComponent t-ref="something"/>`)).toThrow(
      "t-ref is no longer supported on components. Consider exposing only the public part of the component's API through a callback prop."
@@ -1569,12 +1545,6 @@ describe("qweb parser", () => {
    );
  });
  test("component with t-out", async () => {
    expect(parse(`<MyComponent t-out="someValue"/>`)).toEqual(
      parse(`<MyComponent><t t-out="someValue"/></MyComponent>`)
    );
  });
  test("component with t-esc and content", async () => {
    expect(() => parse(`<MyComponent t-esc="someValue">Some content</MyComponent>`)).toThrow(
      "Cannot have t-esc on a component that already has content"
@@ -1997,8 +1967,8 @@ describe("qweb parser", () => {
      baseExpr: "state",
      expr: "'stuff'",
      eventType: "click",
-      shouldNumberize: true,
+      shouldNumberize: false,
-      shouldTrim: true,
+      shouldTrim: false,
      targetAttr: "value",
      hasDynamicChildren: false,
      specialInitTargetAttr: "checked",
@@ -2028,6 +1998,7 @@ describe("qweb parser", () => {
  test("t-portal", async () => {
    expect(parse(`<t t-portal="target">Content</t>`)).toEqual({
      type: ASTType.TPortal,
      isClosest: false,
      target: "target",
      content: { type: ASTType.Text, value: "Content" },
    });
@@ -2038,6 +2009,7 @@ describe("qweb parser", () => {
      condition: "condition",
      content: {
        content: { type: ASTType.Text, value: "Content" },
        isClosest: false,
        target: "target",
        type: ASTType.TPortal,
      },
@@ -2046,4 +2018,13 @@ describe("qweb parser", () => {
      type: ASTType.TIf,
    });
  });
  test("t-portal with .closest", async () => {
    expect(parse(`<t t-portal.closest="target">Content</t>`)).toEqual({
      type: ASTType.TPortal,
      isClosest: true,
      target: "target",
      content: { type: ASTType.Text, value: "Content" },
    });
  });
 });
@@ -105,64 +105,6 @@ describe("t-foreach", () => {
    expect(renderToString(template, context)).toBe(expected);
  });
  test("iterate, Map param", () => {
    const template = `
      <t t-foreach="value" 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: 1 a]  [1: 2 b]  [2: 3 c] `;
    const context = {
      value: new Map([
        ["a", 1],
        ["b", 2],
        ["c", 3],
      ]),
    };
    expect(renderToString(template, context)).toBe(expected);
  });
  test("iterate, Set param", () => {
    const template = `
      <t t-foreach="value" 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: 1 1]  [1: 2 2]  [2: 3 3] `;
    const context = { value: new Set([1, 2, 3]) };
    expect(renderToString(template, context)).toBe(expected);
  });
  test("iterate, iterable param", () => {
    const template = `
      <t t-foreach="map.values()" 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: 1 1]  [1: 2 2]  [2: 3 3] `;
    const context = {
      map: new Map([
        ["a", 1],
        ["b", 2],
        ["c", 3],
      ]),
    };
    expect(renderToString(template, context)).toBe(expected);
  });
  test("iterate, generator param", () => {
    const template = `
      <t t-foreach="gen()" 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: 1 1]  [1: 2 2]  [2: 3 3] `;
    const context = {
      *gen() {
        yield 1;
        yield 2;
        yield 3;
      },
    };
    expect(renderToString(template, context)).toBe(expected);
  });
  test("does not pollute the rendering context", () => {
    const template = `
        <div>
@@ -251,9 +193,7 @@ describe("t-foreach", () => {
  test("throws error if invalid loop expression", () => {
    const test = `<div><t t-foreach="abc" t-as="item" t-key="item"><span t-key="item_index"/></t></div>`;
-    expect(() => renderToString(test)).toThrow(
+    expect(() => renderToString(test)).toThrow("Invalid loop expression");
      'Invalid loop expression: "undefined" is not iterable'
    );
  });
  test("t-foreach with t-if inside", () => {
@@ -100,74 +100,4 @@ describe("translation support", () => {
    expect(translateFn).toHaveBeenCalledWith("some  word");
    expect(fixture.innerHTML).toBe("<div>un mot</div>");
  });
  test("body of t-sets are translated", async () => {
    class SomeComponent extends Component {
      static template = xml`
        <t t-set="label">untranslated</t>
        <t t-esc="label"/>`;
    }
    const translateFn = () => "translated";
    await mount(SomeComponent, fixture, { translateFn });
    expect(fixture.innerHTML).toBe("translated");
  });
  test("body of t-sets inside translation=off are not translated", async () => {
    class SomeComponent extends Component {
      static template = xml`
        <t t-translation="off">
          <t t-set="label">untranslated</t>
          <t t-esc="label"/>
        </t>`;
    }
    const translateFn = () => "translated";
    await mount(SomeComponent, fixture, { translateFn });
    expect(fixture.innerHTML).toBe("untranslated");
  });
  test("body of t-sets with html content are translated", async () => {
    class SomeComponent extends Component {
      static template = xml`
        <t t-set="label"><div>untranslated</div></t>
        <t t-out="label"/>`;
    }
    const translateFn = () => "translated";
    await mount(SomeComponent, fixture, { translateFn });
    expect(fixture.innerHTML).toBe("<div>translated</div>");
  });
  test("body of t-sets with text and html content are translated", async () => {
    class SomeComponent extends Component {
      static template = xml`
        <t t-set="label">
          some text
          <div>untranslated</div>
        </t>
        <t t-out="label"/>`;
    }
    const translateFn = () => "translated";
    await mount(SomeComponent, fixture, { translateFn });
    expect(fixture.innerHTML).toBe(" translated <div>translated</div>");
  });
  test("t-set and falsy t-value: t-body are translated", async () => {
    class SomeComponent extends Component {
      static template = xml`
          <t t-set="label" t-value="false">untranslated</t>
          <t t-esc="label"/>`;
    }
    const translateFn = () => "translated";
    await mount(SomeComponent, fixture, { translateFn });
    expect(fixture.innerHTML).toBe("translated");
  });
 });
@@ -37,22 +37,4 @@ describe("basic validation", () => {
    const template = `<div t-best-beer="rochefort 10">test</div>`;
    expect(() => renderToString(template)).toThrow("Unknown QWeb directive: 't-best-beer'");
  });
  test("compilation error", () => {
    const template = `<div t-att-class="a b">test</div>`;
    expect(() => renderToString(template))
      .toThrow(`Failed to compile anonymous template: Unexpected identifier
 generated code:
 function(app, bdom, helpers) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let block1 = createBlock(\`<div block-attribute-0="class">test</div>\`);
  return function template(ctx, node, key = "") {
    let attr1 = ctx['a']ctx['b'];
    return block1([attr1]);
  }
 }`);
  });
 });
@@ -4,11 +4,10 @@ exports[`event handling Invalid handler throws an error 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\">click</button>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['dosomething'], ctx];
    return block1([hdlr1]);
  }
@@ -19,11 +18,10 @@ exports[`event handling handler is not called if component is destroyed 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['click'], ctx];
    return block1([hdlr1]);
  }
@@ -34,12 +32,11 @@ exports[`event handling handler receive the event as argument 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<span block-handler-0=\\"click\\"><block-child-0/><block-text-1/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['inc'], ctx];
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    let txt1 = ctx['state'].value;
@@ -52,11 +49,10 @@ exports[`event handling handler receive the event as argument 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>simple vnode</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -66,11 +62,10 @@ exports[`event handling handler works when app is mounted in an iframe 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span block-handler-0=\\"click\\">click me</span>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['inc'], ctx];
    return block1([hdlr1]);
  }
@@ -81,12 +76,11 @@ exports[`event handling input blur event is not called if component is destroyed
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><textarea/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].cond) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -100,11 +94,10 @@ exports[`event handling input blur event is not called if component is destroyed
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<input block-handler-0=\\"blur\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['blur'], ctx];
    return block1([hdlr1]);
  }
@@ -116,12 +109,11 @@ exports[`event handling objects from scope are properly captured by t-on 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div class=\\"item\\" block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['items']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -142,11 +134,10 @@ exports[`event handling support for callable expression in event handler 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><input type=\\"text\\" block-handler-1=\\"input\\"/></div>\`);
-  return function xml_template_999_Counter(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].value;
    let hdlr1 = [ctx['obj'].onInput, ctx];
    return block1([txt1, hdlr1]);
@@ -159,12 +150,11 @@ exports[`event handling t-on with handler bound to dynamic argument on a t-forea
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div class=\\"item\\" block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['items']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -4,10 +4,9 @@ exports[`basics basic use 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"p\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({p: 1}, key + \`__1\`, node, this, null);
  }
 }"
@@ -17,11 +16,10 @@ exports[`basics basic use 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>child<block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].p;
    return block1([txt1]);
  }
@@ -32,11 +30,10 @@ exports[`basics can select a sub widget  1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`OtherChild\`, true, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['env'].options.flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -53,11 +50,10 @@ exports[`basics can select a sub widget  2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>CHILD 1</span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -67,11 +63,10 @@ exports[`basics can select a sub widget  3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<div>CHILD 2</div>\`);
-  return function xml_template_1000_OtherChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -81,11 +76,10 @@ exports[`basics can select a sub widget, part 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`OtherChild\`, true, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -102,11 +96,10 @@ exports[`basics can select a sub widget, part 2 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>CHILD 1</span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -116,11 +109,10 @@ exports[`basics can select a sub widget, part 2 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<div>CHILD 2</div>\`);
-  return function xml_template_1000_OtherChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -130,10 +122,9 @@ exports[`basics sub widget is interactive 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"p\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({p: 1}, key + \`__1\`, node, this, null);
  }
 }"
@@ -143,11 +134,10 @@ exports[`basics sub widget is interactive 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><button block-handler-0=\\"click\\">click</button>child<block-text-1/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['inc'], ctx];
    let txt1 = ctx['state'].val;
    return block1([hdlr1, txt1]);
@@ -159,12 +149,11 @@ exports[`basics top level sub widget with a parent 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`ComponentB\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_ComponentA(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -175,10 +164,9 @@ exports[`basics top level sub widget with a parent 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`ComponentC\`, true, false, false, []);
-  return function xml_template_1000_ComponentB(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -188,11 +176,10 @@ exports[`basics top level sub widget with a parent 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>Hello</span>\`);
-  return function xml_template_999_ComponentC(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -4,12 +4,11 @@ exports[`hooks autofocus hook input in a t-if 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-ref=\\"0\\"/><block-child-0/></div>\`);
  let block2 = createBlock(\`<input block-ref=\\"0\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    let ref1 = (el) => this.__owl__.setRef((\`input1\`), el);
    if (ctx['state'].flag) {
@@ -25,11 +24,10 @@ exports[`hooks autofocus hook simple input 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-ref=\\"0\\"/><input block-ref=\\"1\\"/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`input1\`), el);
    let ref2 = (el) => this.__owl__.setRef((\`input2\`), el);
    return block1([ref1, ref2]);
@@ -41,10 +39,9 @@ exports[`hooks can use onWillStart, onWillUpdateProps 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`MyComponent\`, true, false, false, [\\"value\\"]);
-  return function xml_template_1000_App(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null);
  }
 }"
@@ -54,11 +51,10 @@ exports[`hooks can use onWillStart, onWillUpdateProps 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -69,11 +65,10 @@ exports[`hooks can use useComponent 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -83,11 +78,10 @@ exports[`hooks can use useEnv 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].val;
    return block1([txt1]);
  }
@@ -98,11 +92,10 @@ exports[`hooks mounted callbacks should be called in reverse order from willUnmo
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].value;
    return block1([txt1]);
  }
@@ -113,10 +106,9 @@ exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['env'].val);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -128,11 +120,10 @@ exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['env'].hasParent) {
      let txt1 = ctx['env'].val;
@@ -147,10 +138,9 @@ exports[`hooks parent and child env (with useChildSubEnv) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['env'].val);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -162,11 +152,10 @@ exports[`hooks parent and child env (with useChildSubEnv) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].val;
    return block1([txt1]);
  }
@@ -177,10 +166,9 @@ exports[`hooks parent and child env (with useSubEnv) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['env'].val);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -192,11 +180,10 @@ exports[`hooks parent and child env (with useSubEnv) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].val;
    return block1([txt1]);
  }
@@ -207,11 +194,10 @@ exports[`hooks two different call to willPatch/patched should work 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].value;
    return block1([txt1]);
  }
@@ -222,11 +208,10 @@ exports[`hooks useChildSubEnv does not pollute user env 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].val;
    return block1([txt1]);
  }
@@ -237,10 +222,9 @@ exports[`hooks useChildSubEnv supports arbitrary descriptor 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -250,11 +234,10 @@ exports[`hooks useChildSubEnv supports arbitrary descriptor 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/> <block-text-1/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].someVal;
    let txt2 = ctx['env'].someVal2;
    return block1([txt1, txt2]);
@@ -266,11 +249,10 @@ exports[`hooks useEffect hook dependencies prevent effects from rerunning when u
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -280,11 +262,10 @@ exports[`hooks useEffect hook effect can depend on stuff in dom 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div block-ref=\\"0\\"/>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].value) {
      let ref1 = (el) => this.__owl__.setRef((\`div\`), el);
@@ -299,11 +280,10 @@ exports[`hooks useEffect hook effect runs on mount, is reapplied on patch, and i
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -313,11 +293,10 @@ exports[`hooks useEffect hook effect with empty dependency list never reruns 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].value;
    return block1([txt1]);
  }
@@ -328,11 +307,10 @@ exports[`hooks useEffect hook properly behaves when the effect function throws 1
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -342,10 +320,9 @@ exports[`hooks useExternalListener 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`MyComponent\`, true, false, false, []);
-  return function xml_template_1000_App(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -359,11 +336,10 @@ exports[`hooks useExternalListener 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_MyComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -374,11 +350,10 @@ exports[`hooks useRef hook: basic use 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><button block-ref=\\"0\\"><block-text-1/></button></div>\`);
-  return function xml_template_999_Counter(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`button\`), el);
    let txt1 = ctx['value'];
    return block1([ref1, txt1]);
@@ -390,11 +365,10 @@ exports[`hooks useSubEnv modifies user env 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].val;
    return block1([txt1]);
  }
@@ -405,10 +379,9 @@ exports[`hooks useSubEnv supports arbitrary descriptor 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -418,11 +391,10 @@ exports[`hooks useSubEnv supports arbitrary descriptor 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/> <block-text-1/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['env'].someVal;
    let txt2 = ctx['env'].someVal2;
    return block1([txt1, txt2]);
@@ -4,11 +4,10 @@ exports[`lifecycle hooks basic checks for a component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>test</span>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -18,13 +17,12 @@ exports[`lifecycle hooks component semantics 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1004\\"
  const comp1 = app.createComponent(\`B\`, true, false, false, []);
  const comp2 = app.createComponent(\`C\`, true, false, false, []);
  let block1 = createBlock(\`<div>A<block-child-0/><block-child-1/></div>\`);
-  return function xml_template_1004_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = comp2({}, key + \`__2\`, node, this, null);
    return block1([], [b2, b3]);
@@ -36,11 +34,10 @@ exports[`lifecycle hooks component semantics 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>B</div>\`);
-  return function xml_template_999_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -50,14 +47,13 @@ exports[`lifecycle hooks component semantics 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1003\\"
  const comp1 = app.createComponent(\`D\`, true, false, false, []);
  const comp2 = app.createComponent(\`E\`, true, false, false, []);
  const comp3 = app.createComponent(\`F\`, true, false, false, []);
  let block1 = createBlock(\`<div>C<block-child-0/><block-child-1/><block-child-2/></div>\`);
-  return function xml_template_1003_C(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3,b4;
    b2 = comp1({}, key + \`__1\`, node, this, null);
    if (ctx['state'].flag) {
@@ -74,11 +70,10 @@ exports[`lifecycle hooks component semantics 4`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<div>D</div>\`);
-  return function xml_template_1000_D(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -88,11 +83,10 @@ exports[`lifecycle hooks component semantics 5`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  let block1 = createBlock(\`<div>E</div>\`);
-  return function xml_template_1001_E(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -102,11 +96,10 @@ exports[`lifecycle hooks component semantics 6`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1002\\"
  let block1 = createBlock(\`<div>F</div>\`);
-  return function xml_template_1002_F(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -116,12 +109,11 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"n\\"]);
  let block2 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      const b3 = comp1({n: ctx['state'].n}, key + \`__1\`, node, this, null);
@@ -136,11 +128,10 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].n;
    return block1([txt1]);
  }
@@ -151,10 +142,9 @@ exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].ok) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -168,11 +158,10 @@ exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -182,10 +171,9 @@ exports[`lifecycle hooks destroy new children before being mountged 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3,b4;
    b2 = text(\`before\`);
    if (ctx['state'].flag) {
@@ -201,9 +189,8 @@ exports[`lifecycle hooks destroy new children before being mountged 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -213,12 +200,11 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -229,11 +215,10 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -243,10 +228,9 @@ exports[`lifecycle hooks lifecycle callbacks are bound to component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Test\`, true, false, false, [\\"rev\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({rev: ctx['rev']}, key + \`__1\`, node, this, null);
  }
 }"
@@ -256,9 +240,8 @@ exports[`lifecycle hooks lifecycle callbacks are bound to component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].rev);
  }
 }"
@@ -268,12 +251,11 @@ exports[`lifecycle hooks lifecycle semantics 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"a\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({a: ctx['state'].a}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -284,11 +266,10 @@ exports[`lifecycle hooks lifecycle semantics 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -298,10 +279,9 @@ exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasChild) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -315,10 +295,9 @@ exports[`lifecycle hooks lifecycle semantics, part 2 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`GrandChild\`, true, false, false, []);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -328,11 +307,10 @@ exports[`lifecycle hooks lifecycle semantics, part 2 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_GrandChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -342,10 +320,9 @@ exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasChild) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -359,10 +336,9 @@ exports[`lifecycle hooks lifecycle semantics, part 4 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasChild) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -376,10 +352,9 @@ exports[`lifecycle hooks lifecycle semantics, part 4 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`GrandChild\`, true, false, false, []);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -389,11 +364,10 @@ exports[`lifecycle hooks lifecycle semantics, part 4 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_GrandChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -403,10 +377,9 @@ exports[`lifecycle hooks lifecycle semantics, part 5 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasChild) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -420,11 +393,10 @@ exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -434,10 +406,9 @@ exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null);
  }
 }"
@@ -447,11 +418,10 @@ exports[`lifecycle hooks lifecycle semantics, part 6 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -461,11 +431,10 @@ exports[`lifecycle hooks mounted hook is called if mounted in DOM 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -475,10 +444,9 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasChild) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -492,11 +460,10 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -506,12 +473,11 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -522,11 +488,10 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -536,12 +501,11 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -555,12 +519,11 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`ChildChild\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -571,11 +534,10 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_ChildChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -585,10 +547,9 @@ exports[`lifecycle hooks onWillRender 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"someValue\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({someValue: ctx['state'].value}, key + \`__1\`, node, this, null);
  }
 }"
@@ -598,11 +559,10 @@ exports[`lifecycle hooks onWillRender 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\"><block-text-1/></button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['increment'], ctx];
    let txt1 = ctx['state'].value;
    return block1([hdlr1, txt1]);
@@ -614,12 +574,11 @@ exports[`lifecycle hooks patched hook is called after updateProps 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"a\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({a: ctx['state'].a}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -630,11 +589,10 @@ exports[`lifecycle hooks patched hook is called after updateProps 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -644,11 +602,10 @@ exports[`lifecycle hooks patched hook is called after updating State 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].a;
    return block1([txt1]);
  }
@@ -659,11 +616,10 @@ exports[`lifecycle hooks render in mounted 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['patched'];
    return block1([txt1]);
  }
@@ -674,11 +630,10 @@ exports[`lifecycle hooks render in patched 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['patched'];
    return block1([txt1]);
  }
@@ -689,11 +644,10 @@ exports[`lifecycle hooks render in willPatch 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['patched'];
    return block1([txt1]);
  }
@@ -704,10 +658,9 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -721,11 +674,10 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -735,11 +687,10 @@ exports[`lifecycle hooks timeout in onWillStart emits a warning 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -749,10 +700,9 @@ exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"prop\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const props1 = {prop: ctx['state'].prop};
    helpers.validateProps(\`Child\`, props1, this);
    return comp1(props1, key + \`__1\`, node, this, null);
@@ -764,9 +714,8 @@ exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`\`);
  }
 }"
@@ -776,12 +725,11 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"n\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({n: ctx['state'].n}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -792,12 +740,11 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`ChildChild\`, true, false, false, [\\"n\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({n: ctx['props'].n}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -808,11 +755,10 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_ChildChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].n;
    return block1([txt1]);
  }
@@ -823,10 +769,9 @@ exports[`lifecycle hooks willStart hook is called on sub component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -836,11 +781,10 @@ exports[`lifecycle hooks willStart hook is called on sub component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -850,11 +794,10 @@ exports[`lifecycle hooks willStart is called 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>simple vnode</span>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -864,11 +807,10 @@ exports[`lifecycle hooks willStart is called with component as this 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>simple vnode</span>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -878,13 +820,12 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
  let block3 = createBlock(\`<div/>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['state'].ok) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -900,11 +841,10 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -914,10 +854,9 @@ exports[`lifecycle hooks willUpdateProps hook is called 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"n\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({n: ctx['state'].n}, key + \`__1\`, node, this, null);
  }
 }"
@@ -927,11 +866,10 @@ exports[`lifecycle hooks willUpdateProps hook is called 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].n;
    return block1([txt1]);
  }
@@ -5,10 +5,9 @@ exports[`.alike suffix in a list 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Todo\`, true, false, false, [\\"todo\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['state'].elems);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -27,11 +26,10 @@ exports[`.alike suffix in a list 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\"><block-text-1/><block-child-0/></button>\`);
-  return function xml_template_999_Todo(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    let hdlr1 = [ctx['props'].toggle, ctx];
    let txt1 = ctx['props'].todo.id;
@@ -47,10 +45,9 @@ exports[`.alike suffix in a simple case 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].counter);
    const b3 = comp1({fn: ()=>1}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -62,9 +59,8 @@ exports[`.alike suffix in a simple case 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].fn());
  }
 }"
@@ -74,12 +70,11 @@ exports[`basics accept ES6-like syntax for props (with getters) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"greetings\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({greetings: ctx['greetings']}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -90,11 +85,10 @@ exports[`basics accept ES6-like syntax for props (with getters) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].greetings;
    return block1([txt1]);
  }
@@ -106,10 +100,9 @@ exports[`basics arrow functions as prop correctly capture their scope 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"onClick\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['items']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -128,11 +121,10 @@ exports[`basics arrow functions as prop correctly capture their scope 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['props'].onClick, ctx];
    return block1([hdlr1]);
  }
@@ -143,12 +135,11 @@ exports[`basics explicit object prop 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({value: ctx['state'].val}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -159,11 +150,10 @@ exports[`basics explicit object prop 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].someval;
    return block1([txt1]);
  }
@@ -174,10 +164,9 @@ exports[`basics prop names can contain - 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"prop-name\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({'prop-name': 7}, key + \`__1\`, node, this, null);
  }
 }"
@@ -187,11 +176,10 @@ exports[`basics prop names can contain - 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props']['prop-name'];
    return block1([txt1]);
  }
@@ -202,10 +190,9 @@ exports[`basics support prop names that aren't valid bare object property names
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"some-dashed-prop\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({'some-dashed-prop': 5}, key + \`__1\`, node, this, null);
  }
 }"
@@ -215,11 +202,10 @@ exports[`basics support prop names that aren't valid bare object property names
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['props'].onClick, ctx];
    return block1([hdlr1]);
  }
@@ -231,7 +217,6 @@ exports[`basics t-set with a body expression can be passed in props, and then t-
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, LazyValue } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
@@ -241,7 +226,7 @@ exports[`basics t-set with a body expression can be passed in props, and then t-
    return block2();
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx[\`abc\`] = new LazyValue(value1, ctx, this, node, key);
@@ -256,11 +241,10 @@ exports[`basics t-set with a body expression can be passed in props, and then t-
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { safeOutput } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/><block-child-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    const b2 = safeOutput(ctx['props'].val);
    return block1([txt1], [b2]);
@@ -273,12 +257,11 @@ exports[`basics t-set with a body expression can be used as textual prop 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"abc\\", \`42\`);
@@ -292,11 +275,10 @@ exports[`basics t-set with a body expression can be used as textual prop 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -308,12 +290,11 @@ exports[`basics t-set works  1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"val\\", 42);
@@ -327,11 +308,10 @@ exports[`basics t-set works  2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -342,10 +322,9 @@ exports[`basics template string in prop 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"propName\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({propName: \`1\${ctx['someVal']}3\`}, key + \`__1\`, node, this, null);
  }
 }"
@@ -355,9 +334,8 @@ exports[`basics template string in prop 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`\`);
  }
 }"
@@ -367,10 +345,9 @@ exports[`bound functions are considered 'alike' 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].val);
    const b3 = comp1({fn: (ctx['someFunction']).bind(this)}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -382,9 +359,8 @@ exports[`bound functions are considered 'alike' 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -394,10 +370,9 @@ exports[`bound functions is not referentially equal after update 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({val: ctx['state'].val,fn: (ctx['someFunction']).bind(this)}, key + \`__1\`, node, this, null);
  }
 }"
@@ -407,9 +382,8 @@ exports[`bound functions is not referentially equal after update 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].val);
  }
 }"
@@ -419,10 +393,9 @@ exports[`can bind function prop with bind suffix 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({doSomething: (ctx['doSomething']).bind(this)}, key + \`__1\`, node, this, null);
  }
 }"
@@ -432,9 +405,8 @@ exports[`can bind function prop with bind suffix 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -444,10 +416,9 @@ exports[`do not crash when binding anonymous function prop with bind suffix 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const v1 = ctx['this'];
    return comp1({doSomething: ((_val)=>v1.doSomething(_val)).bind(this)}, key + \`__1\`, node, this, null);
  }
@@ -458,9 +429,8 @@ exports[`do not crash when binding anonymous function prop with bind suffix 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -4,10 +4,9 @@ exports[`reactivity in lifecycle Child component doesn't render when state they
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"state\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].renderChild) {
      b2 = comp1({state: ctx['state']}, key + \`__1\`, node, this, null);
@@ -21,9 +20,8 @@ exports[`reactivity in lifecycle Child component doesn't render when state they
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].state.content.a);
  }
 }"
@@ -33,10 +31,9 @@ exports[`reactivity in lifecycle Component is automatically subscribed to reacti
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"obj\\",\\"reactiveObj\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({obj: ctx['obj'],reactiveObj: ctx['reactiveObj']}, key + \`__1\`, node, this, null);
  }
 }"
@@ -46,9 +43,8 @@ exports[`reactivity in lifecycle Component is automatically subscribed to reacti
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['props'].obj.a);
    const b3 = text(ctx['props'].reactiveObj.b);
    return multi([b2, b3]);
@@ -60,11 +56,10 @@ exports[`reactivity in lifecycle can use a state hook 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Counter(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['counter'].value;
    return block1([txt1]);
  }
@@ -75,11 +70,10 @@ exports[`reactivity in lifecycle can use a state hook 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].a;
    return block1([txt1]);
  }
@@ -90,11 +84,10 @@ exports[`reactivity in lifecycle can use a state hook on Map 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Counter(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['counter'].get('value');
    return block1([txt1]);
  }
@@ -105,11 +98,10 @@ exports[`reactivity in lifecycle change state while mounting component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].val;
    return block1([txt1]);
  }
@@ -120,12 +112,11 @@ exports[`reactivity in lifecycle state changes in willUnmount do not trigger rer
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
@@ -139,11 +130,10 @@ exports[`reactivity in lifecycle state changes in willUnmount do not trigger rer
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    let txt2 = ctx['state'].n;
    return block1([txt1, txt2]);
@@ -155,9 +145,8 @@ exports[`subscriptions subscriptions returns the keys and targets observed by th
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['state'].a);
  }
 }"
@@ -167,10 +156,9 @@ exports[`subscriptions subscriptions returns the keys observed by the component
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"state\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].a);
    const b3 = comp1({state: ctx['state']}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -182,9 +170,8 @@ exports[`subscriptions subscriptions returns the keys observed by the component
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].state.b);
  }
 }"
@@ -4,11 +4,10 @@ exports[`refs basic use 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-ref=\\"0\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`div\`), el);
    return block1([ref1]);
  }
@@ -19,12 +18,11 @@ exports[`refs can use 2 refs with same name in a t-if/t-else situation 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div block-ref=\\"0\\"/>\`);
  let block3 = createBlock(\`<span block-ref=\\"0\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['state'].value) {
      let ref1 = (el) => this.__owl__.setRef((\`coucou\`), el);
@@ -42,11 +40,10 @@ exports[`refs ref is unset when t-if goes to false after unrelated render 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div block-attribute-0=\\"class\\" block-ref=\\"1\\"/>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].show) {
      let attr1 = ctx['state'].class;
@@ -62,12 +59,11 @@ exports[`refs refs and recursive templates 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const comp1 = app.createComponent(\`Test\`, true, false, false, [\\"tree\\"]);
  let block1 = createBlock(\`<p block-ref=\\"0\\"><block-text-1/><block-child-0/></p>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    let ref1 = (el) => this.__owl__.setRef((\`root\`), el);
    let txt1 = ctx['props'].tree.value;
@@ -83,12 +79,11 @@ exports[`refs refs and t-key 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<button block-handler-0=\\"click\\"/>\`);
  let block3 = createBlock(\`<p block-ref=\\"0\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const v1 = ctx['state'];
    let hdlr1 = [()=>v1.renderId++, ctx];
    const b2 = block2([hdlr1]);
@@ -105,7 +100,6 @@ exports[`refs refs are properly bound in slots 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Dialog\`, true, true, false, []);
  let block1 = createBlock(\`<div><span class=\\"counter\\"><block-text-0/></span><block-child-0/></div>\`);
@@ -117,7 +111,7 @@ exports[`refs refs are properly bound in slots 1`] = `
    return block2([hdlr1, ref1]);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].val;
    const ctx1 = capture(ctx);
    const b3 = comp1({slots: markRaw({'footer': {__render: slot1.bind(this), __ctx: ctx1}})}, key + \`__1\`, node, this, null);
@@ -131,11 +125,10 @@ exports[`refs refs are properly bound in slots 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function xml_template_999_Dialog(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callSlot(ctx, node, key, 'footer', false, {});
    return block1([], [b2]);
  }
@@ -147,12 +140,11 @@ exports[`refs throws if there are 2 same refs at the same time 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { makeRefWrapper } = helpers;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div block-ref=\\"0\\"/>\`);
  let block3 = createBlock(\`<span block-ref=\\"0\\"/>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let refWrapper = makeRefWrapper(this.__owl__);
    let ref1 = refWrapper(\`coucou\`, (el) => this.__owl__.setRef((\`coucou\`), el));
    const b2 = block2([ref1]);
@@ -4,10 +4,9 @@ exports[`children, default props and renderings 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].value);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -19,9 +18,8 @@ exports[`children, default props and renderings 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -31,10 +29,9 @@ exports[`force render in case of existing render 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`B\`, true, false, false, [\\"val\\"]);
-  return function xml_template_1001_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
 }"
@@ -44,10 +41,9 @@ exports[`force render in case of existing render 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`C\`, true, false, false, []);
-  return function xml_template_1000_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = text(ctx['props'].val);
    return multi([b2, b3]);
@@ -59,9 +55,8 @@ exports[`force render in case of existing render 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_C(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`C\`);
  }
 }"
@@ -71,10 +66,9 @@ exports[`rendering semantics can force a render to update sub tree 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].value);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -86,9 +80,8 @@ exports[`rendering semantics can force a render to update sub tree 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -98,10 +91,9 @@ exports[`rendering semantics can render a parent without rendering child 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].value);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -113,9 +105,8 @@ exports[`rendering semantics can render a parent without rendering child 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -125,10 +116,9 @@ exports[`rendering semantics props are reactive (nested prop) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"a\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({a: ctx['state']}, key + \`__1\`, node, this, null);
  }
 }"
@@ -138,9 +128,8 @@ exports[`rendering semantics props are reactive (nested prop) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].a.b.c);
  }
 }"
@@ -150,10 +139,9 @@ exports[`rendering semantics props are reactive 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"a\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({a: ctx['state']}, key + \`__1\`, node, this, null);
  }
 }"
@@ -163,9 +151,8 @@ exports[`rendering semantics props are reactive 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].a.b);
  }
 }"
@@ -175,10 +162,9 @@ exports[`rendering semantics render need a boolean = true to be 'deep' 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].value);
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -190,9 +176,8 @@ exports[`rendering semantics render need a boolean = true to be 'deep' 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -202,10 +187,9 @@ exports[`rendering semantics render with deep=true followed by render with deep=
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`parent\`);
    const b3 = text(ctx['state'].value);
    const b4 = comp1({}, key + \`__1\`, node, this, null);
@@ -218,9 +202,8 @@ exports[`rendering semantics render with deep=true followed by render with deep=
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`child\`);
    const b3 = text(ctx['env'].getValue());
    return multi([b2, b3]);
@@ -232,10 +215,9 @@ exports[`rendering semantics rendering is atomic (for one subtree) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`B\`, true, false, false, [\\"obj\\"]);
-  return function xml_template_1001_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['state'].obj.val);
    const b3 = comp1({obj: ctx['state'].obj}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -247,10 +229,9 @@ exports[`rendering semantics rendering is atomic (for one subtree) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`C\`, true, false, false, [\\"obj\\"]);
-  return function xml_template_1000_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({obj: ctx['props'].obj}, key + \`__1\`, node, this, null);
  }
 }"
@@ -260,9 +241,8 @@ exports[`rendering semantics rendering is atomic (for one subtree) 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_C(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['props'].obj.val);
  }
 }"
@@ -272,10 +252,9 @@ exports[`rendering semantics works as expected for dynamic number of props 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, true, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1(Object.assign({}, ctx['state']), key + \`__1\`, node, this, null);
  }
 }"
@@ -285,9 +264,8 @@ exports[`rendering semantics works as expected for dynamic number of props 2`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(Object.keys(ctx['props']).length);
  }
 }"
@@ -4,10 +4,9 @@ exports[`style and class handling can set class on multi root component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'fromparent'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -17,12 +16,11 @@ exports[`style and class handling can set class on multi root component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<div>a</div>\`);
  let block3 = createBlock(\`<span block-attribute-0=\\"class\\">b</span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    let attr1 = ctx['props'].class;
    const b3 = block3([attr1]);
@@ -35,10 +33,9 @@ exports[`style and class handling can set class on sub component, as prop 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'some-class'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -48,11 +45,10 @@ exports[`style and class handling can set class on sub component, as prop 2`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\">child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -63,10 +59,9 @@ exports[`style and class handling can set class on sub sub component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'fromparent'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -76,10 +71,9 @@ exports[`style and class handling can set class on sub sub component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`ChildChild\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: (ctx['props'].class||'')+' fromchild'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -89,11 +83,10 @@ exports[`style and class handling can set class on sub sub component 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\">childchild</div>\`);
-  return function xml_template_999_ChildChild(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -104,10 +97,9 @@ exports[`style and class handling can set more than one class on sub component 1
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'a  b'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -117,11 +109,10 @@ exports[`style and class handling can set more than one class on sub component 2
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\">child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -132,11 +123,10 @@ exports[`style and class handling can set style and class inside component 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div style=\\"font-weight:bold;\\" class=\\"some-class\\">world</div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -146,11 +136,10 @@ exports[`style and class handling class on components do not interfere with user
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_App(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = {c:ctx['state'].c};
    return block1([attr1]);
  }
@@ -161,10 +150,9 @@ exports[`style and class handling class on sub component, which is switched to a
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1002\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\",\\"child\\"]);
-  return function xml_template_1002_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'someclass',child: ctx['state'].child}, key + \`__1\`, node, this, null);
  }
 }"
@@ -174,11 +162,10 @@ exports[`style and class handling class on sub component, which is switched to a
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`ChildA\`, true, false, false, [\\"class\\"]);
  const comp2 = app.createComponent(\`ChildB\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1001_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['props'].child==='a') {
      b2 = comp1({class: ctx['props'].class}, key + \`__1\`, node, this, null);
@@ -194,11 +181,10 @@ exports[`style and class handling class on sub component, which is switched to a
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\">a</div>\`);
-  return function xml_template_999_ChildA(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -209,11 +195,10 @@ exports[`style and class handling class on sub component, which is switched to a
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span block-attribute-0=\\"class\\">b</span>\`);
-  return function xml_template_1000_ChildB(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -224,12 +209,11 @@ exports[`style and class handling class with extra whitespaces (variation) 1`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
  let block1 = createBlock(\`<p><block-child-0/></p>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({class: 'a  b c   d'}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -240,11 +224,10 @@ exports[`style and class handling class with extra whitespaces (variation) 2`] =
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -255,10 +238,9 @@ exports[`style and class handling class with extra whitespaces 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'a  b c   d'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -268,11 +250,10 @@ exports[`style and class handling class with extra whitespaces 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -283,10 +264,9 @@ exports[`style and class handling component class and parent class combine toget
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'from parent'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -296,11 +276,10 @@ exports[`style and class handling component class and parent class combine toget
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div class=\\"child\\" block-attribute-0=\\"class\\">child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -338,12 +317,11 @@ exports[`style and class handling empty class attribute is not added on widget r
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({class: undefined}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -354,11 +332,10 @@ exports[`style and class handling empty class attribute is not added on widget r
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -369,10 +346,9 @@ exports[`style and class handling error in subcomponent with class 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'a'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -382,11 +358,10 @@ exports[`style and class handling error in subcomponent with class 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\"><block-text-1/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    let txt1 = ctx['this'].will.crash;
    return block1([attr1, txt1]);
@@ -398,10 +373,9 @@ exports[`style and class handling no class is set is child ignores it 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: 'hey'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -411,11 +385,10 @@ exports[`style and class handling no class is set is child ignores it 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -425,10 +398,9 @@ exports[`style and class handling no class is set is parent does not give it as
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -438,11 +410,10 @@ exports[`style and class handling no class is set is parent does not give it as
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"class\\">child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].class;
    return block1([attr1]);
  }
@@ -453,10 +424,9 @@ exports[`style and class handling style is properly added on widget root el 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"style\\"]);
-  return function xml_template_1000_ParentWidget(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({style: 'font-weight: bold;'}, key + \`__1\`, node, this, null);
  }
 }"
@@ -466,11 +436,10 @@ exports[`style and class handling style is properly added on widget root el 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"style\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].style;
    return block1([attr1]);
  }
@@ -481,12 +450,11 @@ exports[`style and class handling t-att-class is properly added/removed on widge
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({class: {b:ctx['state'].b}}, key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -497,11 +465,10 @@ exports[`style and class handling t-att-class is properly added/removed on widge
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span class=\\"c\\" block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = {d:ctx['state'].d,...ctx['props'].class};
    return block1([attr1]);
  }
@@ -512,10 +479,9 @@ exports[`style and class handling t-att-class is properly added/removed on widge
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"class\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({class: {a:true,b:ctx['state'].b}}, key + \`__1\`, node, this, null);
  }
 }"
@@ -525,11 +491,10 @@ exports[`style and class handling t-att-class is properly added/removed on widge
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span class=\\"c\\" block-attribute-0=\\"class\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = {d:ctx['state'].d,...ctx['props'].class};
    return block1([attr1]);
  }
@@ -5,10 +5,9 @@ exports[`t-call dynamic t-call 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, zero } = helpers;
  // Template name: \\"xml_template_999\\"
  const call = app.callTemplate.bind(app);
-  return function xml_template_999_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1;
    const b1 = text(\` owl \`);
@@ -23,11 +22,10 @@ exports[`t-call dynamic t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"foo\\"
  let block1 = createBlock(\`<div>foo</div>\`);
-  return function foo(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -37,9 +35,8 @@ exports[`t-call dynamic t-call 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"bar\\"
-  return function bar(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`bar\`);
  }
 }"
@@ -49,10 +46,9 @@ exports[`t-call dynamic t-call with same sub component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const call = app.callTemplate.bind(app);
-  return function xml_template_1000_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['current'].template);
    const template1 = (ctx['current'].template);
    const b3 = call(this, template1, ctx, node, key + \`__1\`);
@@ -65,10 +61,9 @@ exports[`t-call dynamic t-call with same sub component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"A\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -78,9 +73,8 @@ exports[`t-call dynamic t-call with same sub component 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -90,10 +84,9 @@ exports[`t-call dynamic t-call with same sub component 4`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"B\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -103,11 +96,10 @@ exports[`t-call dynamic t-call: key is propagated 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const call = app.callTemplate.bind(app);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const template1 = (ctx['sub']);
    const b3 = call(this, template1, ctx, node, key + \`__2\`);
@@ -120,11 +112,10 @@ exports[`t-call dynamic t-call: key is propagated 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-attribute-0=\\"id\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['id'];
    return block1([attr1]);
  }
@@ -135,10 +126,9 @@ exports[`t-call dynamic t-call: key is propagated 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -148,13 +138,12 @@ exports[`t-call handlers are properly bound through a dynamic t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const call = app.callTemplate.bind(app);
  let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
-    const template1 = ('xml_template_999');
+    const template1 = ('__template__999');
    const b2 = call(this, template1, ctx, node, key + \`__1\`);
    let txt1 = ctx['counter'];
    return block1([txt1], [b2]);
@@ -166,11 +155,10 @@ exports[`t-call handlers are properly bound through a dynamic t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p block-handler-0=\\"click\\">lucas</p>\`);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const v1 = ctx['this'];
    let hdlr1 = [()=>v1.update(), ctx];
    return block1([hdlr1]);
@@ -182,12 +170,11 @@ exports[`t-call handlers are properly bound through a t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
-  // Template name: \\"xml_template_1000\\"
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
  const callTemplate_1 = app.getTemplate(\`xml_template_999\`);
  let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    let txt1 = ctx['counter'];
    return block1([txt1], [b2]);
@@ -199,11 +186,10 @@ exports[`t-call handlers are properly bound through a t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p block-handler-0=\\"click\\">lucas</p>\`);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['update'], ctx];
    return block1([hdlr1]);
  }
@@ -214,12 +200,11 @@ exports[`t-call handlers with arguments are properly bound through a t-call 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
-  // Template name: \\"xml_template_1000\\"
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
  const callTemplate_1 = app.getTemplate(\`xml_template_999\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -230,11 +215,10 @@ exports[`t-call handlers with arguments are properly bound through a t-call 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p block-handler-0=\\"click\\">lucas</p>\`);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const v1 = ctx['this'];
    const v2 = ctx['a'];
    let hdlr1 = [()=>v1.update(v2), ctx];
@@ -247,12 +231,11 @@ exports[`t-call parent is set within t-call 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
-  // Template name: \\"xml_template_1001\\"
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
  const callTemplate_1 = app.getTemplate(\`xml_template_999\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -263,10 +246,9 @@ exports[`t-call parent is set within t-call 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -276,11 +258,10 @@ exports[`t-call parent is set within t-call 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span>lucas</span>\`);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -290,10 +271,9 @@ exports[`t-call parent is set within t-call with no parentNode 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
-  // Template name: \\"xml_template_1001\\"
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
  const callTemplate_1 = app.getTemplate(\`xml_template_999\`);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
  }
 }"
@@ -303,10 +283,9 @@ exports[`t-call parent is set within t-call with no parentNode 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
 }"
@@ -316,11 +295,10 @@ exports[`t-call parent is set within t-call with no parentNode 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span>lucas</span>\`);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -331,12 +309,11 @@ exports[`t-call recursive t-call binding this -- static t-call 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  const callTemplate_1 = app.getTemplate(\`recursive\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -353,12 +330,11 @@ exports[`t-call recursive t-call binding this -- static t-call 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"recursive\\"
  const callTemplate_1 = app.getTemplate(\`recursive\`);
  let block3 = createBlock(\`<div block-handler-0=\\"click.stop\\"><block-text-1/></div>\`);
-  return function recursive(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let b2;
@@ -382,13 +358,12 @@ exports[`t-call sub components in two t-calls 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`sub\`);
  const callTemplate_2 = app.getTemplate(\`sub\`);
  let block3 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['state'].val===1) {
      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -405,10 +380,9 @@ exports[`t-call sub components in two t-calls 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"sub\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
-  return function sub(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
 }"
@@ -418,11 +392,10 @@ exports[`t-call sub components in two t-calls 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -434,12 +407,11 @@ exports[`t-call t-call in t-foreach and children component 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
-  // Template name: \\"xml_template_1001\\"
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
  const callTemplate_1 = app.getTemplate(\`xml_template_999\`);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(['a','b','c']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -461,10 +433,9 @@ exports[`t-call t-call in t-foreach and children component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
-  return function xml_template_999(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({val: ctx['val']}, key + \`__1\`, node, this, null);
  }
 }"
@@ -474,11 +445,10 @@ exports[`t-call t-call in t-foreach and children component 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -489,10 +459,9 @@ exports[`t-call t-call with t-call-context and subcomponent 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`someTemplate\`);
-  return function xml_template_1000_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = ctx['subctx'];
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -503,11 +472,10 @@ exports[`t-call t-call with t-call-context and subcomponent 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"someTemplate\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"name\\"]);
  const comp2 = app.createComponent(\`Child\`, true, false, false, [\\"name\\"]);
-  return function someTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({name: ctx['aab']}, key + \`__1\`, node, this, null);
    const b3 = comp2({name: ctx['lpe']}, key + \`__2\`, node, this, null);
    return multi([b2, b3]);
@@ -519,9 +487,8 @@ exports[`t-call t-call with t-call-context and subcomponent 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`child\`);
    const b3 = text(ctx['props'].name);
    return multi([b2, b3]);
@@ -533,10 +500,9 @@ exports[`t-call t-call with t-call-context and subcomponent, in dev mode 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`someTemplate\`);
-  return function xml_template_1000_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = ctx['subctx'];
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -547,11 +513,10 @@ exports[`t-call t-call with t-call-context and subcomponent, in dev mode 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"someTemplate\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"name\\"]);
  const comp2 = app.createComponent(\`Child\`, true, false, false, [\\"name\\"]);
-  return function someTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const props1 = {name: ctx['aab']};
    helpers.validateProps(\`Child\`, props1, this);
    const b2 = comp1(props1, key + \`__1\`, node, this, null);
@@ -567,9 +532,8 @@ exports[`t-call t-call with t-call-context and subcomponent, in dev mode 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`child\`);
    const b3 = text(ctx['props'].name);
    return multi([b2, b3]);
@@ -581,10 +545,9 @@ exports[`t-call t-call with t-call-context, simple use 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const callTemplate_1 = app.getTemplate(\`someTemplate\`);
-  return function xml_template_999_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = ctx['subctx'];
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -595,9 +558,8 @@ exports[`t-call t-call with t-call-context, simple use 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"someTemplate\\"
-  return function someTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(ctx['aab']);
    const b3 = text(ctx['lpe']);
    return multi([b2, b3]);
@@ -609,10 +571,9 @@ exports[`t-call t-call-context: ComponentNode is not looked up in the context 1`
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`someTemplate\`);
-  return function xml_template_1000_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = {method:function(){}};
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -624,7 +585,6 @@ exports[`t-call t-call-context: ComponentNode is not looked up in the context 2`
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, isBoundary, withDefault, setContextValue, markRaw } = helpers;
  // Template name: \\"someTemplate\\"
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
  let block2 = createBlock(\`<div block-ref=\\"0\\">outside slot</div>\`);
@@ -642,7 +602,7 @@ exports[`t-call t-call-context: ComponentNode is not looked up in the context 2`
    return multi([b4, b5]);
  }
-  return function someTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`myRef\`), el);
    const b2 = block2([ref1]);
    const ctx1 = capture(ctx);
@@ -657,9 +617,8 @@ exports[`t-call t-call-context: ComponentNode is not looked up in the context 3`
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callSlot(ctx, node, key, 'default', false, {});
  }
 }"
@@ -669,10 +628,9 @@ exports[`t-call t-call-context: slots don't make component available again when
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`template\`);
-  return function xml_template_1000_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = {};
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -684,7 +642,6 @@ exports[`t-call t-call-context: slots don't make component available again when
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, capture, markRaw } = helpers;
  // Template name: \\"template\\"
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
  function slot1(ctx, node, key = \\"\\") {
@@ -708,9 +665,8 @@ exports[`t-call t-call-context: slots don't make component available again when
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callSlot(ctx, node, key, 'default', false, {});
  }
 }"
@@ -720,10 +676,9 @@ exports[`t-call t-call-context: this is not available inside t-call-context 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const callTemplate_1 = app.getTemplate(\`someTemplate\`);
-  return function xml_template_999_Root(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ctx1 = {};
    return callTemplate_1.call(this, ctx1, node, key + \`__1\`);
  }
@@ -734,9 +689,8 @@ exports[`t-call t-call-context: this is not available inside t-call-context 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"someTemplate\\"
-  return function someTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(ctx['this']);
  }
 }"
@@ -4,11 +4,10 @@ exports[`t-call-block simple t-call-block with static text 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = ctx['myBlock']();
    return block1([], [b2]);
  }
@@ -4,12 +4,11 @@ exports[`t-component can switch between dynamic components without the need for
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(null, false, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1001_App(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const Comp1 = ctx['constructor'].components[ctx['state'].child];
    const b2 = toggler(Comp1, comp1({}, (Comp1).name + key + \`__1\`, node, this, Comp1));
    return block1([], [b2]);
@@ -21,11 +20,10 @@ exports[`t-component can switch between dynamic components without the need for
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>child a</span>\`);
-  return function xml_template_999_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -35,11 +33,10 @@ exports[`t-component can switch between dynamic components without the need for
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span>child b</span>\`);
-  return function xml_template_1000_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -49,10 +46,9 @@ exports[`t-component can use dynamic components (the class) if given (with diffe
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(null, false, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['state'].child;
    const Comp1 = ctx['myComponent'];
    return toggler(tKey_1, toggler(Comp1, comp1({}, (Comp1).name + tKey_1 + key + \`__1\`, node, this, Comp1)));
@@ -64,11 +60,10 @@ exports[`t-component can use dynamic components (the class) if given (with diffe
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>child a</span>\`);
-  return function xml_template_999_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -78,11 +73,10 @@ exports[`t-component can use dynamic components (the class) if given (with diffe
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<div>child b</div>\`);
-  return function xml_template_1000_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -92,10 +86,9 @@ exports[`t-component can use dynamic components (the class) if given 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(null, false, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['state'].child;
    const Comp1 = ctx['myComponent'];
    return toggler(tKey_1, toggler(Comp1, comp1({}, (Comp1).name + tKey_1 + key + \`__1\`, node, this, Comp1)));
@@ -107,11 +100,10 @@ exports[`t-component can use dynamic components (the class) if given 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>child a</span>\`);
-  return function xml_template_999_A(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -121,11 +113,10 @@ exports[`t-component can use dynamic components (the class) if given 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  let block1 = createBlock(\`<span>child b</span>\`);
-  return function xml_template_1000_B(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -135,12 +126,11 @@ exports[`t-component modifying a sub widget 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(null, false, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_ParentWidget(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const Comp1 = ctx['Counter'];
    const b2 = toggler(Comp1, comp1({}, (Comp1).name + key + \`__1\`, node, this, Comp1));
    return block1([], [b2]);
@@ -152,11 +142,10 @@ exports[`t-component modifying a sub widget 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><button block-handler-1=\\"click\\">Inc</button></div>\`);
-  return function xml_template_999_Counter(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].counter;
    const v1 = ctx['state'];
    let hdlr1 = [()=>v1.counter++, ctx];
@@ -169,10 +158,9 @@ exports[`t-component switching dynamic component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(null, false, false, false, []);
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const Comp1 = ctx['Child'];
    return toggler(Comp1, comp1({}, (Comp1).name + key + \`__1\`, node, this, Comp1));
  }
@@ -183,11 +171,10 @@ exports[`t-component switching dynamic component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>child a</div>\`);
-  return function xml_template_999_ChildA(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -197,9 +184,8 @@ exports[`t-component switching dynamic component 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
-  return function xml_template_1000_ChildB(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child b\`);
  }
 }"
@@ -209,10 +195,9 @@ exports[`t-component t-component works in simple case 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(null, false, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const Comp1 = ctx['Child'];
    return toggler(Comp1, comp1({}, (Comp1).name + key + \`__1\`, node, this, Comp1));
  }
@@ -223,11 +208,10 @@ exports[`t-component t-component works in simple case 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div>child</div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -5,13 +5,12 @@ exports[`list of components components in a node in a t-foreach  1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"item\\"]);
  let block1 = createBlock(\`<div><ul><block-child-0/></ul></div>\`);
  let block3 = createBlock(\`<li><block-child-0/></li>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['items']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -30,11 +29,10 @@ exports[`list of components components in a node in a t-foreach  2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].item;
    return block1([txt1]);
  }
@@ -46,10 +44,9 @@ exports[`list of components crash on duplicate key in dev mode 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, OwlError, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList([1,2]);;
    const keys1 = new Set();
@@ -71,9 +68,8 @@ exports[`list of components crash on duplicate key in dev mode 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`\`);
  }
 }"
@@ -84,10 +80,9 @@ exports[`list of components crash when using object as keys that serialize to th
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, OwlError, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList([{},{}]);;
    const keys1 = new Set();
@@ -109,9 +104,8 @@ exports[`list of components crash when using object as keys that serialize to th
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`\`);
  }
 }"
@@ -122,13 +116,12 @@ exports[`list of components list of sub components inside other nodes 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`SubComponent\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].blips);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -147,11 +140,10 @@ exports[`list of components list of sub components inside other nodes 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span>asdf</span>\`);
-  return function xml_template_999_SubComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -162,7 +154,6 @@ exports[`list of components order is correct when slots are not of same type 1`]
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
  let block2 = createBlock(\`<div>A</div>\`);
@@ -183,7 +174,7 @@ exports[`list of components order is correct when slots are not of same type 1`]
    return text(\`C\`);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const ctx1 = capture(ctx);
    return comp1({slots: markRaw({'a': {__render: slot1.bind(this), __ctx: ctx1, active: !ctx['state'].active}, 'b': {__render: slot2.bind(this), __ctx: ctx1, active: true}, 'c': {__render: slot3.bind(this), __ctx: ctx1, active: ctx['state'].active}})}, key + \`__1\`, node, this, null);
  }
@@ -195,9 +186,8 @@ exports[`list of components order is correct when slots are not of same type 2`]
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, callSlot, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['slotNames']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -216,12 +206,11 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"blip\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].s);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -249,11 +238,10 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].blip;
    return block1([txt1]);
  }
@@ -265,14 +253,13 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach,
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"row\\",\\"col\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<p><block-child-0/></p>\`);
  let block5 = createBlock(\`<p><block-child-0/></p>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].rows);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -300,11 +287,10 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach,
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].row+'_'+ctx['props'].col;
    return block1([txt1]);
  }
@@ -316,10 +302,9 @@ exports[`list of components simple list 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['state'].elems);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -336,11 +321,10 @@ exports[`list of components simple list 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -352,12 +336,11 @@ exports[`list of components sub components rendered in a loop 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"n\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].numbers);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -375,11 +358,10 @@ exports[`list of components sub components rendered in a loop 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p><block-text-0/></p>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].n;
    return block1([txt1]);
  }
@@ -391,12 +373,11 @@ exports[`list of components sub components with some state rendered in a loop 1`
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].numbers);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -414,11 +395,10 @@ exports[`list of components sub components with some state rendered in a loop 2`
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p><block-text-0/></p>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].n;
    return block1([txt1]);
  }
@@ -430,12 +410,11 @@ exports[`list of components switch component position 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['clist']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -453,11 +432,10 @@ exports[`list of components switch component position 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -469,12 +447,11 @@ exports[`list of components t-foreach with t-component, and update 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(Array(2));;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -493,11 +470,10 @@ exports[`list of components t-foreach with t-component, and update 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['state'].val;
    let txt2 = ctx['props'].val;
    return block1([txt1, txt2]);
@@ -5,12 +5,11 @@ exports[`t-key t-foreach with t-key switch component position 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['clist']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -29,11 +28,10 @@ exports[`t-key t-foreach with t-key switch component position 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -44,10 +42,9 @@ exports[`t-key t-key on Component 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['key'];
    return toggler(tKey_1, comp1({key: ctx['key']}, tKey_1 + key + \`__1\`, node, this, null));
  }
@@ -58,11 +55,10 @@ exports[`t-key t-key on Component 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -73,12 +69,11 @@ exports[`t-key t-key on Component as a function 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['key'];
    const b2 = toggler(tKey_1, comp1({key: ctx['key']}, tKey_1 + key + \`__1\`, node, this, null));
    return block1([], [b2]);
@@ -90,11 +85,10 @@ exports[`t-key t-key on Component as a function 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -105,13 +99,12 @@ exports[`t-key t-key on multiple Components 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  const comp2 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['key1'];
    const b2 = toggler(tKey_1, comp1({key: ctx['key1']}, tKey_1 + key + \`__1\`, node, this, null));
    const tKey_2 = ctx['key2'];
@@ -125,11 +118,10 @@ exports[`t-key t-key on multiple Components 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -141,13 +133,12 @@ exports[`t-key t-key on multiple Components with t-call 1 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`calledTemplate\`);
  const callTemplate_2 = app.getTemplate(\`calledTemplate\`);
  let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -168,10 +159,9 @@ exports[`t-key t-key on multiple Components with t-call 1 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"calledTemplate\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
-  return function calledTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['key'];
    return toggler(tKey_1, comp1({key: ctx['key']}, tKey_1 + key + \`__1\`, node, this, null));
  }
@@ -182,11 +172,10 @@ exports[`t-key t-key on multiple Components with t-call 1 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -197,12 +186,11 @@ exports[`t-key t-key on multiple Components with t-call 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const callTemplate_1 = app.getTemplate(\`calledTemplate\`);
  let block1 = createBlock(\`<span><block-child-0/></span>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
    return block1([], [b2]);
  }
@@ -213,11 +201,10 @@ exports[`t-key t-key on multiple Components with t-call 2 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"calledTemplate\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
  const comp2 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
-  return function calledTemplate(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const tKey_1 = ctx['key1'];
    const b2 = toggler(tKey_1, comp1({key: ctx['key1']}, tKey_1 + key + \`__1\`, node, this, null));
    const tKey_2 = ctx['key2'];
@@ -231,11 +218,10 @@ exports[`t-key t-key on multiple Components with t-call 2 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].key;
    return block1([txt1]);
  }
@@ -5,11 +5,10 @@ exports[`t-model directive .lazy modifier 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"change\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -25,11 +24,10 @@ exports[`t-model directive .number modifier 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'number';
    let prop1 = bExpr1[expr1];
@@ -45,11 +43,10 @@ exports[`t-model directive .trim modifier 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -65,11 +62,10 @@ exports[`t-model directive basic use, on an input 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -85,11 +81,10 @@ exports[`t-model directive basic use, on an input with bracket expression 1`] =
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -105,11 +100,10 @@ exports[`t-model directive basic use, on another key in component 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['some'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -125,11 +119,10 @@ exports[`t-model directive can also define t-on directive on same event, part 1
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\" block-handler-2=\\"input\\"/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -145,11 +138,10 @@ exports[`t-model directive can also define t-on directive on same event, part 2
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input type=\\"radio\\" id=\\"one\\" value=\\"One\\" block-property-0=\\"checked\\" block-handler-1=\\"click\\" block-handler-2=\\"click\\"/><input type=\\"radio\\" id=\\"two\\" value=\\"Two\\" block-property-3=\\"checked\\" block-handler-4=\\"click\\" block-handler-5=\\"click\\"/><input type=\\"radio\\" id=\\"three\\" value=\\"Three\\" block-property-6=\\"checked\\" block-handler-7=\\"click\\" block-handler-8=\\"click\\"/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'choice';
    let prop1 = bExpr1[expr1] === 'One';
@@ -175,11 +167,10 @@ exports[`t-model directive following a scope protecting directive (e.g. t-set) 1
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"admiral\\", 'Bruno');
@@ -197,12 +188,11 @@ exports[`t-model directive in a t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, toNumber, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<input type=\\"checkbox\\" block-property-0=\\"checked\\" block-handler-1=\\"input\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -225,12 +215,11 @@ exports[`t-model directive in a t-foreach, part 2 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, toNumber, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<input block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -254,12 +243,11 @@ exports[`t-model directive in a t-foreach, part 3 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, toNumber, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<input block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['names']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -283,11 +271,10 @@ exports[`t-model directive on a select 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-property-0=\\"value\\" block-handler-1=\\"change\\"><option value=\\"\\">Please select one</option><option value=\\"red\\">Red</option><option value=\\"blue\\">Blue</option></select><span>Choice: <block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'color';
    let prop1 = bExpr1[expr1];
@@ -303,11 +290,10 @@ exports[`t-model directive on a select, initial state 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-property-0=\\"value\\" block-handler-1=\\"change\\"><option value=\\"\\">Please select one</option><option value=\\"red\\">Red</option><option value=\\"blue\\">Blue</option></select></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'color';
    let prop1 = bExpr1[expr1];
@@ -322,11 +308,10 @@ exports[`t-model directive on a sub state key 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'].something;
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -342,11 +327,10 @@ exports[`t-model directive on an input type=radio 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input type=\\"radio\\" id=\\"one\\" value=\\"One\\" block-property-0=\\"checked\\" block-handler-1=\\"click\\"/><input type=\\"radio\\" id=\\"two\\" value=\\"Two\\" block-property-2=\\"checked\\" block-handler-3=\\"click\\"/><span>Choice: <block-text-4/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'choice';
    let prop1 = bExpr1[expr1] === 'One';
@@ -366,11 +350,10 @@ exports[`t-model directive on an input type=radio, with initial value 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input type=\\"radio\\" id=\\"one\\" value=\\"One\\" block-property-0=\\"checked\\" block-handler-1=\\"click\\"/><input type=\\"radio\\" id=\\"two\\" value=\\"Two\\" block-property-2=\\"checked\\" block-handler-3=\\"click\\"/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'choice';
    let prop1 = bExpr1[expr1] === 'One';
@@ -389,11 +372,10 @@ exports[`t-model directive on an input, type=checkbox 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  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 xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    const bExpr1 = ctx['state'];
    const expr1 = 'flag';
@@ -414,11 +396,10 @@ exports[`t-model directive on an textarea 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><textarea block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -434,11 +415,10 @@ exports[`t-model directive t-model is applied before t-on-input 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\" block-handler-2=\\"input\\"/></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -454,11 +434,10 @@ exports[`t-model directive t-model on an input with an undefined value 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<input block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'text';
    let prop1 = bExpr1[expr1];
@@ -473,11 +452,10 @@ exports[`t-model directive t-model on select with static options 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-property-0=\\"value\\" block-handler-1=\\"change\\"><option value=\\"a\\"><block-text-2/></option><option value=\\"b\\"><block-text-3/></option><option value=\\"c\\"><block-text-4/></option></select></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'model';
    let prop1 = bExpr1[expr1];
@@ -490,47 +468,15 @@ exports[`t-model directive t-model on select with static options 1`] = `
 }"
 `;
 exports[`t-model directive t-model with dynamic number values on select options in foreach 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber, prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<select block-handler-0=\\"change\\"><block-child-0/></select>\`);
  let block3 = createBlock(\`<option block-attribute-0=\\"value\\" block-attribute-1=\\"selected\\"><block-text-2/></option>\`);
  return function xml_template_999_Test(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'value';
    const bValue1 = bExpr1[expr1];
    let hdlr1 = [(ev) => { bExpr1[expr1] = toNumber(ev.target.value); }];
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].options);;
    for (let i1 = 0; i1 < l_block2; i1++) {
      ctx[\`o\`] = v_block2[i1];
      const key1 = ctx['o'].value;
      let attr1 = ctx['o'].value;
      let attr2 = bValue1 === ctx['o'].value;
      let txt1 = ctx['o'].value;
      c_block2[i1] = withKey(block3([attr1, attr2, txt1]), key1);
    }
    const b2 = list(c_block2);
    return block1([hdlr1], [b2]);
  }
 }"
 `;
 exports[`t-model directive t-model with dynamic values on select options -- 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-handler-0=\\"change\\"><option block-attribute-1=\\"value\\" block-attribute-2=\\"selected\\"><block-text-3/></option><option block-attribute-4=\\"value\\" block-attribute-5=\\"selected\\"><block-text-6/></option></select></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'model';
    const bValue1 = bExpr1[expr1];
@@ -551,11 +497,10 @@ exports[`t-model directive t-model with dynamic values on select options -- 3 1`
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-handler-0=\\"change\\"><option block-attribute-1=\\"value\\" block-attribute-2=\\"selected\\"><block-text-3/></option><option value=\\"b\\" block-attribute-4=\\"selected\\"><block-text-5/></option></select></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'model';
    const bValue1 = bExpr1[expr1];
@@ -575,11 +520,10 @@ exports[`t-model directive t-model with dynamic values on select options 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-handler-0=\\"change\\"><option block-attribute-1=\\"value\\" block-attribute-2=\\"selected\\"><block-text-3/></option><option block-attribute-4=\\"value\\" block-attribute-5=\\"selected\\"><block-text-6/></option></select></div>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'model';
    const bValue1 = bExpr1[expr1];
@@ -600,12 +544,11 @@ exports[`t-model directive t-model with dynamic values on select options in fore
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber, prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><select block-handler-0=\\"change\\"><block-child-0/></select></div>\`);
  let block3 = createBlock(\`<option block-attribute-0=\\"value\\" block-attribute-1=\\"selected\\"><block-text-2/></option>\`);
-  return function xml_template_999_Test(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'];
    const expr1 = 'model';
    const bValue1 = bExpr1[expr1];
@@ -631,12 +574,11 @@ exports[`t-model directive t-model with radio button group in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, toNumber, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div id=\\"get_data\\" block-handler-0=\\"click\\"><block-child-0/></div>\`);
  let block3 = createBlock(\`<input type=\\"radio\\" name=\\"radio_group\\" block-property-0=\\"value\\" block-attribute-1=\\"id\\" block-property-2=\\"checked\\" block-handler-3=\\"click\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['getData'], ctx];
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['options']);;
@@ -662,13 +604,12 @@ exports[`t-model directive two inputs in a div alternating with a t-if 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
  let block2 = createBlock(\`<input class=\\"a\\" block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
  let block3 = createBlock(\`<input class=\\"b\\" block-property-0=\\"value\\" block-handler-1=\\"input\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['state'].flag) {
      const bExpr1 = ctx['state'];
@@ -694,11 +635,10 @@ exports[`t-model directive with expression having a changing key 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { toNumber } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><input block-property-0=\\"value\\" block-handler-1=\\"input\\"/><span><block-text-2/></span></div>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const bExpr1 = ctx['state'].something;
    const expr1 = ctx['text'].key;
    let prop1 = bExpr1[expr1];
@@ -5,12 +5,11 @@ exports[`t-on t-on expression captured in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div><button block-handler-0=\\"click\\">expr</button></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 0);
@@ -36,12 +35,11 @@ exports[`t-on t-on expression in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">Expr</button></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].values);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -66,12 +64,11 @@ exports[`t-on t-on expression in t-foreach with t-set 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">Expr</button></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"bossa\\", 'nova');
@@ -101,12 +98,11 @@ exports[`t-on t-on method call in t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
  let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">meth call</button></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].values);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -131,13 +127,12 @@ exports[`t-on t-on on component next to t-on on div 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
  let block1 = createBlock(\`<div><block-child-0/><p block-handler-0=\\"click\\">dec</p></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const hdlr1 = [ctx['increment'], ctx];
    const b2 = catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
    let hdlr2 = [ctx['decrement'], ctx];
@@ -150,11 +145,10 @@ exports[`t-on t-on on component next to t-on on div 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button><block-text-0/></button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -166,11 +160,10 @@ exports[`t-on t-on on components 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const hdlr1 = [ctx['increment'], ctx];
    return catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
  }
@@ -181,11 +174,10 @@ exports[`t-on t-on on components 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button><block-text-0/></button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -197,11 +189,10 @@ exports[`t-on t-on on components and t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, createCatcher, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(['John','Raoul','Gérald']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -221,11 +212,10 @@ exports[`t-on t-on on components and t-foreach 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -237,13 +227,12 @@ exports[`t-on t-on on components, variation 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
  let block1 = createBlock(\`<div><span/><block-child-0/><p/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const hdlr1 = [ctx['increment'], ctx];
    const b2 = catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
    return block1([], [b2]);
@@ -255,11 +244,10 @@ exports[`t-on t-on on components, variation 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button><block-text-0/></button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -271,11 +259,10 @@ exports[`t-on t-on on components, with 'prevent' modifier 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click.prevent\\":0});
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const hdlr1 = [\\"prevent\\", ctx['increment'], ctx];
    return catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
  }
@@ -286,11 +273,10 @@ exports[`t-on t-on on components, with 'prevent' modifier 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button><block-text-0/></button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -302,11 +288,10 @@ exports[`t-on t-on on components, with a handler update 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"name\\", ctx['state'].name);
@@ -322,11 +307,10 @@ exports[`t-on t-on on components, with a handler update 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].value;
    return block1([txt1]);
  }
@@ -337,12 +321,11 @@ exports[`t-on t-on on destroyed components 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].flag) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -356,11 +339,10 @@ exports[`t-on t-on on destroyed components 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-handler-0=\\"click\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['onClick'], ctx];
    return block1([hdlr1]);
  }
@@ -372,7 +354,6 @@ exports[`t-on t-on on slot, with 'prevent' modifier 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
  let block1 = createBlock(\`<button>button</button>\`);
@@ -381,7 +362,7 @@ exports[`t-on t-on on slot, with 'prevent' modifier 1`] = `
    return block1();
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx}})}, key + \`__1\`, node, this, null);
  }
 }"
@@ -392,10 +373,9 @@ exports[`t-on t-on on slot, with 'prevent' modifier 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot, createCatcher } = helpers;
  // Template name: \\"xml_template_999\\"
  const catcher1 = createCatcher({\\"click.prevent\\":0});
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const hdlr1 = [\\"prevent\\", ctx['doSomething'], ctx];
    return catcher1(callSlot(ctx, node, key, 'default', false, {}), [hdlr1]);
  }
@@ -407,7 +387,6 @@ exports[`t-on t-on on t-set-slots 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, createCatcher, markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const catcher1 = createCatcher({\\"click\\":0});
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
@@ -422,7 +401,7 @@ exports[`t-on t-on on t-set-slots 1`] = `
    return catcher1(multi([b6, b7]), [hdlr1]);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\` [\`);
    const b3 = text(ctx['state'].count);
    const b4 = text(\`] \`);
@@ -438,9 +417,8 @@ exports[`t-on t-on on t-set-slots 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return callSlot(ctx, node, key, 'myslot', false, {});
  }
 }"
@@ -451,7 +429,6 @@ exports[`t-on t-on on t-slots 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, true, false, []);
  let block1 = createBlock(\`<p>something</p>\`);
@@ -460,7 +437,7 @@ exports[`t-on t-on on t-slots 1`] = `
    return block1();
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx}})}, key + \`__1\`, node, this, null);
  }
 }"
@@ -471,10 +448,9 @@ exports[`t-on t-on on t-slots 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot, createCatcher } = helpers;
  // Template name: \\"xml_template_999\\"
  const catcher1 = createCatcher({\\"click\\":0});
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\` [\`);
    const b3 = text(ctx['state'].count);
    const b4 = text(\`] \`);
@@ -491,13 +467,12 @@ exports[`t-on t-on when first component child is an empty component 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { createCatcher } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"list\\"]);
  const catcher1 = createCatcher({\\"click\\":0});
  let block1 = createBlock(\`<div block-handler-0=\\"click\\"><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['push'], ctx];
    const hdlr2 = [()=>{}, ctx];
    const b2 = catcher1(comp1({list: ctx['list']}, key + \`__1\`, node, this, null), [hdlr2]);
@@ -511,11 +486,10 @@ exports[`t-on t-on when first component child is an empty component 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  let block2 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['props'].list);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -5,14 +5,13 @@ exports[`components in t-out simple list 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, isBoundary, withDefault, LazyValue, safeOutput, withKey } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  function value1(ctx, node, key = \\"\\") {
    return comp1({}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx = Object.create(ctx);
@@ -32,9 +31,8 @@ exports[`components in t-out simple list 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`child\`);
  }
 }"
@@ -4,12 +4,11 @@ exports[`t-props basic use 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, true, []);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1(Object.assign({}, ctx['some'].obj), key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -20,11 +19,10 @@ exports[`t-props basic use 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].a+ctx['props'].b;
    return block1([txt1]);
  }
@@ -35,10 +33,9 @@ exports[`t-props child receives a copy of the t-props object, not the original 1
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, true, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1(Object.assign({}, ctx['childProps']), key + \`__1\`, node, this, null);
  }
 }"
@@ -48,11 +45,10 @@ exports[`t-props child receives a copy of the t-props object, not the original 2
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -62,12 +58,11 @@ exports[`t-props t-props and other props 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Comp\`, true, false, true, [\\"a\\"]);
  let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1(Object.assign({}, ctx['state1'], {a: ctx['a']}), key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -78,11 +73,10 @@ exports[`t-props t-props and other props 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].a;
    let txt2 = ctx['props'].b;
    return block1([txt1, txt2]);
@@ -94,12 +88,11 @@ exports[`t-props t-props only 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Comp\`, true, false, true, []);
  let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1(Object.assign({}, ctx['state']), key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -110,11 +103,10 @@ exports[`t-props t-props only 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].a;
    return block1([txt1]);
  }
@@ -125,12 +117,11 @@ exports[`t-props t-props with props 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, true, [\\"a\\",\\"b\\"]);
  let block1 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1(Object.assign({}, ctx['childProps'], {a: 1,b: 2}), key + \`__1\`, node, this, null);
    return block1([], [b2]);
  }
@@ -141,11 +132,10 @@ exports[`t-props t-props with props 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -5,7 +5,6 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue, capture, markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Childcomp\`, true, true, false, []);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
@@ -17,7 +16,7 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 1`] = `
  return text('');
  }
-  return function xml_template_1000_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 'source');
@@ -35,11 +34,10 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function xml_template_999_Childcomp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -55,7 +53,6 @@ exports[`t-set slots with a t-set with a component in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, isBoundary, withDefault, LazyValue, safeOutput, markRaw } = helpers;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`C\`, true, false, false, []);
  const comp2 = app.createComponent(\`Child\`, true, true, false, []);
@@ -72,7 +69,7 @@ exports[`t-set slots with a t-set with a component in body 1`] = `
    return comp1({}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1001_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const ctx1 = capture(ctx);
    return comp2({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx1}})}, key + \`__2\`, node, this, null);
  }
@@ -84,9 +81,8 @@ exports[`t-set slots with a t-set with a component in body 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_1000\\"
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`Child \`);
    const b3 = callSlot(ctx, node, key, 'default', false, {});
    return multi([b2, b3]);
@@ -98,9 +94,8 @@ exports[`t-set slots with a t-set with a component in body 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_C(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`C\`);
  }
 }"
@@ -111,7 +106,6 @@ exports[`t-set slots with an t-set with a component in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, isBoundary, withDefault, LazyValue, safeOutput, markRaw } = helpers;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`Blorg\`, true, true, false, []);
@@ -132,7 +126,7 @@ exports[`t-set slots with an t-set with a component in body 1`] = `
    return multi([b3, b4]);
  }
-  return function xml_template_1001_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const ctx1 = capture(ctx);
    return comp2({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx1}})}, key + \`__2\`, node, this, null);
  }
@@ -144,9 +138,8 @@ exports[`t-set slots with an t-set with a component in body 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_1000\\"
-  return function xml_template_1000_Blorg(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`Blorg \`);
    const b3 = callSlot(ctx, node, key, 'default', false, {});
    return multi([b2, b3]);
@@ -158,9 +151,8 @@ exports[`t-set slots with an t-set with a component in body 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`Child\`);
  }
 }"
@@ -171,7 +163,6 @@ exports[`t-set slots with an unused t-set with a component in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { capture, isBoundary, withDefault, LazyValue, markRaw } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(\`Child\`, true, true, false, []);
@@ -186,7 +177,7 @@ exports[`t-set slots with an unused t-set with a component in body 1`] = `
    return comp1({}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const ctx1 = capture(ctx);
    return comp2({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx1}})}, key + \`__2\`, node, this, null);
  }
@@ -198,9 +189,8 @@ exports[`t-set slots with an unused t-set with a component in body 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = text(\`Child \`);
    const b3 = callSlot(ctx, node, key, 'default', false, {});
    return multi([b2, b3]);
@@ -213,11 +203,10 @@ exports[`t-set t-set can't alter component even if key in component 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><p><block-text-0/></p><p><block-text-1/></p></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -233,11 +222,10 @@ exports[`t-set t-set can't alter component if key not in component 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><p><block-text-0/></p><p><block-text-1/></p></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -253,11 +241,10 @@ exports[`t-set t-set in t-if 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><p><block-text-0/></p></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"flag\\", ctx['state'].flag);
@@ -279,12 +266,11 @@ exports[`t-set t-set not altered by child comp 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Childcomp\`, true, false, false, []);
  let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
-  return function xml_template_1000_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 'source');
@@ -301,11 +287,10 @@ exports[`t-set t-set not altered by child comp 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
-  return function xml_template_999_Childcomp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    let txt1 = ctx['iter'];
@@ -321,11 +306,10 @@ exports[`t-set t-set outside modified in t-if 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, setContextValue } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><p><block-text-0/></p></div>\`);
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    setContextValue(ctx, \\"iter\\", 0);
@@ -348,7 +332,6 @@ exports[`t-set t-set with a component in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
@@ -357,7 +340,7 @@ exports[`t-set t-set with a component in body 1`] = `
    return comp1({}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
@@ -371,9 +354,8 @@ exports[`t-set t-set with a component in body 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return text(\`Child\`);
  }
 }"
@@ -384,7 +366,6 @@ exports[`t-set t-set with something in body 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
  let block2 = createBlock(\`<p>coucou</p>\`);
@@ -393,7 +374,7 @@ exports[`t-set t-set with something in body 1`] = `
    return block2();
  }
-  return function xml_template_999_Comp(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    ctx[isBoundary] = 1
    ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
@@ -115,7 +115,13 @@ test("destroying/recreating a subwidget with different props (if start is not ov
  await nextMicroTick();
  expect(n).toBe(2);
-  expect(["W:willRender", "Child:setup", "Child:willStart", "W:rendered"]).toBeLogged();
+  expect([
    "Child:willDestroy",
    "W:willRender",
    "Child:setup",
    "Child:willStart",
    "W:rendered",
  ]).toBeLogged();
  def.resolve();
  await nextTick();
@@ -124,7 +130,6 @@ test("destroying/recreating a subwidget with different props (if start is not ov
  expect([
    "Child:willRender",
    "Child:rendered",
    "Child:willDestroy",
    "W:willPatch",
    "Child:mounted",
    "W:patched",
@@ -173,13 +178,13 @@ test("destroying/recreating a subcomponent, other scenario", async () => {
    "Child:setup",
    "Child:willStart",
    "Parent:rendered",
    "Child:willDestroy",
    "Parent:willRender",
    "Child:setup",
    "Child:willStart",
    "Parent:rendered",
    "Child:willRender",
    "Child:rendered",
    "Child:willDestroy",
    "Parent:willPatch",
    "Child:mounted",
    "Parent:patched",
@@ -246,13 +251,13 @@ test("creating two async components, scenario 1", async () => {
  await nextTick();
  expect(fixture.innerHTML).toBe("");
  expect([
    "ChildA:willDestroy",
    "Parent:willRender",
    "ChildA:setup",
    "ChildA:willStart",
    "ChildB:setup",
    "ChildB:willStart",
    "Parent:rendered",
    "ChildA:willDestroy",
  ]).toBeLogged();
  defB.resolve();
@@ -698,13 +703,13 @@ test("rendering component again in next microtick", async () => {
    "Child:setup",
    "Child:willStart",
    "Parent:rendered",
    "Child:willDestroy",
    "Parent:willRender",
    "Child:setup",
    "Child:willStart",
    "Parent:rendered",
    "Child:willRender",
    "Child:rendered",
    "Child:willDestroy",
    "Parent:willPatch",
    "Child:mounted",
    "Parent:patched",
@@ -1727,9 +1732,9 @@ test("concurrent renderings scenario 10", async () => {
  expect(fixture.innerHTML).toBe("<div><p></p></div>");
  expect([
    "ComponentA:willRender",
    "ComponentC:willDestroy",
    "ComponentB:willUpdateProps",
    "ComponentA:rendered",
    "ComponentC:willDestroy",
  ]).toBeLogged();
  defB.resolve();
@@ -2277,6 +2282,7 @@ test("concurrent renderings scenario 16", async () => {
    "D:setup",
    "D:willStart",
    "C:rendered",
    "D:willDestroy",
    "B:willRender",
    "C:willUpdateProps",
    "B:rendered",
@@ -2284,7 +2290,6 @@ test("concurrent renderings scenario 16", async () => {
    "D:setup",
    "D:willStart",
    "C:rendered",
    "D:willDestroy",
  ]).toBeLogged();
  // at this point, C rendering is still pending, and nothing should have been
@@ -2992,11 +2997,11 @@ test("t-key on dom node having a component", async () => {
  expect(fixture.innerHTML).toBe("<div>3</div>");
  expect([
    "Child (2):willDestroy",
    "Child (3):setup",
    "Child (3):willStart",
    "Child (3):willRender",
    "Child (3):rendered",
    "Child (2):willDestroy",
    "Child (1):willUnmount",
    "Child (1):willDestroy",
    "Child (3):mounted",
@@ -3050,11 +3055,11 @@ test("t-key on dynamic async component (toggler is never patched)", async () =>
  expect(fixture.innerHTML).toBe("<div>3</div>");
  expect([
    "Child (2):willDestroy",
    "Child (3):setup",
    "Child (3):willStart",
    "Child (3):willRender",
    "Child (3):rendered",
    "Child (2):willDestroy",
    "Child (1):willUnmount",
    "Child (1):willDestroy",
    "Child (3):mounted",
@@ -3109,11 +3114,11 @@ test("t-foreach with dynamic async component", async () => {
  expect(fixture.innerHTML).toBe("<div>3</div>");
  expect([
    "Child (2):willDestroy",
    "Child (3):setup",
    "Child (3):willStart",
    "Child (3):willRender",
    "Child (3):rendered",
    "Child (2):willDestroy",
    "Child (1):willUnmount",
    "Child (1):willDestroy",
    "Child (3):mounted",
@@ -3796,7 +3801,7 @@ test("destroyed component causes other soon to be destroyed component to rerende
    static template = xml`<t t-esc="state.val + props.value"/>`;
    state = useState({ val: 0 });
    setup() {
-      c = c || this;
+      c = this;
      useLogLifecycle();
    }
  }
@@ -3841,6 +3846,8 @@ test("destroyed component causes other soon to be destroyed component to rerende
  parent.state.valueB = 2;
  await nextTick();
  expect([
    "B:willDestroy",
    "C:willDestroy",
    "A:willRender",
    "B:setup",
    "B:willStart",
@@ -3851,8 +3858,6 @@ test("destroyed component causes other soon to be destroyed component to rerende
    "B:rendered",
    "C:willRender",
    "C:rendered",
    "B:willDestroy",
    "C:willDestroy",
    "A:willPatch",
    "C:mounted",
    "B:mounted",
@@ -4195,116 +4200,6 @@ test("delayed render is not cancelled by upcoming render", async () => {
  ]).toBeLogged();
 });
 test("components are not destroyed between animation frame", async () => {
  const def = makeDeferred();
  class C extends Component {
    static template = xml`C`;
    setup() {
      useLogLifecycle();
    }
  }
  class B extends Component {
    static template = xml`B<C/>`;
    static components = { C };
    setup() {
      useLogLifecycle();
      onWillStart(() => {
        return def;
      });
    }
  }
  class A extends Component {
    static template = xml`A<B t-if="state.flag"/>`;
    static components = { B };
    state = useState({ flag: false });
    setup() {
      useLogLifecycle();
    }
  }
  const a = await mount(A, fixture);
  expect(fixture.innerHTML).toBe("A");
  expect(["A:setup", "A:willStart", "A:willRender", "A:rendered", "A:mounted"]).toBeLogged();
  // turn the flag on, this will render A and stops at B because of def
  a.state.flag = true;
  await nextTick();
  expect(["A:willRender", "B:setup", "B:willStart", "A:rendered"]).toBeLogged();
  // force a render of A
  //  => owl will need to create a new B component
  //  => initial B component will be cancelled
  a.render();
  await nextMicroTick();
  expect([
    // note that B is not destroyed here. It is cancelled instead
    "A:willRender",
    "B:setup",
    "B:willStart",
    "A:rendered",
  ]).toBeLogged();
  // resolve def, so B render is unblocked
  def.resolve();
  await nextTick();
  expect([
    "B:willRender",
    "C:setup",
    "C:willStart",
    "B:rendered",
    "C:willRender",
    "C:rendered",
    // animation frame callback starts here
    "B:willDestroy", // B is destroyed here
    "A:willPatch",
    "C:mounted",
    "B:mounted",
    "A:patched",
  ]).toBeLogged();
 });
 test("component destroyed just after render", async () => {
  let stateB: any;
  class B extends Component {
    static template = xml`B<t t-esc="state.value"/>`;
    state = useState({ value: 1 });
    setup() {
      stateB = this.state;
      useLogLifecycle();
    }
  }
  class A extends Component {
    static template = xml`<B/>`;
    static components = { B };
    setup() {
      useLogLifecycle();
    }
  }
  const a = await mount(A, fixture);
  expect(fixture.innerHTML).toBe("B1");
  expect([
    "A:setup",
    "A:willStart",
    "A:willRender",
    "B:setup",
    "B:willStart",
    "A:rendered",
    "B:willRender",
    "B:rendered",
    "B:mounted",
    "A:mounted",
  ]).toBeLogged();
  stateB!.value++; // force a render of B
  await nextMicroTick(); // wait for B render to actually start
  a.__owl__.app.destroy();
  expect(["A:willUnmount", "B:willUnmount", "B:willDestroy", "A:willDestroy"]).toBeLogged();
  await nextTick();
  // check that B was not rendered after being destroyed
  expect([]).toBeLogged();
 });
 //   test.skip("components with shouldUpdate=false", async () => {
 //     const state = { p: 1, cc: 10 };
@@ -143,68 +143,6 @@ describe("basics", () => {
    );
  });
  test("display a nice error if the root component template fails to compile", async () => {
    // This is a special case: mount throws synchronously and we don't have any
    // node which can handle the error, hence the different structure of this test
    class Comp extends Component {
      static template = xml`<div t-att-class="a b">test</div>`;
    }
    const app = new App(Comp);
    let error: Error;
    try {
      await app.mount(fixture);
    } catch (e) {
      error = e as Error;
    }
    const expectedErrorMessage = `Failed to compile template "xml_template_999": Unexpected identifier
 generated code:
 function(app, bdom, helpers) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: "xml_template_999"
  let block1 = createBlock(\`<div block-attribute-0="class">test</div>\`);
  return function xml_template_999_Comp(ctx, node, key = "") {
    let attr1 = ctx['a']ctx['b'];
    return block1([attr1]);
  }
 }`;
    expect(error!).toBeDefined();
    expect(error!.message).toBe(expectedErrorMessage);
  });
  test("display a nice error if a non-root component template fails to compile", async () => {
    class Child extends Component {
      static template = xml`<div t-att-class="a b">test</div>`;
    }
    class Parent extends Component {
      static components = { Child };
      static template = xml`<Child/>`;
    }
    const expectedErrorMessage = `Failed to compile template "xml_template_999": Unexpected identifier
 generated code:
 function(app, bdom, helpers) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: "xml_template_999"
  let block1 = createBlock(\`<div block-attribute-0="class">test</div>\`);
  return function xml_template_999_Child(ctx, node, key = "") {
    let attr1 = ctx['a']ctx['b'];
    return block1([attr1]);
  }
 }`;
    const app = new App(Parent as typeof Component);
    let error: Error;
    const mountProm = app.mount(fixture).catch((e: Error) => (error = e));
    await expect(nextAppError(app)).resolves.toThrow(expectedErrorMessage);
    await mountProm;
    expect(error!).toBeDefined();
    expect(error!.message).toBe(expectedErrorMessage);
  });
  test("simple catchError", async () => {
    class Boom extends Component {
      static template = xml`<div t-esc="a.b.c"/>`;
@@ -1506,7 +1444,6 @@ describe("can catch errors", () => {
      "Parent:willPatch",
      "Child:willUnmount",
      "Child:willDestroy",
      "Parent:patched",
      "Parent:willRender",
      "Parent:rendered",
      "Parent:willPatch",
@@ -1569,15 +1506,12 @@ describe("can catch errors", () => {
    parent.state.hasChild = false;
    await nextTick();
    expect([
      "Parent:willRender",
      "Parent:rendered",
      "Child:willDestroy",
      "Parent:willRender",
      "Parent:rendered",
      "Parent:willPatch",
      "Parent:patched",
    ]).toBeLogged();
    expect(fixture.innerHTML).toBe("1");
    await nextTick();
    expect(["Parent:willPatch", "Parent:patched"]).toBeLogged();
    expect(fixture.innerHTML).toBe("2");
  });
 });
@@ -626,39 +626,6 @@ describe("t-model directive", () => {
    expect(fixture.querySelector("select")!.value).toEqual("b");
  });
  test("t-model with dynamic number values on select options in foreach", async () => {
    class Test extends Component {
      static template = xml`
          <select t-model.number="state.value">
            <t t-foreach="state.options" t-as="o" t-key="o.value">
                <option t-att-value="o.value" t-esc="o.value"/>
            </t>
          </select>
      `;
      state: any;
      setup() {
        this.state = useState({
          value: 2,
          options: [{ value: 1 }, { value: 2 }, { value: 3 }],
        });
      }
    }
    const comp = await mount(Test, fixture);
    // check that we have a value of 2 selected
    expect(fixture.querySelector("select")!.value).toEqual("2");
    expect(comp.state.value).toBe(2);
    // emulate a click on the option=3 element
    fixture.querySelectorAll("option")[2].selected = true;
    fixture.querySelector("select")!.dispatchEvent(new Event("change"));
    await nextTick();
    // check that we have now selected the number 3 (and not the string)
    expect(fixture.querySelector("select")!.value).toEqual("3");
    expect(comp.state.value).toBe(3);
  });
  test("t-model is applied before t-on-input", async () => {
    expect.assertions(3);
    class SomeComponent extends Component {
@@ -128,8 +128,8 @@ export function snapshotEverything() {
  });
  const originalCompileTemplate = TemplateSet.prototype._compileTemplate;
-  TemplateSet.prototype._compileTemplate = function (name: string, template: string | Element, alias?: string) {
+  TemplateSet.prototype._compileTemplate = function (name: string, template: string | Element) {
-    const fn = originalCompileTemplate.call(this, name, template, alias);
+    const fn = originalCompileTemplate.call(this, "", template);
    if (!globalTemplateNames.has(name)) {
      expect(fn.toString()).toMatchSnapshot();
    }
@@ -5,7 +5,6 @@ exports[`Portal Add and remove portals 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -15,7 +14,7 @@ exports[`Portal Add and remove portals 1`] = `
    return multi([b3, b4]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['portalIds']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -34,7 +33,6 @@ exports[`Portal Add and remove portals on div 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -45,7 +43,7 @@ exports[`Portal Add and remove portals on div 1`] = `
    return block2([txt1]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['portalIds']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -64,7 +62,6 @@ exports[`Portal Add and remove portals with t-foreach 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -76,7 +73,7 @@ exports[`Portal Add and remove portals with t-foreach 1`] = `
    return multi([b4, b5]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['portalIds']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -97,7 +94,6 @@ exports[`Portal Add and remove portals with t-foreach and destroy 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -109,7 +105,7 @@ exports[`Portal Add and remove portals with t-foreach and destroy 1`] = `
    return multi([b4, b5]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['portalIds']);;
    for (let i1 = 0; i1 < l_block1; i1++) {
@@ -130,7 +126,6 @@ exports[`Portal Add and remove portals with t-foreach inside div 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -143,7 +138,7 @@ exports[`Portal Add and remove portals with t-foreach inside div 1`] = `
    return multi([b5, b6]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['portalIds']);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -164,12 +159,11 @@ exports[`Portal Child and Portal 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block3 = createBlock(\`<div class=\\"portal\\"/>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = comp1({}, key + \`__1\`, node, this, null);
    const b3 = block3();
    return multi([b2, b3]);
@@ -181,7 +175,6 @@ exports[`Portal Child and Portal 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -192,7 +185,7 @@ exports[`Portal Child and Portal 2`] = `
    return block3();
  }
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b4 = comp1({target: '.portal',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return multi([b2, b4]);
@@ -205,7 +198,6 @@ exports[`Portal Portal composed with t-slot 1`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { markRaw } = helpers;
  // Template name: \\"xml_template_1001\\"
  const comp1 = app.createComponent(\`Child2\`, true, false, false, [\\"customHandler\\"]);
  const comp2 = app.createComponent(\`Child\`, true, true, false, []);
@@ -215,7 +207,7 @@ exports[`Portal Portal composed with t-slot 1`] = `
    return comp1({customHandler: ctx['_handled']}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1001_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp2({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx}})}, key + \`__2\`, node, this, null);
    return block1([], [b3]);
  }
@@ -227,7 +219,6 @@ exports[`Portal Portal composed with t-slot 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { callSlot } = helpers;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -235,7 +226,7 @@ exports[`Portal Portal composed with t-slot 2`] = `
    return callSlot(ctx, node, key, 'default', false, {});
  }
-  return function xml_template_1000_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
  }
 }"
@@ -245,11 +236,10 @@ exports[`Portal Portal composed with t-slot 3`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div block-handler-0=\\"custom\\"><span id=\\"childSpan\\">child2</span></div>\`);
-  return function xml_template_999_Child2(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['onCustom'], ctx];
    return block1([hdlr1]);
  }
@@ -260,7 +250,6 @@ exports[`Portal basic use of portal 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -271,7 +260,7 @@ exports[`Portal basic use of portal 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -282,7 +271,6 @@ exports[`Portal basic use of portal in dev mode 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -293,7 +281,7 @@ exports[`Portal basic use of portal in dev mode 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -304,7 +292,6 @@ exports[`Portal basic use of portal on div 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -315,7 +302,7 @@ exports[`Portal basic use of portal on div 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -326,7 +313,6 @@ exports[`Portal basic use of portal, variation 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -337,7 +323,7 @@ exports[`Portal basic use of portal, variation 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: ctx['target'],slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -348,7 +334,6 @@ exports[`Portal conditional use of Portal (with sub Component) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -359,7 +344,7 @@ exports[`Portal conditional use of Portal (with sub Component) 1`] = `
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b4;
    b2 = block2();
    if (ctx['state'].hasPortal) {
@@ -374,11 +359,10 @@ exports[`Portal conditional use of Portal (with sub Component) 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<p><block-text-0/></p>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -389,7 +373,6 @@ exports[`Portal conditional use of Portal 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -400,7 +383,7 @@ exports[`Portal conditional use of Portal 1`] = `
    return block3();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b4;
    b2 = block2();
    if (ctx['state'].hasPortal) {
@@ -415,10 +398,9 @@ exports[`Portal conditional use of Portal with child and div 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasPortal) {
      b2 = comp1({}, key + \`__1\`, node, this, null);
@@ -433,7 +415,6 @@ exports[`Portal conditional use of Portal with child and div 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -444,7 +425,7 @@ exports[`Portal conditional use of Portal with child and div 2`] = `
    return block3();
  }
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    ctx = Object.create(ctx);
    const [k_block2, v_block2, l_block2, c_block2] = prepareList([1]);;
    for (let i1 = 0; i1 < l_block2; i1++) {
@@ -463,12 +444,11 @@ exports[`Portal conditional use of Portal with child and div, variation 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block2 = createBlock(\`<div><block-child-0/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasPortal) {
      const b3 = comp1({}, key + \`__1\`, node, this, null);
@@ -484,7 +464,6 @@ exports[`Portal conditional use of Portal with child and div, variation 2`] = `
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  let { prepareList, capture, withKey } = helpers;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -495,7 +474,7 @@ exports[`Portal conditional use of Portal with child and div, variation 2`] = `
    return block4();
  }
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    ctx = Object.create(ctx);
    const [k_block3, v_block3, l_block3, c_block3] = prepareList([1]);;
@@ -515,7 +494,6 @@ exports[`Portal conditional use of Portal with div 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -526,7 +504,7 @@ exports[`Portal conditional use of Portal with div 1`] = `
    return block3();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2;
    if (ctx['state'].hasPortal) {
      const b4 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
@@ -541,7 +519,6 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 1`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -552,7 +529,7 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 1`]
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b3;
    if (ctx['state'].hasChild) {
      b3 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
@@ -566,11 +543,10 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 2`]
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -581,12 +557,11 @@ exports[`Portal portal and Child 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  let block2 = createBlock(\`<div class=\\"portal\\"/>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b3 = comp1({}, key + \`__1\`, node, this, null);
    return multi([b2, b3]);
@@ -598,7 +573,6 @@ exports[`Portal portal and Child 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -609,7 +583,7 @@ exports[`Portal portal and Child 2`] = `
    return block3();
  }
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b4 = comp1({target: '.portal',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return multi([b2, b4]);
@@ -621,7 +595,6 @@ exports[`Portal portal could have dynamically no content 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -637,7 +610,7 @@ exports[`Portal portal could have dynamically no content 1`] = `
    return multi([b3]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b4 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b4]);
  }
@@ -648,7 +621,6 @@ exports[`Portal portal destroys on crash 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"error\\"]);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -659,7 +631,7 @@ exports[`Portal portal destroys on crash 1`] = `
    return comp1({error: ctx['state'].error}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -670,11 +642,10 @@ exports[`Portal portal destroys on crash 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].error&&ctx['this'].will.crash;
    return block1([txt1]);
  }
@@ -685,7 +656,6 @@ exports[`Portal portal with child and props 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -696,7 +666,7 @@ exports[`Portal portal with child and props 1`] = `
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -707,11 +677,10 @@ exports[`Portal portal with child and props 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<span><block-text-0/></span>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let txt1 = ctx['props'].val;
    return block1([txt1]);
  }
@@ -722,7 +691,6 @@ exports[`Portal portal with dynamic body 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -741,7 +709,7 @@ exports[`Portal portal with dynamic body 1`] = `
    return multi([b3, b4]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b5 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b5]);
  }
@@ -752,7 +720,6 @@ exports[`Portal portal with many children 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -766,7 +733,7 @@ exports[`Portal portal with many children 1`] = `
    return multi([b3, b4]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b5 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b5]);
  }
@@ -777,7 +744,6 @@ exports[`Portal portal with no content 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -791,7 +757,7 @@ exports[`Portal portal with no content 1`] = `
    return multi([b3]);
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b4 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b4]);
  }
@@ -802,7 +768,6 @@ exports[`Portal portal with only text as content 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -812,7 +777,7 @@ exports[`Portal portal with only text as content 1`] = `
    return text('only text');
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -823,7 +788,6 @@ exports[`Portal portal with target not in dom 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -834,7 +798,7 @@ exports[`Portal portal with target not in dom 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#does-not-exist',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -845,7 +809,6 @@ exports[`Portal portal's parent's env is not polluted 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, []);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -856,7 +819,7 @@ exports[`Portal portal's parent's env is not polluted 1`] = `
    return comp1({}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -867,11 +830,10 @@ exports[`Portal portal's parent's env is not polluted 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button>child</button>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -881,12 +843,11 @@ exports[`Portal simple catchError with portal 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const comp1 = app.createComponent(\`Boom\`, true, false, false, []);
  let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let b2,b3;
    if (ctx['error']) {
      b2 = text(\`Error\`);
@@ -902,7 +863,6 @@ exports[`Portal simple catchError with portal 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -914,7 +874,7 @@ exports[`Portal simple catchError with portal 2`] = `
    return block2([txt1]);
  }
-  return function xml_template_999_Boom(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -925,7 +885,6 @@ exports[`Portal with target in template (after portal) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -936,7 +895,7 @@ exports[`Portal with target in template (after portal) 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#local-target',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -947,7 +906,6 @@ exports[`Portal with target in template (before portal) 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -958,7 +916,7 @@ exports[`Portal with target in template (before portal) 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: '#local-target',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -969,7 +927,6 @@ exports[`Portal: Props validation target must be a valid selector 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -980,7 +937,7 @@ exports[`Portal: Props validation target must be a valid selector 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: ' ',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -991,7 +948,6 @@ exports[`Portal: Props validation target must be a valid selector 2 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
@@ -1002,7 +958,7 @@ exports[`Portal: Props validation target must be a valid selector 2 1`] = `
    return block2();
  }
-  return function xml_template_999_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp1({target: 'aa',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -1013,7 +969,6 @@ exports[`Portal: UI/UX focus is kept across re-renders 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_1000\\"
  const Portal = app.Portal;
  const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
  const comp2 = app.createComponent(null, false, true, false, false);
@@ -1024,7 +979,7 @@ exports[`Portal: UI/UX focus is kept across re-renders 1`] = `
    return comp1({val: ctx['state'].val}, key + \`__1\`, node, this, null);
  }
-  return function xml_template_1000_Parent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    const b3 = comp2({target: '#outside',slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__2\`, node, ctx, Portal);
    return block1([], [b3]);
  }
@@ -1035,13 +990,35 @@ exports[`Portal: UI/UX focus is kept across re-renders 2`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<input id=\\"target-me\\" block-attribute-0=\\"placeholder\\"/>\`);
-  return function xml_template_999_Child(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let attr1 = ctx['props'].val;
    return block1([attr1]);
  }
 }"
 `;
 exports[`portal .closest suffix basic use of .suffix 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  const Portal = app.Portal;
  const comp1 = app.createComponent(null, false, true, false, false);
  let block2 = createBlock(\`<p class=\\"target\\">far target</p>\`);
  let block3 = createBlock(\`<div><p class=\\"target\\">close target</p><block-child-0/></div>\`);
  function slot1(ctx, node, key = \\"\\") {
    return text(\`portal content\`);
  }
  return function template(ctx, node, key = \\"\\") {
    const b2 = block2();
    const b5 = comp1({target: '.target',isClosest: true,slots: {'default': {__render: slot1.bind(this), __ctx: ctx}}}, key + \`__1\`, node, ctx, Portal);
    const b3 = block3([], [b5]);
    return multi([b2, b3]);
  }
 }"
 `;
@@ -988,7 +988,7 @@ describe("Portal: Props validation", () => {
      error = e as Error;
    }
    expect(error!).toBeDefined();
-    expect(error!.message).toContain(`Unexpected token ','`);
+    expect(error!.message).toBe(`Unexpected token ','`);
  });
  test("target must be a valid selector", async () => {
@@ -1028,3 +1028,21 @@ describe("Portal: Props validation", () => {
    expect(error!.message).toBe(`invalid portal target`);
  });
 });
 describe("portal .closest suffix", () => {
  test("basic use of .suffix", async () => {
    class Parent extends Component {
      static template = xml`
        <p class="target">far target</p>
        <div>
          <p class="target">close target</p>
          <t t-portal.closest="'.target'">portal content</t>
        </div>`;
    }
    await mount(Parent, fixture);
    expect(fixture.innerHTML).toBe(
      '<p class="target">far target</p><div><p class="target">close targetportal content</p></div>'
    );
  });
 });
@@ -4,11 +4,10 @@ exports[`shadow_dom can bind event handler 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<button block-handler-0=\\"click\\">Click</button>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let hdlr1 = [ctx['add'], ctx];
    return block1([hdlr1]);
  }
@@ -19,11 +18,10 @@ exports[`shadow_dom can mount app 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div class=\\"my-div\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    return block1();
  }
 }"
@@ -33,11 +31,10 @@ exports[`shadow_dom useRef hook 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
  let { text, createBlock, list, multi, html, toggler, comment } = bdom;
  // Template name: \\"xml_template_999\\"
  let block1 = createBlock(\`<div class=\\"my-div\\" block-ref=\\"0\\"/>\`);
-  return function xml_template_999_SomeComponent(ctx, node, key = \\"\\") {
+  return function template(ctx, node, key = \\"\\") {
    let ref1 = (el) => this.__owl__.setRef((\`refName\`), el);
    return block1([ref1]);
  }
@@ -1,6 +1,6 @@
 {
  "name": "Owl devtools",
-  "version": "1.1.1",
+  "version": "1.0",
  "manifest_version": 3,
  "description": "Chrome devtools extension for Odoo Owl framework",
  "icons": {
@@ -1,10 +1,11 @@
 const { Component, useRef, useEffect } = owl;
 import { useStore } from "../../../store/store";
 import { ObjectTreeElement } from "./object_tree_element/object_tree_element";
 import { Subscriptions } from "./subscriptions/subscriptions";
 export class DetailsWindow extends Component {
  static template = "devtools.DetailsWindow";
-  static components = { ObjectTreeElement };
+  static components = { ObjectTreeElement, Subscriptions };
  setup() {
    this.store = useStore();
    this.contextMenu = useRef("contextmenu");
@@ -53,11 +53,7 @@
          </div>
          <i title="Store observed states as global variable in the console" class="fa fa-bug utility-icon p-1" t-on-click.stop="() => this.store.logObjectInConsole([...this.store.activeComponent.path, {type: 'item', value: 'subscriptions'}])"></i>
        </div>
-        <div t-if="store.activeComponent.subscriptions.toggled" id="subscriptionsPanel">
+        <Subscriptions t-if="store.activeComponent.subscriptions.toggled"/>
          <t t-foreach="store.activeComponent.subscriptions.children" t-as="subscription" t-key="subscription_index">
            <ObjectTreeElement object="subscription.target"/>
          </t>
        </div>
      </div>
      <div t-if="store.activeComponent.instance.children.length > 0"  id="instance" class="details-panel ps-2 py-1">
        <div class="d-flex mb-2">
@@ -76,7 +72,7 @@
        </t>
      </div>
    </div>
-    <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-ref="contextmenu">
+    <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="contextmenu">
      <ul class="my-1">
        <li t-on-click.stop="() => this.store.inspectComponent('source', store.activeComponent.path)" class="custom-menu-item py-1 px-4">Inspect source code</li>
        <t t-if="store.activeComponent.path.length !== 1">
@@ -41,22 +41,23 @@ export class ObjectTreeElement extends Component {
    return JSON.stringify(this.props.object.path);
  }
-  get keyChanges() {
+  get objectName() {
-    return this.props.object.keys?.includes("Symbol(Key changes)");
+    return this.props.object.name;
  }
-  classFor(object) {
+  get objectLineClass() {
    // Prototype items will be dyed down to appear less important
-    if (object.path.some((item) => item?.type === "prototype") && !object.keepLit) {
+    if (this.pathAsString.includes('{"type":"prototype",')) {
-      return "attenuate";
+      return { attenuate: true };
    }
    // Same for subscription items which are not present in the keys while the keys will be bold
-    if (object.objectType === "subscription" && object.depth > 0) {
+    if (this.props.object.objectType === "subscription" && this.props.object.depth > 0) {
-      if (this.props.object.keys?.includes(object.name.toString())) {
+      if (this.props.keys.includes(this.props.object.name.toString())) {
-        return "fw-bolder";
+        return { "fw-bolder": true };
      }
-      return "attenuate";
+      return { attenuate: true };
    }
    return {};
  }
  get objectPadding() {
@@ -2,7 +2,7 @@
 <templates xml:space="preserve">
  <t t-name="devtools.ObjectTreeElement" owl="1">
    <div class="m-0 p-0 text-nowrap w-100 object-line"
-      t-att-class="props.class"
+      t-att-class="objectLineClass" 
      t-on-click.stop="() => this.store.toggleObjectTreeElementsDisplay(this.props.object)" 
      t-on-contextmenu.prevent="openMenu" 
    >
@@ -11,7 +11,7 @@
          t-att-class="{'fa-caret-right': !props.object.toggled, 'fa-caret-down': props.object.toggled}"
          t-attf-style="visibility: {{props.object.hasChildren ? '' : 'hidden'}};"
        />
-        <t t-esc="props.object.name"/>
+        <t t-esc="objectName"/>
        <t t-if="props.object.content.length > 0">: </t> 
        <t t-if="props.object.contentType == 'getter'">
          <span class="getter-content object-content" t-att-class="objectLineClass" t-on-click.stop="() => this.store.loadGetterContent(this.props.object)">
@@ -28,10 +28,9 @@
            </t>
          </span> 
        </t>
        <span t-if="keyChanges" class="key-changes ms-1 badge p-1" title="Key additions/deletions are observed">+/-</span>
      </div>
    </div>
-    <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-ref="contextmenu">
+    <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="contextmenu">
      <ul class="my-1">
        <li t-on-click="() => this.store.logObjectInConsole(this.props.object.path)" class="custom-menu-item py-1 px-4 text-nowrap">Store as global variable</li>
        <t t-if='props.object.contentType == "function"'>
@@ -39,9 +38,10 @@
        </t>
      </ul>
    </div>
-    <t t-if="props.object.toggled" t-key="contextMenuId">
+    <t t-if="props.object.toggled">
-      <t t-foreach="props.object.children" t-as="child" t-key="child_index">
+      <t t-foreach="props.object.children" t-as="child" t-key="child.name">
-        <ObjectTreeElement object="child" class="this.classFor(child)"/>
+        <ObjectTreeElement t-if="props.object.objectType === 'subscription'" object="child" keys="props.keys"/>
        <ObjectTreeElement t-else="" object="child"/>
      </t>
    </t>
  </t>
@@ -0,0 +1,30 @@
 const { Component } = owl;
 import { useStore } from "../../../../store/store";
 import { ObjectTreeElement } from "../object_tree_element/object_tree_element";
 export class Subscriptions extends Component {
  static template = "devtools.Subscriptions";
  static components = { ObjectTreeElement };
  setup() {
    this.store = useStore();
  }
  // Used to display the keys in a compact way
  keysContent(index) {
    const keys = this.store.activeComponent.subscriptions.children[index].keys;
    let content = JSON.stringify(keys);
    const maxLength = 50;
    content = content.replace(/,/g, ", ");
    if (content.length > maxLength) {
      content = content.slice(0, content.lastIndexOf(",", maxLength - 5)) + ", ...]";
    }
    return content;
  }
  expandKeys(event, index) {
    this.store.activeComponent.subscriptions.children[index].keysExpanded =
      !this.store.activeComponent.subscriptions.children[index].keysExpanded;
  }
 }
@@ -0,0 +1,24 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <templates xml:space="preserve">
  <t t-name="devtools.Subscriptions" owl="1">
    <div id="subscriptionsPanel">
      <t t-foreach="store.activeComponent.subscriptions.children" t-as="subscription" t-key="subscription_index">
        <div class="my-2">
          <div class="my-0 p-0 object-line" t-on-click.stop="(ev) => this.expandKeys(ev, subscription_index)">
            <span class="ps-1 text-nowrap">
              <i class="fa fa-caret-right ms-1" t-attf-style="cursor: pointer;{{subscription.keysExpanded ? 'transform: rotate(90deg);' : ''}}"></i>
              keys: <span class="key-name"><t t-esc="this.keysContent(subscription_index)"/></span>
            </span>
          </div>
          <div t-foreach="subscription.keys" t-as="key" t-key="key_index" class="my-0 p-0 object-line" t-attf-style="display: {{subscription.keysExpanded ? 'flex' : 'none'}}">
            <div style="transform: translateX(calc(1.1rem))" class="key-content">
              <i class="fa fa-caret-right mx-1" t-attf-style="cursor: pointer; visibility: hidden;"></i>
              <t t-esc="key"/>
            </div>
          </div>
          <ObjectTreeElement object="subscription.target" keys="subscription.keys"/>
        </div>
      </t>
    </div>
  </t>
 </templates>
@@ -1,11 +1,9 @@
 /** @odoo-module **/
-import { isElementInCenterViewport, minimizeKey, IS_FIREFOX } from "../../../../utils";
+import { isElementInCenterViewport, minimizeKey } from "../../../../utils";
 import { useStore } from "../../../store/store";
 import { HighlightText } from "./highlight_text/highlight_text";
 const browserInstance = IS_FIREFOX ? browser : chrome;
 const { Component, useRef, useState, useEffect, onMounted } = owl;
 export class TreeElement extends Component {
@@ -107,30 +105,4 @@ export class TreeElement extends Component {
      this.store.selectComponent(this.props.component.path);
    }
  }
  // Adds the component name to the components toggle blacklist if not already present
  // Else, remove it from the blacklist
  toggleComponentToBlacklist() {
    if (this.store.settings.componentsToggleBlacklist.has(this.props.component.name)) {
      if (!this.props.component.toggled) {
        this.props.component.toggled = !this.props.component.toggled;
      }
      this.store.settings.componentsToggleBlacklist.delete(this.props.component.name);
      browserInstance.storage.local.set({
        owlDevtoolsComponentsToggleBlacklist: Array.from(
          this.store.settings.componentsToggleBlacklist
        ),
      });
    } else {
      if (this.props.component.toggled) {
        this.props.component.toggled = !this.props.component.toggled;
      }
      this.store.settings.componentsToggleBlacklist.add(this.props.component.name);
      browserInstance.storage.local.set({
        owlDevtoolsComponentsToggleBlacklist: Array.from(
          this.store.settings.componentsToggleBlacklist
        ),
      });
    }
  }
 }
@@ -26,7 +26,7 @@
        <span t-if="props.component.depth">&gt;</span>
        <span class="version" t-else="">owl=<t t-esc="props.component.version"/></span>
      </div>
-      <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-ref="contextmenu">
+      <div t-if="store.contextMenu.activeMenu === contextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="contextmenu">
        <ul class="my-1">
          <li t-on-click.stop="() => this.store.toggleComponentAndChildren(props.component, true)" class="custom-menu-item py-1 px-4">Expand children</li>
          <li t-on-click.stop="() => this.store.toggleComponentAndChildren(props.component, false)" class="custom-menu-item py-1 px-4">Fold all children</li>
@@ -43,10 +43,6 @@
          <t t-else="">
            <li t-on-click.stop="() => this.store.logObjectInConsole([...props.component.path])" class="custom-menu-item py-1 px-4">Store as global variable</li>
          </t>
          <li t-on-click.stop="() => this.toggleComponentToBlacklist()" class="custom-menu-item py-1 px-4">
            <t t-if="store.settings.componentsToggleBlacklist.has(props.component.name)">Don't fold component by default</t>
            <t t-else="">Fold component by default</t>
          </li>
        </ul>
      </div>
    </div>
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <templates xml:space="preserve">
  <t t-name="devtools.Event" owl="1">
-    <div class="event-container" t-att-class="{ 'event-last': props.event.isLast }">
+    <div class="event-container">
      <div class="my-0 p-0 object-line" t-on-click.stop="toggleDisplay">
        <div class="ps-2 text-nowrap">
          <i class="fa px-1 pointer-icon caret"
@@ -43,7 +43,7 @@
          </span>
        </div>
      </t>
-      <div t-if="store.contextMenu.activeMenu === componentContextMenuId" class="custom-menu" t-ref="componentContextmenu">
+      <div t-if="store.contextMenu.activeMenu === componentContextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="componentContextmenu">
        <ul class="my-1">
          <li t-on-click.stop="() => this.store.inspectComponent('source', props.event.path)" class="custom-menu-item py-1 px-4">Inspect source code</li>
          <t t-if="props.event.path.length !== 1">
@@ -28,14 +28,14 @@
        </span>
      </div>
    </div>
-    <div t-if="store.contextMenu.activeMenu === nodeContextMenuId" class="custom-menu" t-ref="nodeContextMenu">
+    <div t-if="store.contextMenu.activeMenu === nodeContextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="nodeContextMenu">
      <ul class="my-1">
        <li t-on-click.stop="() => this.store.toggleEventAndChildren(props.event, true)" class="custom-menu-item py-1 px-4">Expand children</li>
        <li t-on-click.stop="() => this.store.toggleEventAndChildren(props.event, false)" class="custom-menu-item py-1 px-4">Fold all children</li>
        <li t-on-click.stop="() => this.store.foldDirectChildren(props.event)" class="custom-menu-item py-1 px-4">Fold direct children</li>
      </ul>
    </div>
-    <div t-if="store.contextMenu.activeMenu === componentContextMenuId" class="custom-menu" t-ref="componentContextmenu">
+    <div t-if="store.contextMenu.activeMenu === componentContextMenuId" class="custom-menu" t-attf-style="top: {{store.contextMenu.top}}; left: {{store.contextMenu.left}}" t-ref="componentContextmenu">
      <ul class="my-1">
        <li t-on-click.stop="() => this.store.inspectComponent('source', props.event.path)" class="custom-menu-item py-1 px-4">Inspect source code</li>
        <t t-if="props.event.path.length !== 1">
@@ -11,9 +11,10 @@ export const store = reactive({
    expandByDefault: true,
    toggleOnSelected: false,
    darkmode: false,
    componentsToggleBlacklist: new Set(),
  },
  contextMenu: {
    top: 0,
    left: 0,
    id: 0,
    activeMenu: -1,
    // Opens the context menu corresponding with the given menu html element
@@ -28,9 +29,9 @@ export const store = reactive({
      if (y + menuHeight > window.innerHeight) {
        y = window.innerHeight - menuHeight;
      }
-      menu.style.left = x + "px";
+      this.left = x + "px";
      // Need 25px offset because of the main navbar from the browser devtools
-      menu.style.top = y - 25 + "px";
+      this.top = y - 25 + "px";
    },
    // Close the currently displayed context menu
    close() {
@@ -102,19 +103,21 @@ export const store = reactive({
    if (IS_FIREFOX) {
      await evalInWindow("window.$0 = $0;", this.activeFrame);
    }
-    const [apps, details] = await evalFunctionInWindow(
+    const apps = await evalFunctionInWindow(
      "getComponentsTree",
-      fromOld && this.activeComponent
+      fromOld && this.activeComponent ? [this.activeComponent.path, this.apps] : [],
        ? [this.activeComponent.path, this.apps, this.activeComponent]
        : [],
      this.activeFrame
    );
    this.apps = apps ? apps : [];
    if (!fromOld && this.settings.expandByDefault) {
-      this.apps.forEach((tree) => expandNodes(tree, true));
+      this.apps.forEach((tree) => expandNodes(tree));
    }
-    keepEnvLit(details);
+    const component = await evalFunctionInWindow(
-    this.activeComponent = details;
+      "getComponentDetails",
      fromOld && this.activeComponent ? [this.activeComponent.path, this.activeComponent] : [],
      this.activeFrame
    );
    this.activeComponent = component;
  },
  // Select a component by retrieving its details from the page based on its path
@@ -151,11 +154,9 @@ export const store = reactive({
      [component.path],
      this.activeFrame
    );
-    if (!details) {
+    this.activeComponent = details;
    if (!this.activeComponent) {
      await this.loadComponentsTree(false);
    } else {
      keepEnvLit(details);
      this.activeComponent = details;
    }
    if (this.page !== "ComponentsTab") {
      this.switchTab("ComponentsTab");
@@ -413,7 +414,12 @@ export const store = reactive({
        if (!scriptsLoaded) {
          await loadScripts(frame);
        }
-        evalFunctionInWindow("initDevtools", [frame], frame);
+        evalInWindow(
          `__OWL__DEVTOOLS_GLOBAL_HOOK__.devtoolsId = ${
            store.devtoolsId
          }; __OWL__DEVTOOLS_GLOBAL_HOOK__.frame = ${JSON.stringify(frame)};`,
          frame
        );
        if (!this.frameUrls.includes(frame)) {
          this.frameUrls = [...this.frameUrls, frame];
        }
@@ -497,18 +503,13 @@ export const store = reactive({
  },
  // Reset all the relevant data about the page currently stored
-  async resetData() {
+  resetData() {
    await loadSettings();
    this.loadComponentsTree(false);
    this.events = [];
    this.eventsTree = [];
    this.activeRecorder = false;
    evalFunctionInWindow("toggleEventsRecording", [false, 0]);
    this.traceRenderings = false;
    evalFunctionInWindow("toggleTracing", [false]);
    this.traceSubscriptions = false;
    evalFunctionInWindow("toggleSubscriptionTracing", [false]);
    this.updateIFrameList();
  },
  // Triggers manually the rendering of the selected component
@@ -604,7 +605,7 @@ export const store = reactive({
  // Refresh the whole extension
  async refreshExtension() {
    await loadScripts();
-    await this.resetData();
+    this.resetData();
  },
  // Toggle dark mode in the extension and store result in the storage
@@ -615,7 +616,7 @@ export const store = reactive({
    } else {
      document.querySelector("html").classList.remove("dark-mode");
    }
-    browserInstance.storage.local.set({ owlDevtoolsDarkMode: this.settings.darkMode });
+    browserInstance.storage.local.set({ owl_devtools_dark_mode: this.settings.darkMode });
  },
  openDocumentation() {
@@ -633,9 +634,7 @@ init();
 async function init() {
  store.devtoolsId = await getTabURL();
-  evalFunctionInWindow("initDevtools", []);
+  evalInWindow("__OWL__DEVTOOLS_GLOBAL_HOOK__.devtoolsId = " + store.devtoolsId + ";");
  await loadSettings();
  // We want to load the base components tree when the devtools tab is first opened
  store.loadComponentsTree(false);
@@ -652,6 +651,8 @@ async function init() {
    evalFunctionInWindow("toggleEventsRecording", [false, 0], frame);
  }
  loadSettings();
  browserInstance.runtime.sendMessage({ type: "newDevtoolsPanel", id: store.devtoolsId });
  // Heartbeat message to test whether the extension context is still valid or not
@@ -666,7 +667,7 @@ async function init() {
  }, 500);
 }
-let rootRendersTimeout = false;
+let flushRendersTimeout = false;
 // Connect to the port to communicate to the background script
 browserInstance.runtime.onConnect.addListener((port) => {
  if (port.name === "OwlDevtoolsPort_" + store.devtoolsId) {
@@ -675,23 +676,23 @@ browserInstance.runtime.onConnect.addListener((port) => {
      if (msg.type === "Reload") {
        store.owlStatus = await evalInWindow("window.__OWL__DEVTOOLS_GLOBAL_HOOK__ !== undefined;");
        if (store.owlStatus) {
-          evalFunctionInWindow("initDevtools", []);
+          evalInWindow("__OWL__DEVTOOLS_GLOBAL_HOOK__.devtoolsId = " + store.devtoolsId + ";");
-          await store.resetData();
+          store.resetData();
        }
      }
      // Received when a frame has been delayed when loading the scripts due to owl being lazy loaded
      if (msg.type === "FrameReady") {
        store.updateIFrameList();
        store.owlStatus = true;
-        await store.resetData();
+        store.resetData();
      }
      // We need to reload the components tree when the set of apps in the page is modified
      if (msg.type === "RefreshApps") {
        store.loadComponentsTree(true);
      }
-      // When message of type Complete is received, overwrite the component tree with the new one from page
+      // When message of type Flush is received, overwrite the component tree with the new one from page
-      // A Complete message is sent everytime a root render is triggered on the page
+      // A flush message is sent everytime a component is rendered on the page
-      if (msg.type === "Complete") {
+      if (msg.type === "Flush") {
        if (msg.origin.frame !== store.activeFrame) {
          return;
        }
@@ -700,8 +701,8 @@ browserInstance.runtime.onConnect.addListener((port) => {
        }
        // This determines which components will have a short highlight effect in the tree to indicate they have been rendered
        store.renderPaths.add(JSON.stringify(msg.data));
-        clearTimeout(rootRendersTimeout);
+        clearTimeout(flushRendersTimeout);
-        rootRendersTimeout = setTimeout(() => {
+        flushRendersTimeout = setTimeout(() => {
          store.renderPaths.clear();
        }, 100);
        store.loadComponentsTree(true);
@@ -739,12 +740,11 @@ browserInstance.runtime.onConnect.addListener((port) => {
 // Load all settings from the chrome sync storage
 async function loadSettings() {
  let storage = await browserInstance.storage.local.get();
-  // Darkmode
+  if (storage.owl_devtools_dark_mode === undefined) {
  if (storage.owlDevtoolsDarkMode === undefined) {
    // Load dark mode based on the global settings of the chrome devtools
    darkMode = browserInstance.devtools.panels.themeName === "dark";
  } else {
-    darkMode = storage.owlDevtoolsDarkMode;
+    darkMode = storage.owl_devtools_dark_mode;
  }
  store.settings.darkMode = darkMode;
  if (darkMode) {
@@ -752,12 +752,6 @@ async function loadSettings() {
  } else {
    document.querySelector("html").classList.remove("dark-mode");
  }
  // Components toggle blacklist
  if (storage.owlDevtoolsComponentsToggleBlacklist !== undefined) {
    store.settings.componentsToggleBlacklist = new Set(
      storage.owlDevtoolsComponentsToggleBlacklist
    );
  }
 }
 // Function to handle and store a batch of events coming from the page
@@ -782,7 +776,6 @@ function loadEvents(events) {
    }
    event.origin = null;
    event.toggled = false;
    event.isLast = false;
    // Logic to retrace the origin of the event if it is not a root render event
    if (!event.type.includes("render")) {
      for (let i = store.events.length - 1; i >= 0; i--) {
@@ -832,7 +825,6 @@ function loadEvents(events) {
    // Make sure we add the event while keeping the whole list ordered by id
    addEventSorted(event);
  }
  store.events[store.events.length - 1].isLast = true;
 }
 // Deselect component and remove highlight on all children
@@ -879,39 +871,10 @@ function highlightChildren(component) {
 }
 // Expand the node given in entry and all of its children
-function expandNodes(node, blacklist = false) {
+function expandNodes(node) {
-  if (blacklist && store.settings.componentsToggleBlacklist.has(node.name)) {
+  node.toggled = true;
    node.toggled = false;
  } else {
    node.toggled = true;
  }
  for (const child of node.children) {
-    expandNodes(child, blacklist);
+    expandNodes(child);
  }
 }
 // This function transforms the env part of the details such that all env keys are not
 // greyed out in the UI at their first occurence
 function keepEnvLit(details) {
  let alreadyMet = new Set();
  for (let i = 0; i < details.env.children.length; i++) {
    if (i < details.env.children.length - 1) {
      alreadyMet.add(details.env.children[i].name);
    } else {
      let lastElement = details.env.children[i];
      while (lastElement.children.at(-1).name === "[[Prototype]]") {
        for (const [index, child] of lastElement.children.entries()) {
          if (index < lastElement.children.length - 1) {
            if (!alreadyMet.has(child.name)) {
              child.keepLit = true;
              alreadyMet.add(child.name);
            }
          } else {
            lastElement = child;
          }
        }
      }
    }
  }
 }
@@ -126,10 +126,6 @@
  color: var(--prototype-color);
 }
 .key-changes {
  background-color: var(--version-bg);
 }
 .event-container {
  border-bottom: 1px solid rgb(240, 238, 238);
  padding-top: 2px!important;
@@ -137,10 +133,6 @@
  font-size: 11px;
 }
 .event-last {
  border-bottom: 3px solid rgb(225, 154, 0);
 }
 .getter-content:hover {
  text-decoration: underline;
 }
@@ -11,10 +11,8 @@
      this.Fiber = window.__OWL_DEVTOOLS__.Fiber;
      // Same but for RootFiber
      this.RootFiber = window.__OWL_DEVTOOLS__.RootFiber;
-      // This is for retrocompatibility purposes since new versions of owl should always expose toRaw and reactive
+      // Set to keep track of the fibers that are in the flush queue
-      // in __OWL_DEVTOOLS__
+      this.queuedFibers = new WeakSet();
      this.toRaw = window.__OWL_DEVTOOLS__.toRaw ?? window.owl?.toRaw;
      this.reactive = window.__OWL_DEVTOOLS__.reactive ?? window.owl?.reactive;
      // Set to keep track of the HTML elements we added to the page
      this.addedElements = [];
      // To keep track of the succession order of the render events
@@ -22,6 +20,7 @@
      // Set to keep track of the frame on which this script is loaded
      this.frame = "top";
      // Allows to launch a message each time an iframe html element is added to the page
      const self = this;
      const iFrameObserver = new MutationObserver(function (mutationsList) {
        mutationsList.forEach(function (mutation) {
          mutation.addedNodes.forEach(function (addedNode) {
@@ -44,6 +43,8 @@
        });
      });
      iFrameObserver.observe(document.body, { subtree: true, childList: true });
      this.appsPatched = false;
      this.destroyPatched = false;
      this.patchAppsSetMethods();
      this.recordEvents = false;
      this.traceRenderings = false;
@@ -117,15 +118,6 @@
            length += element.length;
            result.push(element);
          }
          for (const key of Object.getOwnPropertySymbols(obj)) {
            if (length > 25) {
              result.push("...");
              break;
            }
            const element = key.toString() + ": " + this.serializeItem(obj[key]);
            length += element.length;
            result.push(element);
          }
          return "{" + result.join(", ") + "}";
        },
        map(obj) {
@@ -173,40 +165,34 @@
      };
    }
    initDevtools(frame = "top") {
      if (!this.devtoolsInit) {
        this.frame = frame;
        const self = this;
        // Flush the events batcher when a root render is completed
        const original_Complete = self.RootFiber.prototype.complete;
        self.RootFiber.prototype.complete = function () {
          original_Complete.call(this, ...arguments);
          const path = self.getComponentPath(this.node);
          //Add a functionnality to the complete function which sends a message to the window every time it is triggered.
          window.top.postMessage({
            source: "owl-devtools",
            type: "Complete",
            data: path,
            origin: { frame: self.frame },
          });
          if (self.recordEvents) {
            window.top.postMessage({
              source: "owl-devtools",
              type: "Event",
              data: self.eventsBatch,
            });
            self.eventsBatch = [];
          }
        };
        this.devtoolsInit = true;
      }
    }
    // Modify the methods of the apps set in order to send a message each time it is modified.
    patchAppsSetMethods() {
      const originalAdd = this.apps.add;
      const originalDelete = this.apps.delete;
      const self = this;
      this.apps.add = function () {
        originalAdd.call(this, ...arguments);
        if (!self.destroyPatched) {
          const newApp = arguments[0];
          // It is not a given that apps have a root node at creation so we need to wait
          if (newApp.root) {
            self.patchDestroyMethod(newApp.root);
          } else {
            let root = null;
            Object.defineProperty(newApp, "root", {
              get() {
                return root;
              },
              set(value) {
                root = value;
                if (!self.destroyPatched) {
                  self.patchDestroyMethod(root);
                }
              },
            });
          }
        }
        self.patchAppMethods();
        window.top.postMessage({
          source: "owl-devtools",
          type: "RefreshApps",
@@ -221,24 +207,63 @@
      };
    }
    patchDestroyMethod(root) {
      if (!this.destroyPatched) {
        // Signals when a component is destroyed
        const originalDestroy = root.constructor.prototype._destroy;
        const self = this;
        root.constructor.prototype._destroy = function () {
          if (self.recordEvents) {
            const path = self.getComponentPath(this);
            const event = {
              type: "destroy",
              component: this.name,
              key: this.parentKey,
              path: path,
              time: 0,
              id: self.eventId++,
            };
            self.eventsBatch.push(event);
            const before = performance.now();
            originalDestroy.call(this, ...arguments);
            event.time = performance.now() - before;
          } else {
            originalDestroy.call(this, ...arguments);
          }
        };
        this.destroyPatched = true;
      }
    }
    // Modify methods of each app so that it triggers messages on each flush and component render
    patchAppMethods() {
-      let app;
+      if (this.appsPatched) {
-      for (const appItem of this.apps) {
+        return;
-        if (appItem.root) {
+      }
-          app = appItem;
+      let app = this.apps.values().next().value;
-        }
+      if (!app) {
      }
      if (!app.root) {
        return;
      }
      const self = this;
      const originalFlush = app.scheduler.constructor.prototype.flush;
      let inFlush = false;
      let _render = false;
      const self = this;
      app.scheduler.constructor.prototype.flush = function () {
        // Used to know when a render is triggered inside the flush method or not
        inFlush = true;
        [...this.tasks].map((fiber) => {
          if (fiber.counter === 0 && !self.queuedFibers.has(fiber)) {
            self.queuedFibers.add(fiber);
            const path = self.getComponentPath(fiber.node);
            //Add a functionnality to the flush function which sends a message to the window every time it is triggered.
            window.top.postMessage({
              source: "owl-devtools",
              type: "Flush",
              data: path,
              origin: { frame: self.frame },
            });
          }
        });
        originalFlush.call(this, ...arguments);
        inFlush = false;
      };
@@ -335,27 +360,20 @@
        _render = true;
        original_Render.call(this, ...arguments);
      };
-      // Signals when a component is destroyed
+      // Flush the events batcher when a root render is completed
-      const originalDestroy = app.root.constructor.prototype._destroy;
+      const original_Complete = self.RootFiber.prototype.complete;
-      app.root.constructor.prototype._destroy = function () {
+      self.RootFiber.prototype.complete = function () {
        original_Complete.call(this, ...arguments);
        if (self.recordEvents) {
-          const path = self.getComponentPath(this);
+          window.top.postMessage({
-          const event = {
+            source: "owl-devtools",
-            type: "destroy",
+            type: "Event",
-            component: this.name,
+            data: self.eventsBatch,
-            key: this.parentKey,
+          });
-            path: path,
+          self.eventsBatch = [];
            time: 0,
            id: self.eventId++,
          };
          self.eventsBatch.push(event);
          const before = performance.now();
          originalDestroy.call(this, ...arguments);
          event.time = performance.now() - before;
        } else {
          originalDestroy.call(this, ...arguments);
        }
      };
      this.appsPatched = true;
    }
    // patch reactivity system to activate subscription tracing
@@ -370,7 +388,7 @@
      let targetToKeysToCallbacks;
      // Step 1: extract internal values from owl
-      const obj = self.reactive({}, () => {});
+      const obj = owl.reactive({}, () => {});
      let count = 0;
      WeakMap.prototype.get = function () {
        count++;
@@ -419,14 +437,9 @@
    }
    toggleTracing(value) {
      if (value) {
        this.patchAppMethods();
        this.patchAppMethods = () => {}; // to only patch once
      }
      this.traceRenderings = value;
      return this.traceRenderings;
    }
    toggleSubscriptionTracing(value) {
      if (value) {
        this.patchReactivity();
@@ -437,10 +450,6 @@
    }
    // Enables/disables the recording of the render/destroy events based on value
    toggleEventsRecording(value, index) {
      if (value) {
        this.patchAppMethods();
        this.patchAppMethods = () => {}; // to only patch once
      }
      this.recordEvents = value;
      this.eventId = index;
      return this.recordEvents;
@@ -707,7 +716,7 @@
            }
        }
        if (obj) {
-          obj = this.toRaw(obj);
+          obj = owl.toRaw(obj);
        }
      }
      return obj;
@@ -748,9 +757,6 @@
          child.contentType = "object";
          child.content = this.serializer.serializeItem(Object.getPrototypeOf(parentObj), true);
          child.hasChildren = true;
          if (!oldTree && type === "env") {
            child.toggled = true;
          }
          break;
        case "set entries":
        case "map entries":
@@ -797,48 +803,57 @@
          }
          break;
      }
-      if (!child.contentType) {
+      if (child.contentType) {
-        if (obj === null) {
+        if (child.toggled) {
-          child.content = "null";
+          child.children = this.loadObjectChildren(
-          child.contentType = "object";
+            child.path,
-          child.hasChildren = false;
+            child.depth,
-        } else if (obj === undefined) {
+            child.contentType,
-          child.content = "undefined";
+            child.objectType,
-          child.contentType = "undefined";
+            oldTree
-          child.hasChildren = false;
+          );
        }
        return child;
      }
      if (obj === null) {
        child.content = "null";
        child.contentType = "object";
        child.hasChildren = false;
      } else if (obj === undefined) {
        child.content = "undefined";
        child.contentType = "undefined";
        child.hasChildren = false;
      } else {
        obj = owl.toRaw(obj);
        switch (true) {
          case obj instanceof Map:
            child.contentType = "map";
            child.hasChildren = true;
            break;
          case obj instanceof Set:
            child.contentType = "set";
            child.hasChildren = true;
            break;
          case obj instanceof Array:
            child.contentType = "array";
            child.hasChildren = obj.length > 0;
            break;
          case typeof obj === "function":
            child.contentType = "function";
            child.hasChildren = true;
            break;
          case obj instanceof Object:
            child.contentType = "object";
            child.hasChildren = Object.keys(obj).length > 0;
            break;
          default:
            child.contentType = typeof obj;
            child.hasChildren = false;
        }
        if (key.type === "set entry") {
          child.content = this.serializer.serializeItem(obj, true);
        } else {
-          obj = this.toRaw(obj);
+          child.content = this.serializer.serializeContent(obj, child.contentType);
          switch (true) {
            case obj instanceof Map:
              child.contentType = "map";
              child.hasChildren = true;
              break;
            case obj instanceof Set:
              child.contentType = "set";
              child.hasChildren = true;
              break;
            case obj instanceof Array:
              child.contentType = "array";
              child.hasChildren = obj.length > 0;
              break;
            case typeof obj === "function":
              child.contentType = "function";
              child.hasChildren = true;
              break;
            case obj instanceof Object:
              child.contentType = "object";
              child.hasChildren =
                Object.keys(obj).length || Object.getOwnPropertySymbols(obj).length;
              break;
            default:
              child.contentType = typeof obj;
              child.hasChildren = false;
          }
          if (key.type === "set entry") {
            child.content = this.serializer.serializeItem(obj, true);
          } else {
            child.content = this.serializer.serializeContent(obj, child.contentType);
          }
        }
      }
      if (child.toggled) {
@@ -850,7 +865,6 @@
          oldTree
        );
      }
      this.addHighlightedKeys(child);
      return child;
    }
@@ -860,10 +874,7 @@
      let path = completePath.slice(objPathIndex);
      let obj;
      if (objType === "subscription") {
-        const subscriptionPath = completePath.slice(0, objPathIndex + 3);
+        obj = oldTree.subscriptions.children[path[1].value].target;
        obj = oldTree.subscriptions.children.find(
          (child) => JSON.stringify(child.target.path) === JSON.stringify(subscriptionPath)
        ).target;
        path = path.slice(3);
      } else {
        // Everything here is in component if it is not an app so remove this key of the path in the former case
@@ -893,7 +904,7 @@
      const children = [];
      depth = depth + 1;
      let obj = this.getObjectProperty(path);
-      let oldBranch = oldTree && this.getObjectInOldTree(oldTree, path, objType);
+      let oldBranch = this.getObjectInOldTree(oldTree, path, objType);
      if (!obj) {
        return [];
      }
@@ -908,7 +919,7 @@
            depth,
            objType,
            path,
-            oldBranch?.children[0],
+            oldBranch.children[0],
            oldTree
          );
          children.push(mapKey);
@@ -918,7 +929,7 @@
            depth,
            objType,
            path,
-            oldBranch?.children[1],
+            oldBranch.children[1],
            oldTree
          );
          children.push(mapValue);
@@ -929,7 +940,7 @@
            depth,
            objType,
            path,
-            oldBranch?.children[0],
+            oldBranch.children[0],
            oldTree
          );
          children.push(setValue);
@@ -950,7 +961,7 @@
                depth,
                objType,
                path,
-                oldBranch?.children[index],
+                oldBranch.children[index],
                oldTree
              );
              if (child) {
@@ -965,7 +976,7 @@
                depth,
                objType,
                path,
-                oldBranch?.children[index],
+                oldBranch.children[index],
                oldTree
              );
              if (child) {
@@ -982,13 +993,26 @@
            depth,
            objType,
            path,
-            oldBranch?.children[index],
+            oldBranch.children[index],
            oldTree
          );
          if (entries) {
            children.push(entries);
            index++;
          }
          const size = this.serializeObjectChild(
            obj,
            { type: "item", value: "size", childIndex: children.length },
            depth,
            objType,
            path,
            oldBranch.children[index],
            oldTree
          );
          if (size) {
            children.push(size);
            index++;
          }
          Reflect.ownKeys(obj).forEach((key) => {
            const child = this.serializeObjectChild(
              obj,
@@ -996,7 +1020,7 @@
              depth,
              objType,
              path,
-              oldBranch?.children[index],
+              oldBranch.children[index],
              oldTree
            );
            if (child) {
@@ -1031,7 +1055,7 @@
              depth,
              objType,
              path,
-              oldBranch?.children[index],
+              oldBranch.children[index],
              oldTree
            );
            if (child) children.push(child);
@@ -1064,14 +1088,14 @@
        });
        proto = Object.getPrototypeOf(proto);
      }
-      if (obj.__proto__) {
+      if (!(obj.constructor.name === "Object")) {
        prototype = this.serializeObjectChild(
          obj,
          { type: "prototype", childIndex: children.length },
          depth,
          objType,
          path,
-          oldBranch?.children.at(-1),
+          oldBranch.children.at(-1),
          oldTree
        );
        children.push(prototype);
@@ -1276,15 +1300,16 @@
          children: [],
        };
      } else {
-        const rawSubscriptions = this.topLevelSubscriptions(node);
+        const rawSubscriptions = node.subscriptions;
        component.subscriptions = {
          toggled: oldTree ? oldTree.subscriptions.toggled : true,
          children: [],
        };
-        rawSubscriptions.forEach((rawSubscription) => {
+        rawSubscriptions.forEach((rawSubscription, index) => {
          let subscription = {
            keys: [],
            target: {
-              name: this.targetName(rawSubscription.target, node),
+              name: "target",
              contentType:
                typeof rawSubscription.target === "object"
                  ? Array.isArray(rawSubscription.target)
@@ -1295,20 +1320,28 @@
              path: [
                ...path,
                { type: "item", value: "subscriptions" },
-                { type: "item", value: rawSubscription.index },
+                { type: "item", value: index },
                { type: "item", value: "target" },
              ],
              toggled: false,
              objectType: "subscription",
            },
            keysExpanded: false,
          };
          if (
            oldTree &&
-            oldTree.subscriptions.children[rawSubscription.index] &&
+            oldTree.subscriptions.children[index] &&
-            oldTree.subscriptions.children[rawSubscription.index].target.toggled
+            oldTree.subscriptions.children[index].target.toggled
          ) {
            subscription.target.toggled = true;
          }
          rawSubscription.keys.forEach((key) => {
            if (typeof key === "symbol") {
              subscription.keys.push(key.toString());
            } else {
              subscription.keys.push(key);
            }
          });
          if (rawSubscription.target == null) {
            if (subscription.target.contentType === "undefined") {
              subscription.target.content = "undefined";
@@ -1338,7 +1371,6 @@
              oldTree
            );
          }
          this.addHighlightedKeys(subscription.target);
          component.subscriptions.children.push(subscription);
        });
      }
@@ -1357,7 +1389,7 @@
        }
        getter.hasChildren = false;
      } else {
-        obj = this.toRaw(obj);
+        obj = owl.toRaw(obj);
        switch (true) {
          case obj instanceof Map:
            getter.contentType = "map";
@@ -1446,16 +1478,13 @@
          return;
        }
      }
-      const item = path.pop();
+      const key = path.pop().value;
      const obj = this.getObjectProperty(path);
      const key = item.hasOwnProperty("symbolIndex")
        ? Object.getOwnPropertySymbols(obj)[item.symbolIndex]
        : item.value;
      if (!obj) {
        return;
      }
      if (objectType === "subscription") {
-        this.reactive(obj)[key] = value;
+        owl.reactive(obj)[key] = value;
      } else {
        obj[key] = value;
        if (objectType === "props" || objectType === "instance") {
@@ -1519,13 +1548,12 @@
          }
        }
      }
-      // If nothing was found, return the path of the first root component found in the apps
+      // If nothing was found, return the first app's root component path
-      const appIndex = [...this.apps].findIndex((app) => app.root);
+      return ["0", "root"];
      return [appIndex.toString(), "root"];
    }
    // Returns the tree of components of the inspected page in a parsed format
    // Use inspectedPath to specify the path of the selected component
-    getComponentsTree(inspectedPath = null, oldTrees = null, oldDetails = null) {
+    getComponentsTree(inspectedPath = null, oldTrees = null) {
      const appsArray = [...this.apps];
      const trees = appsArray.map((app, index) => {
        let oldTree;
@@ -1578,8 +1606,7 @@
        }
        return appNode;
      });
-      const component = this.getComponentDetails(inspectedPath, oldDetails);
+      return trees ? trees : [];
      return trees ? [trees, component] : [];
    }
    // Recursively fills the components tree as a parsed version
    fillTree(appNode, treeNode, inspectedPathString, oldBranch) {
@@ -1675,54 +1702,6 @@
        inspect(obj);
      }
    }
    targetName(target, node) {
      // check on component
      const { component } = node;
      for (const [key, value] of Object.entries(component)) {
        if (target === this.toRaw(value)) {
          return key;
        }
      }
      // check on props
      for (const [key, value] of Object.entries(component.props)) {
        if (target === this.toRaw(value)) {
          return `props.${key}`;
        }
      }
      return "[unknown]";
    }
    /**
     * Removes subscriptions that are a direct child of another subscription:
     * they will be reachable from the top level by expanding observed keys.
     *
     * @param {ComponentNode} node
     * @returns {{ keys: PropertyKey[], target: unknown}[]} the top level
     *  subscriptions of the node
     */
    topLevelSubscriptions(node) {
      const subscriptions = node.subscriptions.map((s, index) => ({ ...s, index }));
      const topLevelValues = new Set(Object.values(node.component).map((o) => this.toRaw(o)));
      const toOmit = new Set(
        subscriptions
          .flatMap(({ keys, target }) => keys.map((k) => this.toRaw(target[k])))
          .filter((obj) => !topLevelValues.has(obj))
      );
      return subscriptions.filter(({ target }) => !toOmit.has(target));
    }
    addHighlightedKeys(child) {
      const { path } = child;
      const subscriptionIndex = path.findIndex((item) => typeof item !== "string");
      if (path[subscriptionIndex]?.value === "subscriptions") {
        const node = this.getComponentNode(path.slice(0, subscriptionIndex));
        // Add observed keys
        const targetToKeys = new Map(node.subscriptions.map(({ keys, target }) => [target, keys]));
        const target = this.getObjectProperty(child.path);
        child.keys = targetToKeys.get(target)?.map((k) => String(k));
      }
    }
  }
  function checkOwlStatus() {
@@ -82,12 +82,6 @@ async function startRelease() {
    return;
  }
  // ---------------------------------------------------------------------------
  log(`Step ${step++}/${STEPS}: updating package.json...`);
  await writeFile("package.json", JSON.stringify({...package, version: next}, null, 2) + "\n");
  await writeFile("package-lock.json", JSON.stringify({...packageLock, version: next}, null, 2) + "\n");
  await writeFile("./src/version.ts", `// do not modify manually. This file is generated by the release script.\nexport const version = "${next}";\n`);
  // ---------------------------------------------------------------------------
  log(`Step ${step++}/${STEPS}: building owl...`);
  await execCommand("rm -rf dist/");
@@ -114,6 +108,13 @@ async function startRelease() {
  await execCommand("cd dist && zip -r owl-devtools.zip devtools-chrome devtools-firefox && cd ..");
  await execCommand("rm -r dist/devtools-chrome dist/devtools-firefox && rm dist/compiler.js");
  // ---------------------------------------------------------------------------
  log(`Step ${step++}/${STEPS}: updating package.json...`);
  await writeFile("package.json", JSON.stringify({...package, version: next}, null, 2) + "\n");
  await writeFile("package-lock.json", JSON.stringify({...packageLock, version: next}, null, 2) + "\n");
  await writeFile("./src/version.ts", `// do not modify manually. This file is generated by the release script.\nexport const version = "${next}";\n`);
  // ---------------------------------------------------------------------------
  log(`Step ${step++}/${STEPS}: updating owl on github page...`);
  await fs.copyFileSync("dist/owl.es.js", "docs/owl.js");
`@@ -1,2 +1,2 @@`
	`// do not modify manually. This file is generated by the release script.`	`// do not modify manually. This file is generated by the release script.`
	`export const version = "2.2.3";`	`export const version = "2.1.3";`