[REL] v2.0.0-beta-8

# v2.0.0-beta-8

Fixes

- portal: allow use of expression to describe portal target
- compiler: fix issue with identifiers with same name
- reactivity: fix memory leak
- app: validate props for root component in dev mode

Improvements

- component: display nice error for wrong child component
- props_validation: have clearer error messages
- component: only useState on props that are already reactive
- compiler: add better support for "in" and "new" operators in templates
- misc: export the validate function
- app: add setting to warn if no static props object
- add static App.registerTemplate and update Portal to use it
- add basic infrastructure to buid owl-runtime without compiler

README.md

@@ -93,6 +93,7 @@ Are you new to Owl? This is the place to start!
 - [Loading Templates](doc/reference/app.md#loading-templates)
 - [Mounting a component](doc/reference/app.md#mount-helper)
 - [Portal](doc/reference/portal.md)
+- [Precompiling templates](doc/reference/precompiling_templates.md)
 - [Props](doc/reference/props.md)
 - [Props Validation](doc/reference/props.md#props-validation)
 - [Reactivity](doc/reference/reactivity.md)

doc/readme.md

@@ -45,4 +45,5 @@ Utility/helpers:
 - [`loadFile`](reference/utils.md#loadfile): an helper to load a file from the server
 - [`markup`](reference/templates.md#outputting-data): utility function to define strings that represent html (should not be escaped)
 - [`status`](reference/component.md#status-helper): utility function to get the status of a component (new, mounted or destroyed)
+- [`validate`](reference/utils.md#validate): validates if an object satisfies a specified schema
 - [`whenReady`](reference/utils.md#whenready): utility function to execute code when DOM is ready

doc/reference/app.md

@@ -61,6 +61,8 @@ The `config` object is an object with some of the following keys:
   templates (see [translations](translations.md))
 - **`templates (string | xml document)`**: all the templates that will be used by
   the components created by the application.
+- **`warnIfNoStaticProps (boolean, default=false)`**: if true, Owl will log a warning
+  whenever it encounters a component that does not provide a [static props description](props.md#props-validation).
 
 ## `mount` helper
 

doc/reference/component.md

@@ -76,7 +76,8 @@ The `Component` class has a very small API.
 
   By default, the render initiated by this method will stop at each child
   component if their props are (shallow) equal. To force a render to update
-  all child components, one can use the optional `deep` argument.
+  all child components, one can use the optional `deep` argument. Note that the
+  value of the `deep` argument needs to be a boolean, not a truthy value.
 
 ## Static Properties
 

doc/reference/context.md

@@ -1,105 +0,0 @@
-# 🦉 Context 🦉
-
-## Content
-
-- [Overview](#overview)
-- [Example](#example)
-- [Reference](#reference)
-  - [`Context`](#context)
-  - [`useContext`](#usecontext)
-
-## Overview
-
-The `Context` object provides a way to share data between an arbitrary number
-of components. Usually, data is passed from a parent to its children component,
-but when we have to deal with some mostly global information, this can be
-annoying, since each component will need to pass the information to each children,
-even though some or most of them will not use the information.
-
-With a `Context` object, each component can subscribe (with the `useContext` hook)
-to its state, and will be updated whenever the context state is updated.
-
-## Example
-
-Assume that we have an application with various components which needs to render
-differently depending on the size of the device. Here is how we could proceed
-to make sure that the information is properly shared. First, let us create a
-context, and add it to the environment:
-
-```js
-const deviceContext = new Context({ isMobile: true });
-App.env.deviceContext = deviceContext;
-```
-
-If we want to make it completely responsive, we need to update its value whenever
-the size of the screen is updated:
-
-```js
-const isMobile = () => window.innerWidth <= 768;
-window.addEventListener(
-  "resize",
-  owl.utils.debounce(() => {
-    const state = deviceContext.state;
-    if (state.isMobile !== isMobile()) {
-      state.isMobile = !state.isMobile;
-    }
-  }, 15)
-);
-```
-
-Then, each component that want can subscribe and render differently depending on the
-fact that we are in a mobile or desktop mode.
-
-```js
-class SomeComponent extends Component {
-  static template = xml`
-    <div>
-      <t t-if=device.isMobile>
-          some simplified user interface
-      </t>
-      <t t-else="">
-          a more advanced user interface
-      </t>
-    </div>`;
-  device = useContext(this.env.deviceContext);
-}
-```
-
-## Reference
-
-### `Context`
-
-A `Context` object should be created with a state object:
-
-```js
-const someContext = new Context({ some: "key" });
-```
-
-Its state is now available in the `state` key:
-
-```js
-someContext.state.some = "other key";
-```
-
-This is the way some global code (such as the responsive code above) should
-read and update the context state. However, components should not ever read the
-context state directly from the context, they should instead use the `useContext`
-hook to properly register themselves to state changes.
-
-Note that the `Context` hook is different from the React version. For example,
-there is no concept of provider/consumer. So, the `Context` feature does not
-by itself allow the use of a different context state depending on the component
-place in the component tree. However, this functionality can be obtained, if
-necessary, with the use of sub environment.
-
-### `useContext`
-
-The `useContext` hook is the normal way for a component to register themselve
-to context state changes. The `useContext` method returns the context state:
-
-```js
-device = useContext(this.env.deviceContext);
-```
-
-It is a simple observed state (with an owl `Observer`), which contains the shared
-information.

doc/reference/precompiling_templates.md

@@ -0,0 +1,30 @@
+# 🦉 Precompiling templates 🦉
+
+Owl is designed to be used by the Odoo javascript framework. Since Odoo handles
+its assets in its own non standard way, it was decided/assumed that Owl would
+compile templates at runtime.
+
+However, in some cases, it is not optimal, or even worse, not possible to do that.
+For example, browser extensions do not allow javascript code to create a new
+function (using the `new Function(...)` syntax).
+
+Therefore, in these cases, it is required to compile templates ahead of time. It
+is possible to do that in Owl, but the tooling is still rough. For now, the
+process is the following:
+
+1. write your templates in xml files (with a `t-name` directive to declare the name
+   of the template)
+2. Compile them in a `templates.js` file
+3. get the `owl.iife.runtime.js` file (which is a owl build without the compiler)
+4. bundle `owl.iife.runtime.js` and `template.js` with your assets (owl needs to
+   be positioned before the templates)
+
+Here is a more detailed explanation on how to compile xml files into a js file:
+
+1. clone the owl repository locally
+2. `npm install` to install all the required tooling
+3. `npm run build:runtime` to build the `owl.iife.runtime.js` file
+4. `npm run build:compiler` to build the template compiler
+5. `npm run compile_templates -- path/to/your/templates` will scan your target
+   folder, find all xml files, get all templates, compile them, and generate a
+   `templates.js` file.

doc/reference/props.md

@@ -243,6 +243,8 @@ class ComponentB extends owl.Component {
   };
 ```
 
+Note: the props validation code is done by using the [validate utility function](utils.md#validate).
+
 ## Good Practices
 
 A `props` object is a collection of values that come from the parent. As such,

doc/reference/reactivity.md

@@ -26,9 +26,9 @@ To solve this issue, Owl provides two reactivity primitives:
 Most of the time, the `useState` hook is the best solution.
 
 Since version 2.0, Owl applies the fine grained reactivity at the component
-level: props are automatically turned into reactive object, so Owl can track
-which part of these props are consumed by each component, and is therefore able
-to only rerender the impacted components.
+level: reactive objects received as props are automatically subscribed to by the
+component, so Owl can track which part of these props are consumed by each
+component, and is therefore able to only rerender the impacted components.
 
 ## `useState`
 

doc/reference/utils.md

@@ -8,6 +8,7 @@ functions are all available in the `owl.utils` namespace.
 - [`whenReady`](#whenready): executing code when DOM is ready
 - [`loadFile`](#loadfile): loading a file (useful for templates)
 - [`EventBus`](#eventbus): a simple EventBus
+- [`validate`](#validate): a validation function
 
 ## `whenReady`
 
@@ -56,3 +57,24 @@ bus.addEventListener("event", () => console.log("something happened"));
 
 bus.trigger("event"); // 'something happened' is logged
 ```
+
+## `validate`
+
+The `validate` function is a function that validates if a given object satisfies a
+specified schema. It is actually used by Owl itself to perform
+[props validation](props.md#props-validation). For example:
+
+```js
+validate(
+  { a: "hey" },
+  {
+    id: Number,
+    url: [Boolean, { type: Array, element: Number }],
+  }
+);
+
+// throws an error with the following information:
+//    - unknown key 'a',
+//    - 'id' is missing (should be a number),
+//    - 'url' is missing (should be a boolean or list of numbers),
+```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odoo/owl",
-  "version": "2.0.0-beta-5",
+  "version": "2.0.0-beta-8",
   "description": "Odoo Web Library (OWL)",
   "main": "dist/owl.cjs.js",
   "browser": "dist/owl.iife.js",
@@ -14,6 +14,8 @@
   },
   "scripts": {
     "build:bundle": "rollup -c --failAfterWarnings",
+    "build:runtime": "rollup -c --failAfterWarnings runtime",
+    "build:compiler": "rollup -c --failAfterWarnings compiler",
     "build": "npm run build:bundle",
     "test": "jest",
     "test:debug": "node --inspect-brk node_modules/.bin/jest --runInBand --watch --testTimeout=5000000",
@@ -25,7 +27,8 @@
     "prettier": "prettier {src/*.ts,src/**/*.ts,tests/*.ts,tests/**/*.ts,doc/*.md,doc/**/*.md} --write",
     "check-formatting": "prettier {src/*.ts,src/**/*.ts,tests/*.ts,tests/**/*.ts,doc/*.md,doc/**/*.md} --check",
     "publish": "npm run build && npm publish",
-    "release": "node tools/release.js"
+    "release": "node tools/release.js",
+    "compile_templates": "node tools/compile_xml.js"
   },
   "repository": {
     "type": "git",

rollup.config.js

@@ -3,13 +3,9 @@ import git from "git-rev-sync";
 import typescript from 'rollup-plugin-typescript2';
 import { terser } from "rollup-plugin-terser";
 
-const name = "owl";
-const extend = true;
 
-/**
- * Meta data to be added on the __info__ object.
- * Used to let external tools know the current owl version.
- */
+let input, output;
+
 const outro = `
 __info__.version = '${pkg.version}';
 __info__.date = '${new Date().toISOString()}';
@@ -17,13 +13,39 @@ __info__.hash = '${git.short()}';
 __info__.url = 'https://github.com/odoo/owl';
 `;
 
+switch (process.argv[4]) {
+  case "compiler": 
+    input = "src/compiler/index.ts",
+    output = [
+      getConfigForFormat('cjs', 'dist/compiler.js', ''),
+    ]
+    break;
+  case "runtime":
+    input = "src/runtime/index.ts";
+    output = [
+      getConfigForFormat('esm', addSuffix(pkg.module,  'runtime'), outro),
+      getConfigForFormat('cjs', addSuffix(pkg.main,  'runtime'), outro),
+      getConfigForFormat('iife', addSuffix(pkg.browser,  'runtime'), outro),
+      getConfigForFormat('iife', addSuffix(pkg.browser,  'runtime'), outro, true),
+    ]
+    break;
+  default:
+    input = "src/index.ts",
+    output = [
+      getConfigForFormat('esm', pkg.module, outro),
+      getConfigForFormat('cjs', pkg.main, outro),
+      getConfigForFormat('iife', pkg.browser, outro),
+      getConfigForFormat('iife', pkg.browser, outro, true),
+    ]
+  }
+
 /**
  * Generate from a string depicting a path a new path for the minified version.
  * @param {string} pkgFileName file name
  */
-function generateMinifiedNameFromPkgName(pkgFileName) {
+function addSuffix(pkgFileName, suffix) {
   const parts = pkgFileName.split('.');
-  parts.splice(parts.length - 1, 0, "min");
+  parts.splice(parts.length - 1, 0, suffix);
   return parts.join('.');
 }
 
@@ -33,12 +55,12 @@ function generateMinifiedNameFromPkgName(pkgFileName) {
  * @param {string} generatedFileName generated file name
  * @param {boolean} minified should it be minified
  */
-function getConfigForFormat(format, generatedFileName, minified = false) {
+function getConfigForFormat(format, generatedFileName, outro, minified = false) {
   return {
-    file: minified ? generateMinifiedNameFromPkgName(generatedFileName) : generatedFileName,
+    file: minified ? addSuffix(generatedFileName, "min") : generatedFileName,
     format: format,
-    name: name,
-    extend: extend,
+    name: "owl",
+    extend: true,
     outro: outro,
     freeze: false,
     plugins: minified ? [terser()] : [],
@@ -47,22 +69,8 @@ function getConfigForFormat(format, generatedFileName, minified = false) {
 }
 
 export default {
-  input: "src/index.ts",
-  output: [
-
-    /**
-     * Read about module formats:
-     *  https://auth0.com/blog/javascript-module-systems-showdown/
-     *  https://medium.com/@kelin2025/so-you-wanna-use-es6-modules-714f48b3a953
-     */
-
-    getConfigForFormat('esm', pkg.module),
-    getConfigForFormat('esm', pkg.module, true),
-    getConfigForFormat('cjs', pkg.main),
-    getConfigForFormat('cjs', pkg.main, true),
-    getConfigForFormat('iife', pkg.browser),
-    getConfigForFormat('iife', pkg.browser, true),
-  ],
+  input,
+  output,
   plugins: [
     typescript({
       useTsconfigDeclarationDir: true

src/compiler/code_generator.ts

@@ -42,17 +42,20 @@ export interface CodeGenOptions extends Config {
 const xmlDoc = document.implementation.createDocument(null, null, null);
 
 const MODS = new Set(["stop", "capture", "prevent", "self", "synthetic"]);
+
+let nextDataIds: { [key: string]: number } = {};
+
+function generateId(prefix: string = "") {
+  nextDataIds[prefix] = (nextDataIds[prefix] || 0) + 1;
+  return prefix + nextDataIds[prefix];
+}
+
 // -----------------------------------------------------------------------------
 // BlockDescription
 // -----------------------------------------------------------------------------
 
 class BlockDescription {
   static nextBlockId = 1;
-  static nextDataIds: { [key: string]: number } = {};
-  static generateId(prefix: string) {
-    this.nextDataIds[prefix] = (this.nextDataIds[prefix] || 0) + 1;
-    return prefix + this.nextDataIds[prefix];
-  }
 
   varName: string;
   blockName: string;
@@ -78,7 +81,7 @@ class BlockDescription {
   }
 
   insertData(str: string, prefix: string = "d"): number {
-    const id = BlockDescription.generateId(prefix);
+    const id = generateId(prefix);
     this.target.addLine(`let ${id} = ${str};`);
     return this.data.push(id) - 1;
   }
@@ -209,7 +212,6 @@ const translationRE = /^(\s*)([\s\S]+?)(\s*)$/;
 
 export class CodeGenerator {
   blocks: BlockDescription[] = [];
-  ids: { [key: string]: number } = {};
   nextBlockId = 1;
   hasSafeContext: boolean;
   isDebug: boolean = false;
@@ -246,7 +248,7 @@ export class CodeGenerator {
     const ast = this.ast;
     this.isDebug = ast.type === ASTType.TDebug;
     BlockDescription.nextBlockId = 1;
-    BlockDescription.nextDataIds = {};
+    nextDataIds = {};
     this.compileAST(ast, {
       block: null,
       index: 0,
@@ -308,7 +310,7 @@ export class CodeGenerator {
   }
 
   compileInNewTarget(prefix: string, ast: AST, ctx: Context, on?: EventHandlers | null): string {
-    const name = this.generateId(prefix);
+    const name = generateId(prefix);
     const initialTarget = this.target;
     const target = new CodeTarget(name, on);
     this.targets.push(target);
@@ -326,11 +328,6 @@ export class CodeGenerator {
     this.addLine(`const ${varName} = ${expr};`);
   }
 
-  generateId(prefix: string = ""): string {
-    this.ids[prefix] = (this.ids[prefix] || 0) + 1;
-    return prefix + this.ids[prefix];
-  }
-
   insertAnchor(block: BlockDescription) {
     const tag = `block-child-${block.children.length}`;
     const anchor = xmlDoc.createElement(tag);
@@ -407,7 +404,7 @@ export class CodeGenerator {
       .map((tok) => {
         if (tok.varName && !tok.isLocal) {
           if (!mapping.has(tok.varName)) {
-            const varId = this.generateId("v");
+            const varId = generateId("v");
             mapping.set(tok.varName, varId);
             this.define(varId, tok.value);
           }
@@ -553,7 +550,7 @@ export class CodeGenerator {
       block = this.createBlock(block, "block", ctx);
       this.blocks.push(block);
       if (ast.dynamicTag) {
-        const tagExpr = this.generateId("tag");
+        const tagExpr = generateId("tag");
         this.define(tagExpr, compileExpr(ast.dynamicTag));
         block.dynamicTagName = tagExpr;
       }
@@ -625,7 +622,7 @@ export class CodeGenerator {
           attrs["block-ref"] = String(index);
           info[1] = `multiRefSetter(refs, \`${name}\`)`;
         } else {
-          let id = this.generateId("ref");
+          let id = generateId("ref");
           this.target.refInfo[name] = [id, `(el) => refs[\`${name}\`] = el`];
           const index = block!.data.push(id) - 1;
           attrs["block-ref"] = String(index);
@@ -648,11 +645,11 @@ export class CodeGenerator {
       } = ast.model;
 
       const baseExpression = compileExpr(baseExpr);
-      const bExprId = this.generateId("bExpr");
+      const bExprId = generateId("bExpr");
       this.define(bExprId, baseExpression);
 
       const expression = compileExpr(expr);
-      const exprId = this.generateId("expr");
+      const exprId = generateId("expr");
       this.define(exprId, expression);
 
       const fullExpression = `${bExprId}[${exprId}]`;
@@ -662,7 +659,7 @@ export class CodeGenerator {
         idx = block!.insertData(`${fullExpression} === '${attrs[targetAttr]}'`, "attr");
         attrs[`block-attribute-${idx}`] = specialInitTargetAttr;
       } else if (hasDynamicChildren) {
-        const bValueId = this.generateId("bValue");
+        const bValueId = generateId("bValue");
         tModelSelectedExpr = `${bValueId}`;
         this.define(tModelSelectedExpr, fullExpression);
       } else {
@@ -869,7 +866,7 @@ export class CodeGenerator {
     let id: string;
     if (ast.memo) {
       this.target.hasCache = true;
-      id = this.generateId();
+      id = generateId();
       this.define(`memo${id}`, compileExpr(ast.memo));
       this.define(`vnode${id}`, `cache[key${this.target.loopLevel}];`);
       this.addLine(`if (vnode${id}) {`);
@@ -904,7 +901,7 @@ export class CodeGenerator {
   }
 
   compileTKey(ast: ASTTKey, ctx: Context) {
-    const tKeyExpr = this.generateId("tKey_");
+    const tKeyExpr = generateId("tKey_");
     this.define(tKeyExpr, compileExpr(ast.expr));
     ctx = createContext(ctx, {
       tKeyExpr,
@@ -989,18 +986,19 @@ export class CodeGenerator {
     }
     const key = `key + \`${this.generateComponentKey()}\``;
     if (isDynamic) {
-      const templateVar = this.generateId("template");
+      const templateVar = generateId("template");
+      if (!this.staticDefs.find((d) => d.id === "call")) {
+        this.staticDefs.push({ id: "call", expr: `app.callTemplate.bind(app)` });
+      }
       this.define(templateVar, subTemplate);
       block = this.createBlock(block, "multi", ctx);
-      this.helpers.add("call");
       this.insertBlock(`call(this, ${templateVar}, ctx, node, ${key})`, block!, {
         ...ctx,
         forceNewBlock: !block,
       });
     } else {
-      const id = this.generateId(`callTemplate_`);
-      this.helpers.add("getTemplate");
-      this.staticDefs.push({ id, expr: `getTemplate(${subTemplate})` });
+      const id = generateId(`callTemplate_`);
+      this.staticDefs.push({ id, expr: `app.getTemplate(${subTemplate})` });
       block = this.createBlock(block, "multi", ctx);
       this.insertBlock(`${id}.call(this, ctx, node, ${key})`, block!, {
         ...ctx,
@@ -1051,7 +1049,7 @@ export class CodeGenerator {
   }
 
   generateComponentKey() {
-    const parts = [this.generateId("__")];
+    const parts = [generateId("__")];
     for (let i = 0; i < this.target.loopLevel; i++) {
       parts.push(`\${key${i + 1}}`);
     }
@@ -1108,7 +1106,7 @@ export class CodeGenerator {
     if (ast.slots) {
       let ctxStr = "ctx";
       if (this.target.loopLevel || !this.hasSafeContext) {
-        ctxStr = this.generateId("ctx");
+        ctxStr = generateId("ctx");
         this.helpers.add("capture");
         this.define(ctxStr, `capture(ctx)`);
       }
@@ -1149,7 +1147,7 @@ export class CodeGenerator {
 
     let propVar: string;
     if ((slotDef && (ast.dynamicProps || hasSlotsProp)) || this.dev) {
-      propVar = this.generateId("props");
+      propVar = generateId("props");
       this.define(propVar!, propString);
       propString = propVar!;
     }
@@ -1163,7 +1161,7 @@ export class CodeGenerator {
     const key = this.generateComponentKey();
     let expr: string;
     if (ast.isDynamic) {
-      expr = this.generateId("Comp");
+      expr = generateId("Comp");
       this.define(expr, compileExpr(ast.name));
     } else {
       expr = `\`${ast.name}\``;
@@ -1199,11 +1197,11 @@ export class CodeGenerator {
 
   wrapWithEventCatcher(expr: string, on: EventHandlers): string {
     this.helpers.add("createCatcher");
-    let name = this.generateId("catcher");
+    let name = generateId("catcher");
     let spec: any = {};
     let handlers: any[] = [];
     for (let ev in on) {
-      let handlerId = this.generateId("hdlr");
+      let handlerId = generateId("hdlr");
       let idx = handlers.push(handlerId) - 1;
       spec[ev] = idx;
       const handler = this.generateHandlerCode(ev, on[ev]);
@@ -1232,7 +1230,7 @@ export class CodeGenerator {
       blockString = `callSlot(ctx, node, key, ${slotName}, ${dynamic}, ${scope}, ${name})`;
     } else {
       if (dynamic) {
-        let name = this.generateId("slot");
+        let name = generateId("slot");
         this.define(name, slotName);
         blockString = `toggler(${name}, callSlot(ctx, node, key, ${name}, ${dynamic}, ${scope}))`;
       } else {
@@ -1257,18 +1255,21 @@ export class CodeGenerator {
     }
   }
   compileTPortal(ast: ASTTPortal, ctx: Context) {
-    this.helpers.add("Portal");
+    if (!this.staticDefs.find((d) => d.id === "Portal")) {
+      this.staticDefs.push({ id: "Portal", expr: `app.Portal` });
+    }
 
     let { block } = ctx;
     const name = this.compileInNewTarget("slot", ast.content, ctx);
     const key = this.generateComponentKey();
     let ctxStr = "ctx";
     if (this.target.loopLevel || !this.hasSafeContext) {
-      ctxStr = this.generateId("ctx");
+      ctxStr = generateId("ctx");
       this.helpers.add("capture");
       this.define(ctxStr, `capture(ctx);`);
     }
-    const blockString = `component(Portal, {target: ${ast.target},slots: {'default': {__render: ${name}, __ctx: ${ctxStr}}}}, key + \`${key}\`, node, ctx)`;
+    const target = compileExpr(ast.target);
+    const blockString = `component(Portal, {target: ${target},slots: {'default': {__render: ${name}, __ctx: ${ctxStr}}}}, key + \`${key}\`, node, ctx)`;
     if (block) {
       this.insertAnchor(block);
     }

src/compiler/index.ts

@@ -1,10 +1,11 @@
-import type { BDom } from "../blockdom";
+import type { TemplateSet } from "../runtime/template_set";
+import type { BDom } from "../runtime/blockdom";
 import { CodeGenerator, Config } from "./code_generator";
 import { parse } from "./parser";
 
 export type Template = (context: any, vnode: any, key?: string) => BDom;
 
-export type TemplateFunction = (blocks: any, utils: any) => Template;
+export type TemplateFunction = (app: TemplateSet, bdom: any, helpers: any) => Template;
 
 interface CompileOptions extends Config {
   name?: string;
@@ -26,5 +27,5 @@ export function compile(
   const codeGenerator = new CodeGenerator(ast, { ...options, hasSafeContext });
   const code = codeGenerator.generateCode();
   // template function
-  return new Function("bdom, helpers", code) as TemplateFunction;
+  return new Function("app, bdom, helpers", code) as TemplateFunction;
 }

src/compiler/inline_expressions.ts

@@ -85,8 +85,10 @@ const STATIC_TOKEN_MAP: { [key: string]: TKind } = Object.assign(Object.create(n
 });
 
 // note that the space after typeof is relevant. It makes sure that the formatted
-// expression has a space after typeof
-const OPERATORS = "...,.,===,==,+,!==,!=,!,||,&&,>=,>,<=,<,?,-,*,/,%,typeof ,=>,=,;,in ".split(",");
+// expression has a space after typeof. Currently we don't support delete and void
+const OPERATORS = "...,.,===,==,+,!==,!=,!,||,&&,>=,>,<=,<,?,-,*,/,%,typeof ,=>,=,;,in ,new ".split(
+  ","
+);
 
 type Tokenizer = (expr: string) => Token | false;
 
@@ -344,9 +346,12 @@ export function compileExprToArray(expr: string): Token[] {
   return tokens;
 }
 
+// Leading spaces are trimmed during tokenization, so they need to be added back for some values
+const paddedValues = new Map([["in ", " in "]]);
+
 export function compileExpr(expr: string): string {
   return compileExprToArray(expr)
-    .map((t) => t.value)
+    .map((t) => paddedValues.get(t.value) || t.value)
     .join("");
 }
 

src/component/props_validation.ts

@@ -1,150 +0,0 @@
-import { ComponentConstructor } from "./component";
-
-/**
- * Apply default props (only top level).
- *
- * Note that this method does modify in place the props
- */
-export function applyDefaultProps<P>(props: P, ComponentClass: ComponentConstructor<P>) {
-  const defaultProps = ComponentClass.defaultProps;
-  if (defaultProps) {
-    for (let propName in defaultProps) {
-      if ((props as any)[propName] === undefined) {
-        (props as any)[propName] = defaultProps[propName];
-      }
-    }
-  }
-}
-
-//------------------------------------------------------------------------------
-// Prop validation helper
-//------------------------------------------------------------------------------
-function getPropDescription(staticProps: any) {
-  if (staticProps instanceof Array) {
-    return Object.fromEntries(
-      staticProps.map((p) => (p.endsWith("?") ? [p.slice(0, -1), false] : [p, true]))
-    );
-  }
-  return staticProps || { "*": true };
-}
-
-/**
- * Validate the component props (or next props) against the (static) props
- * description.  This is potentially an expensive operation: it may needs to
- * visit recursively the props and all the children to check if they are valid.
- * This is why it is only done in 'dev' mode.
- */
-export function validateProps<P>(name: string | ComponentConstructor<P>, props: P, parent?: any) {
-  const ComponentClass =
-    typeof name !== "string"
-      ? name
-      : (parent.constructor.components[name] as ComponentConstructor<P> | undefined);
-
-  if (!ComponentClass) {
-    // this is an error, wrong component. We silently return here instead so the
-    // error is triggered by the usual path ('component' function)
-    return;
-  }
-  applyDefaultProps(props, ComponentClass);
-
-  const defaultProps = ComponentClass.defaultProps || {};
-  let propsDef = getPropDescription(ComponentClass.props);
-  const allowAdditionalProps = "*" in propsDef;
-
-  for (let propName in propsDef) {
-    if (propName === "*") {
-      continue;
-    }
-    const propDef = propsDef[propName];
-    let isMandatory = !!propDef;
-    if (typeof propDef === "object" && "optional" in propDef) {
-      isMandatory = !propDef.optional;
-    }
-    if (isMandatory && propName in defaultProps) {
-      throw new Error(
-        `A default value cannot be defined for a mandatory prop (name: '${propName}', component: ${ComponentClass.name})`
-      );
-    }
-    if ((props as any)[propName] === undefined) {
-      if (isMandatory) {
-        throw new Error(`Missing props '${propName}' (component '${ComponentClass.name}')`);
-      } else {
-        continue;
-      }
-    }
-    let isValid;
-    try {
-      isValid = isValidProp((props as any)[propName], propDef);
-    } catch (e) {
-      (e as Error).message = `Invalid prop '${propName}' in component ${ComponentClass.name} (${
-        (e as Error).message
-      })`;
-      throw e;
-    }
-    if (!isValid) {
-      throw new Error(`Invalid Prop '${propName}' in component '${ComponentClass.name}'`);
-    }
-  }
-  if (!allowAdditionalProps) {
-    for (let propName in props) {
-      if (!(propName in propsDef)) {
-        throw new Error(`Unknown prop '${propName}' given to component '${ComponentClass.name}'`);
-      }
-    }
-  }
-}
-
-/**
- * Check if an invidual prop value matches its (static) prop definition
- */
-function isValidProp(prop: any, propDef: any): boolean {
-  if (propDef === true) {
-    return true;
-  }
-  if (typeof propDef === "function") {
-    // Check if a value is constructed by some Constructor.  Note that there is a
-    // slight abuse of language: we want to consider primitive values as well.
-    //
-    // So, even though 1 is not an instance of Number, we want to consider that
-    // it is valid.
-    if (typeof prop === "object") {
-      return prop instanceof propDef;
-    }
-    return typeof prop === propDef.name.toLowerCase();
-  } else if (propDef instanceof Array) {
-    // If this code is executed, this means that we want to check if a prop
-    // matches at least one of its descriptor.
-    let result = false;
-    for (let i = 0, iLen = propDef.length; i < iLen; i++) {
-      result = result || isValidProp(prop, propDef[i]);
-    }
-    return result;
-  }
-  // propsDef is an object
-  if (propDef.optional && prop === undefined) {
-    return true;
-  }
-  let result = propDef.type ? isValidProp(prop, propDef.type) : true;
-  if (propDef.validate) {
-    result = result && propDef.validate(prop);
-  }
-  if (propDef.type === Array && propDef.element) {
-    for (let i = 0, iLen = prop.length; i < iLen; i++) {
-      result = result && isValidProp(prop[i], propDef.element);
-    }
-  }
-  if (propDef.type === Object && propDef.shape) {
-    const shape = propDef.shape;
-    for (let key in shape) {
-      result = result && isValidProp(prop[key], shape[key]);
-    }
-    if (result) {
-      for (let propName in prop) {
-        if (!(propName in shape)) {
-          throw new Error(`unknown prop '${propName}'`);
-        }
-      }
-    }
-  }
-  return result;
-}

src/index.ts

@@ -1,56 +1,16 @@
-import {
-  config,
-  createBlock,
-  html,
-  list,
-  mount as blockMount,
-  multi,
-  patch,
-  remove,
-  text,
-  toggler,
-  comment,
-} from "./blockdom";
-import { mainEventHandler } from "./component/handler";
-export type { Reactive } from "./reactivity";
+import { TemplateSet } from "./runtime/template_set";
+import { compile } from "./compiler";
 
-config.shouldNormalizeDom = false;
-config.mainEventHandler = mainEventHandler;
+export * from "./runtime";
 
-export const blockDom = {
-  config,
-  // bdom entry points
-  mount: blockMount,
-  patch,
-  remove,
-  // bdom block types
-  list,
-  multi,
-  text,
-  toggler,
-  createBlock,
-  html,
-  comment,
+TemplateSet.prototype._compileTemplate = function _compileTemplate(
+  name: string,
+  template: string | Element
+) {
+  return compile(template, {
+    name,
+    dev: this.dev,
+    translateFn: this.translateFn,
+    translatableAttributes: this.translatableAttributes,
+  });
 };
-
-export { App, mount } from "./app/app";
-export { Component } from "./component/component";
-export { useComponent, useState } from "./component/component_node";
-export { status } from "./component/status";
-export { reactive, markRaw, toRaw } from "./reactivity";
-export { useEffect, useEnv, useExternalListener, useRef, useChildSubEnv, useSubEnv } from "./hooks";
-export { EventBus, whenReady, loadFile, markup, xml } from "./utils";
-export {
-  onWillStart,
-  onMounted,
-  onWillUnmount,
-  onWillUpdateProps,
-  onWillPatch,
-  onPatched,
-  onWillRender,
-  onRendered,
-  onWillDestroy,
-  onError,
-} from "./component/lifecycle_hooks";
-
-export const __info__ = {};

src/runtime/app.ts

@@ -1,10 +1,11 @@
-import { Component, ComponentConstructor } from "../component/component";
-import { ComponentNode } from "../component/component_node";
-import { MountOptions } from "../component/fibers";
-import { Scheduler } from "../component/scheduler";
+import { Component, ComponentConstructor } from "./component";
+import { ComponentNode } from "./component_node";
+import { MountOptions } from "./fibers";
+import { Scheduler } from "./scheduler";
 import { TemplateSet, TemplateSetConfig } from "./template_set";
-import { nodeErrorHandlers } from "../component/error_handling";
-import { validateTarget } from "../utils";
+import { nodeErrorHandlers } from "./error_handling";
+import { validateTarget } from "./utils";
+import { validateProps } from "./template_helpers";
 
 // reimplement dev mode stuff see last change in 0f7a8289a6fb8387c3c1af41c6664b2a8448758f
 
@@ -16,6 +17,7 @@ export interface AppConfig<P, E> extends TemplateSetConfig {
   props?: P;
   env?: E;
   test?: boolean;
+  warnIfNoStaticProps?: boolean;
 }
 
 let hasBeenLogged = false;
@@ -41,6 +43,7 @@ export class App<
   env: E;
   scheduler = new Scheduler();
   root: ComponentNode<P, E> | null = null;
+  warnIfNoStaticProps: boolean;
 
   constructor(Root: ComponentConstructor<P, E>, config: AppConfig<P, E> = {}) {
     super(config);
@@ -48,6 +51,7 @@ export class App<
     if (config.test) {
       this.dev = true;
     }
+    this.warnIfNoStaticProps = config.warnIfNoStaticProps || false;
     if (this.dev && !config.test && !hasBeenLogged) {
       console.info(DEV_MSG());
       hasBeenLogged = true;
@@ -60,6 +64,9 @@ export class App<
 
   mount(target: HTMLElement, options?: MountOptions): Promise<Component<P, E> & InstanceType<T>> {
     App.validateTarget(target);
+    if (this.dev) {
+      validateProps(this.Root, this.props, { __owl__: { app: this } });
+    }
     const node = this.makeNode(this.Root, this.props);
     const prom = this.mountNode(node, target, options);
     this.root = node;

src/runtime/component.ts

@@ -1,3 +1,4 @@
+import { Schema } from "./validation";
 import type { ComponentNode } from "./component_node";
 
 // -----------------------------------------------------------------------------
@@ -9,7 +10,8 @@ type Props = { [key: string]: any };
 interface StaticComponentProperties {
   template: string;
   defaultProps?: any;
-  props?: any;
+  props?: Schema;
+  components?: { [componentName: string]: ComponentConstructor };
 }
 
 export type ComponentConstructor<P extends Props = any, E = any> = (new (
@@ -37,6 +39,6 @@ export class Component<Props = any, Env = any> {
   setup() {}
 
   render(deep: boolean = false) {
-    this.__owl__.render(deep);
+    this.__owl__.render(deep === true);
   }
 }

src/runtime/component_node.ts

@@ -1,18 +1,18 @@
-import type { App, Env } from "../app/app";
-import { BDom, VNode } from "../blockdom";
+import type { App, Env } from "./app";
+import { BDom, VNode } from "./blockdom";
 import {
   clearReactivesForCallback,
   getSubscriptions,
   NonReactive,
   Reactive,
   reactive,
+  toRaw,
   TARGET,
-} from "../reactivity";
-import { batched, Callback } from "../utils";
+} from "./reactivity";
+import { batched, Callback } from "./utils";
 import { Component, ComponentConstructor } from "./component";
 import { fibersInError, handleError } from "./error_handling";
 import { Fiber, makeChildFiber, makeRootFiber, MountFiber, MountOptions } from "./fibers";
-import { applyDefaultProps } from "./props_validation";
 import { STATUS } from "./status";
 
 let currentNode: ComponentNode | null = null;
@@ -28,6 +28,18 @@ export function useComponent(): Component {
   return currentNode!.component;
 }
 
+/**
+ * Apply default props (only top level).
+ *
+ * Note that this method does modify in place the props
+ */
+function applyDefaultProps<P>(props: P, defaultProps: Partial<P>) {
+  for (let propName in defaultProps) {
+    if ((props as any)[propName] === undefined) {
+      (props as any)[propName] = defaultProps[propName];
+    }
+  }
+}
 // -----------------------------------------------------------------------------
 // Integration with reactivity system (useState)
 // -----------------------------------------------------------------------------
@@ -47,7 +59,7 @@ export function useState<T extends object>(state: T): Reactive<T> | NonReactive<
   const node = getCurrent();
   let render = batchedRenderFunctions.get(node)!;
   if (!render) {
-    render = batched(node.render.bind(node));
+    render = batched(node.render.bind(node, false));
     batchedRenderFunctions.set(node, render);
     // manual implementation of onWillDestroy to break cyclic dependency
     node.willDestroy.push(clearReactivesForCallback.bind(null, render));
@@ -62,14 +74,16 @@ type Props = { [key: string]: any };
 
 function arePropsDifferent(props1: Props, props2: Props): boolean {
   for (let k in props1) {
-    if (props1[k] !== props2[k]) {
+    const prop1 = props1[k] && typeof props1[k] === "object" ? toRaw(props1[k]) : props1[k];
+    const prop2 = props2[k] && typeof props2[k] === "object" ? toRaw(props2[k]) : props2[k];
+    if (prop1 !== prop2) {
       return true;
     }
   }
   return Object.keys(props1).length !== Object.keys(props2).length;
 }
 
-export function component<P extends object>(
+export function component<P extends Props>(
   name: string | ComponentConstructor<P>,
   props: P,
   key: string,
@@ -92,7 +106,7 @@ export function component<P extends object>(
     if (shouldRender) {
       node.forceNextRender = false;
     } else {
-      const currentProps = node.component.props[TARGET];
+      const currentProps = node.component.props;
       shouldRender = parentFiber.deep || arePropsDifferent(currentProps, props);
     }
     if (shouldRender) {
@@ -107,6 +121,8 @@ export function component<P extends object>(
       C = parent.constructor.components[name as any];
       if (!C) {
         throw new Error(`Cannot find the definition of component "${name}"`);
+      } else if (!(C.prototype instanceof Component)) {
+        throw new Error(`"${name}" is not a Component. It must inherit from the Component class`);
       }
     }
     node = new ComponentNode(C, props, ctx.app, ctx, key);
@@ -123,7 +139,7 @@ export function component<P extends object>(
 
 type LifecycleHook = Function;
 
-export class ComponentNode<P extends object = any, E = any> implements VNode<ComponentNode<P, E>> {
+export class ComponentNode<P extends Props = any, E = any> implements VNode<ComponentNode<P, E>> {
   el?: HTMLElement | Text | undefined;
   app: App;
   fiber: Fiber | null = null;
@@ -160,11 +176,19 @@ export class ComponentNode<P extends object = any, E = any> implements VNode<Com
     this.parent = parent;
     this.parentKey = parentKey;
     this.level = parent ? parent.level + 1 : 0;
-    applyDefaultProps(props, C);
+    const defaultProps = C.defaultProps;
+    if (defaultProps) {
+      applyDefaultProps(props, defaultProps);
+    }
     const env = (parent && parent.childEnv) || app.env;
     this.childEnv = env;
-    props = useState(props);
-    this.component = new C(props, env, this) as any;
+    for (const key in props) {
+      const prop = props[key];
+      if (prop && typeof prop === "object" && prop[TARGET]) {
+        props[key] = useState(prop);
+      }
+    }
+    this.component = new C(props, env, this);
     this.renderFn = app.getTemplate(C.template).bind(this.component, this.component, this);
     this.component.setup();
     currentNode = null;
@@ -193,7 +217,7 @@ export class ComponentNode<P extends object = any, E = any> implements VNode<Com
     }
   }
 
-  async render(deep: boolean = false) {
+  async render(deep: boolean) {
     let current = this.fiber;
     if (current && (current.root!.locked || (current as any).bdom === true)) {
       await Promise.resolve();
@@ -269,15 +293,23 @@ export class ComponentNode<P extends object = any, E = any> implements VNode<Com
     this.status = STATUS.DESTROYED;
   }
 
-  async updateAndRender(props: any, parentFiber: Fiber) {
+  async updateAndRender(props: P, parentFiber: Fiber) {
     // update
     const fiber = makeChildFiber(this, parentFiber);
     this.fiber = fiber;
     const component = this.component;
-    applyDefaultProps(props, component.constructor as any);
+    const defaultProps = (component.constructor as any).defaultProps;
+    if (defaultProps) {
+      applyDefaultProps(props, defaultProps);
+    }
 
     currentNode = this;
-    props = useState(props);
+    for (const key in props) {
+      const prop = props[key];
+      if (prop && typeof prop === "object" && prop[TARGET]) {
+        props[key] = useState(prop);
+      }
+    }
     currentNode = null;
     const prom = Promise.all(this.willUpdateProps.map((f) => f.call(component, props)));
     await prom;

src/runtime/event_handling.ts

@@ -1,4 +1,4 @@
-import { filterOutModifiersFromData } from "../blockdom/config";
+import { filterOutModifiersFromData } from "./blockdom/config";
 import { STATUS } from "./status";
 
 export const mainEventHandler = (data: any, ev: Event, currentTarget?: EventTarget | null) => {

src/runtime/fibers.ts

@@ -1,4 +1,4 @@
-import { BDom, mount } from "../blockdom";
+import { BDom, mount } from "./blockdom";
 import type { ComponentNode } from "./component_node";
 import { fibersInError, handleError } from "./error_handling";
 import { STATUS } from "./status";
@@ -42,6 +42,10 @@ export function makeRootFiber(node: ComponentNode): Fiber {
   return fiber;
 }
 
+function throwOnRender() {
+  throw new Error("Attempted to render cancelled fiber");
+}
+
 /**
  * @returns number of not-yet rendered fibers cancelled
  */
@@ -49,6 +53,7 @@ function cancelFibers(fibers: Fiber[]): number {
   let result = 0;
   for (let fiber of fibers) {
     let node = fiber.node;
+    fiber.render = throwOnRender;
     if (node.status === STATUS.NEW) {
       node.destroy();
     }

src/runtime/hooks.ts

@@ -1,6 +1,6 @@
-import type { Env } from "./app/app";
-import { getCurrent } from "./component/component_node";
-import { onMounted, onPatched, onWillUnmount } from "./component/lifecycle_hooks";
+import type { Env } from "./app";
+import { getCurrent } from "./component_node";
+import { onMounted, onPatched, onWillUnmount } from "./lifecycle_hooks";
 
 // -----------------------------------------------------------------------------
 // useRef

src/runtime/index.ts

@@ -0,0 +1,58 @@
+import {
+  config,
+  createBlock,
+  html,
+  list,
+  mount as blockMount,
+  multi,
+  patch,
+  remove,
+  text,
+  toggler,
+  comment,
+} from "./blockdom";
+import { mainEventHandler } from "./event_handling";
+export type { Reactive } from "./reactivity";
+
+config.shouldNormalizeDom = false;
+config.mainEventHandler = mainEventHandler;
+
+export const blockDom = {
+  config,
+  // bdom entry points
+  mount: blockMount,
+  patch,
+  remove,
+  // bdom block types
+  list,
+  multi,
+  text,
+  toggler,
+  createBlock,
+  html,
+  comment,
+};
+
+export { App, mount } from "./app";
+export { xml } from "./template_set";
+export { Component } from "./component";
+export { useComponent, useState } from "./component_node";
+export { status } from "./status";
+export { reactive, markRaw, toRaw } from "./reactivity";
+export { useEffect, useEnv, useExternalListener, useRef, useChildSubEnv, useSubEnv } from "./hooks";
+export { EventBus, whenReady, loadFile, markup } from "./utils";
+export {
+  onWillStart,
+  onMounted,
+  onWillUnmount,
+  onWillUpdateProps,
+  onWillPatch,
+  onPatched,
+  onWillRender,
+  onRendered,
+  onWillDestroy,
+  onError,
+} from "./lifecycle_hooks";
+export { validate } from "./validation";
+
+export const __info__ = {};

src/runtime/portal.ts

@@ -1,7 +1,6 @@
-import { onWillUnmount } from "./component/lifecycle_hooks";
-import { xml } from "./utils";
+import { onWillUnmount } from "./lifecycle_hooks";
 import { BDom, text, VNode } from "./blockdom";
-import { Component } from "./component/component";
+import { Component } from "./component";
 
 const VText: any = text("").constructor;
 
@@ -53,8 +52,18 @@ class VPortal extends VText implements Partial<VNode<VPortal>> {
   }
 }
 
+/**
+ * <t t-slot="default"/>
+ */
+export function portalTemplate(app: any, bdom: any, helpers: any) {
+  let { callSlot } = helpers;
+  return function template(ctx: any, node: any, key = "") {
+    return callSlot(ctx, node, key, "default", false, null);
+  };
+}
+
 export class Portal extends Component {
-  static template = xml`<t t-slot="default"/>`;
+  static template = "__portal__";
   static props = {
     target: {
       type: String,

src/runtime/reactivity.ts

@@ -207,7 +207,7 @@ export function reactive<T extends Target>(
     return reactive(originalTarget, callback);
   }
   if (!reactiveCache.has(target)) {
-    reactiveCache.set(target, new Map());
+    reactiveCache.set(target, new WeakMap());
   }
   const reactivesForTarget = reactiveCache.get(target)!;
   if (!reactivesForTarget.has(callback)) {

src/runtime/scheduler.ts

@@ -32,7 +32,7 @@ export class Scheduler {
       let renders = this.delayedRenders;
       this.delayedRenders = [];
       for (let f of renders) {
-        if (f.root && f.node.status !== STATUS.DESTROYED) {
+        if (f.root && f.node.status !== STATUS.DESTROYED && f.node.fiber === f) {
           f.render();
         }
       }

src/runtime/template_helpers.ts

@@ -1,8 +1,9 @@
-import { BDom, multi, text, toggler, createCatcher } from "../blockdom";
-import { validateProps } from "../component/props_validation";
-import { Markup } from "../utils";
-import { html } from "../blockdom/index";
-import { TARGET } from "../reactivity";
+import { BDom, multi, text, toggler, createCatcher } from "./blockdom";
+import { Markup } from "./utils";
+import { html } from "./blockdom/index";
+import { isOptional, validateSchema } from "./validation";
+import type { ComponentConstructor } from "./component";
+import { markRaw } from "./reactivity";
 
 /**
  * This file contains utility functions that will be injected in each template,
@@ -23,7 +24,7 @@ function callSlot(
   defaultContent?: (ctx: any, node: any, key: string) => BDom
 ): BDom {
   key = key + "__slot_" + name;
-  const slots = ctx.props[TARGET].slots || {};
+  const slots = ctx.props.slots || {};
   const { __render, __ctx, __scope } = slots[name] || {};
   const slotScope = Object.create(__ctx || {});
   if (__scope) {
@@ -183,6 +184,52 @@ function multiRefSetter(refs: RefMap, name: string): RefSetter {
   };
 }
 
+/**
+ * Validate the component props (or next props) against the (static) props
+ * description.  This is potentially an expensive operation: it may needs to
+ * visit recursively the props and all the children to check if they are valid.
+ * This is why it is only done in 'dev' mode.
+ */
+export function validateProps<P>(name: string | ComponentConstructor<P>, props: P, parent?: any) {
+  const ComponentClass =
+    typeof name !== "string"
+      ? name
+      : (parent.constructor.components[name] as ComponentConstructor<P> | undefined);
+
+  if (!ComponentClass) {
+    // this is an error, wrong component. We silently return here instead so the
+    // error is triggered by the usual path ('component' function)
+    return;
+  }
+
+  const schema = ComponentClass.props;
+  if (!schema) {
+    if (parent.__owl__.app.warnIfNoStaticProps) {
+      console.warn(`Component '${ComponentClass.name}' does not have a static props description`);
+    }
+    return;
+  }
+  const defaultProps = ComponentClass.defaultProps;
+  if (defaultProps) {
+    let isMandatory = (name: string) =>
+      Array.isArray(schema)
+        ? schema.includes(name)
+        : name in schema && !("*" in schema) && !isOptional(schema[name]);
+    for (let p in defaultProps) {
+      if (isMandatory(p)) {
+        throw new Error(
+          `A default value cannot be defined for a mandatory prop (name: '${p}', component: ${ComponentClass.name})`
+        );
+      }
+    }
+  }
+
+  const errors = validateSchema(props, schema);
+  if (errors.length) {
+    throw new Error(`Invalid props for component '${ComponentClass.name}': ` + errors.join(", "));
+  }
+}
+
 export const helpers = {
   withDefault,
   zero: Symbol("zero"),
@@ -200,4 +247,5 @@ export const helpers = {
   safeOutput,
   bind,
   createCatcher,
+  markRaw,
 };

src/runtime/template_set.ts

@@ -1,10 +1,8 @@
-import { createBlock, html, list, multi, text, toggler, comment } from "../blockdom";
-import { compile, Template } from "../compiler";
-import { markRaw } from "../reactivity";
-import { Portal } from "../portal";
-import { component, getCurrent } from "../component/component_node";
+import { createBlock, html, list, multi, text, toggler, comment } from "./blockdom";
+import { compile, Template, TemplateFunction } from "../compiler";
+import { Portal, portalTemplate } from "./portal";
+import { component, getCurrent } from "./component_node";
 import { helpers } from "./template_helpers";
-import { globalTemplates } from "../utils";
 
 const bdom = { text, createBlock, list, multi, html, toggler, component, comment };
 
@@ -38,22 +36,6 @@ function parseXML(xml: string): Document {
   return doc;
 }
 
-/**
- * Returns the helpers object that will be injected in each template closure
- * function
- */
-function makeHelpers(getTemplate: (name: string) => Template): any {
-  return Object.assign({}, helpers, {
-    Portal,
-    markRaw,
-    getTemplate,
-    call: (owner: any, subTemplate: string, ctx: any, parent: any, key: any) => {
-      const template = getTemplate(subTemplate);
-      return toggler(subTemplate, template.call(owner, ctx, parent, key));
-    },
-  });
-}
-
 export interface TemplateSetConfig {
   dev?: boolean;
   translatableAttributes?: string[];
@@ -62,12 +44,15 @@ export interface TemplateSetConfig {
 }
 
 export class TemplateSet {
+  static registerTemplate(name: string, fn: TemplateFunction) {
+    globalTemplates[name] = fn;
+  }
   dev: boolean;
   rawTemplates: typeof globalTemplates = Object.create(globalTemplates);
   templates: { [name: string]: Template } = {};
   translateFn?: (s: string) => string;
   translatableAttributes?: string[];
-  helpers: any;
+  Portal = Portal;
 
   constructor(config: TemplateSetConfig = {}) {
     this.dev = config.dev || false;
@@ -76,21 +61,27 @@ export class TemplateSet {
     if (config.templates) {
       this.addTemplates(config.templates);
     }
-    this.helpers = makeHelpers(this.getTemplate.bind(this));
   }
 
-  addTemplate(
-    name: string,
-    template: string | Element,
-    options: { allowDuplicate?: boolean } = {}
-  ) {
-    if (name in this.rawTemplates && !options.allowDuplicate) {
-      throw new Error(`Template ${name} already defined`);
+  addTemplate(name: string, template: string | Element) {
+    if (name in this.rawTemplates) {
+      const rawTemplate = this.rawTemplates[name];
+      const currentAsString =
+        typeof rawTemplate === "string"
+          ? rawTemplate
+          : rawTemplate instanceof Element
+          ? rawTemplate.outerHTML
+          : rawTemplate.toString();
+      const newAsString = typeof template === "string" ? template : template.outerHTML;
+      if (currentAsString === newAsString) {
+        return;
+      }
+      throw new Error(`Template ${name} already defined with different content`);
     }
     this.rawTemplates[name] = template;
   }
 
-  addTemplates(xml: string | Document, options: { allowDuplicate?: boolean } = {}) {
+  addTemplates(xml: string | Document) {
     if (!xml) {
       // empty string
       return;
@@ -98,7 +89,7 @@ export class TemplateSet {
     xml = xml instanceof Document ? xml : parseXML(xml);
     for (const template of xml.querySelectorAll("[t-name]")) {
       const name = template.getAttribute("t-name")!;
-      this.addTemplate(name, template, options);
+      this.addTemplate(name, template);
     }
   }
 
@@ -113,25 +104,42 @@ export class TemplateSet {
         } catch {}
         throw new Error(`Missing template: "${name}"${extraInfo}`);
       }
-      const templateFn = this._compileTemplate(name, rawTemplate);
+      const isFn = typeof rawTemplate === "function" && !(rawTemplate instanceof Element);
+      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;
       this.templates[name] = function (context, parent) {
         return templates[name].call(this, context, parent);
       };
-      const template = templateFn(bdom, this.helpers);
+      const template = templateFn(this, bdom, helpers);
       this.templates[name] = template;
     }
     return this.templates[name];
   }
 
-  _compileTemplate(name: string, template: string | Element) {
-    return compile(template, {
-      name,
-      dev: this.dev,
-      translateFn: this.translateFn,
-      translatableAttributes: this.translatableAttributes,
-    });
+  _compileTemplate(name: string, template: string | Element): ReturnType<typeof compile> {
+    throw new Error(`Unable to compile a template. Please use owl full build instead`);
+  }
+
+  callTemplate(owner: any, subTemplate: string, ctx: any, parent: any, key: any): any {
+    const template = this.getTemplate(subTemplate);
+    return toggler(subTemplate, template.call(owner, ctx, parent, key));
   }
 }
+
+// -----------------------------------------------------------------------------
+//  xml tag helper
+// -----------------------------------------------------------------------------
+export const globalTemplates: { [key: string]: string | Element | TemplateFunction } = {};
+
+export function xml(...args: Parameters<typeof String.raw>) {
+  const name = `__template__${xml.nextId++}`;
+  const value = String.raw(...args);
+  globalTemplates[name] = value;
+  return name;
+}
+
+xml.nextId = 1;
+
+TemplateSet.registerTemplate("__portal__", portalTemplate);

src/runtime/utils.ts

@@ -73,17 +73,3 @@ export class Markup extends String {}
 export function markup(value: any) {
   return new Markup(value);
 }
-
-// -----------------------------------------------------------------------------
-//  xml tag helper
-// -----------------------------------------------------------------------------
-export const globalTemplates: { [key: string]: string | Element } = {};
-
-export function xml(...args: Parameters<typeof String.raw>) {
-  const name = `__template__${xml.nextId++}`;
-  const value = String.raw(...args);
-  globalTemplates[name] = value;
-  return name;
-}
-
-xml.nextId = 1;

src/runtime/validation.ts

@@ -0,0 +1,161 @@
+type BaseType =
+  | typeof String
+  | typeof Boolean
+  | typeof Number
+  | typeof Date
+  | typeof Object
+  | typeof Array
+  | true
+  | "*";
+
+type UnionType = (TypeInfo | BaseType)[];
+type TypeDescription = BaseType | UnionType | TypeInfo;
+
+interface TypeInfo {
+  type?: TypeDescription;
+  optional?: boolean;
+  validate?: Function;
+  shape?: Schema;
+  element?: TypeDescription;
+}
+
+type SimplifiedSchema = string[];
+type NormalizedSchema = { [key: string]: TypeDescription };
+export type Schema = SimplifiedSchema | NormalizedSchema;
+
+// -----------------------------------------------------------------------------
+// helpers
+// -----------------------------------------------------------------------------
+const isUnionType = (t: TypeDescription): t is UnionType => Array.isArray(t);
+const isBaseType = (t: TypeDescription): t is BaseType => typeof t !== "object";
+
+export function isOptional(t: TypeDescription): Boolean {
+  return typeof t === "object" && "optional" in t ? t.optional || false : false;
+}
+
+function describeType(type: BaseType): string {
+  return type === "*" || type === true ? "value" : type.name.toLowerCase();
+}
+
+function describe(info: TypeDescription): string {
+  if (isBaseType(info)) {
+    return describeType(info);
+  } else if (isUnionType(info)) {
+    return info.map(describe).join(" or ");
+  }
+  if ("element" in info) {
+    return `list of ${describe({ type: info.element, optional: false })}s`;
+  }
+  if ("shape" in (info as TypeInfo)) {
+    return `object`;
+  }
+  return describe(info.type || "*");
+}
+
+function toSchema(spec: SimplifiedSchema): NormalizedSchema {
+  return Object.fromEntries(
+    spec.map((e) =>
+      e.endsWith("?") ? [e.slice(0, -1), { optional: true }] : [e, { type: "*", optional: false }]
+    )
+  );
+}
+
+/**
+ * Main validate function
+ */
+export function validate(obj: { [key: string]: any }, spec: Schema) {
+  let errors = validateSchema(obj, spec);
+  if (errors.length) {
+    throw new Error("Invalid object: " + errors.join(", "));
+  }
+}
+
+/**
+ * Helper validate function, to get the list of errors. useful if one want to
+ * manipulate the errors without parsing an error object
+ */
+export function validateSchema(obj: { [key: string]: any }, schema: Schema): string[] {
+  if (Array.isArray(schema)) {
+    schema = toSchema(schema);
+  }
+  let errors = [];
+  // check if each value in obj has correct shape
+  for (let key in obj) {
+    if (key in schema) {
+      let result = validateType(key, obj[key], schema[key]);
+      if (result) {
+        errors.push(result);
+      }
+    } else if (!("*" in schema)) {
+      errors.push(`unknown key '${key}'`);
+    }
+  }
+  // check that all specified keys are defined in obj
+  for (let key in schema) {
+    const spec = schema[key];
+    if (key !== "*" && !isOptional(spec) && !(key in obj)) {
+      const isObj = typeof spec === "object" && !Array.isArray(spec);
+      const isAny = spec === "*" || (isObj && "type" in spec ? spec.type === "*" : isObj);
+      let detail = isAny ? "" : ` (should be a ${describe(spec)})`;
+      errors.push(`'${key}' is missing${detail}`);
+    }
+  }
+  return errors;
+}
+
+function validateBaseType(key: string, value: any, type: BaseType): string | null {
+  if (typeof type === "function") {
+    if (typeof value === "object") {
+      if (!(value instanceof type)) {
+        return `'${key}' is not a ${describeType(type)}`;
+      }
+    } else if (typeof value !== type.name.toLowerCase()) {
+      return `'${key}' is not a ${describeType(type)}`;
+    }
+  }
+  return null;
+}
+
+function validateArrayType(key: string, value: any, descr: TypeDescription): string | null {
+  if (!Array.isArray(value)) {
+    return `'${key}' is not a list of ${describe(descr)}s`;
+  }
+  for (let i = 0; i < value.length; i++) {
+    const error = validateType(`${key}[${i}]`, value[i], descr);
+    if (error) {
+      return error;
+    }
+  }
+  return null;
+}
+
+function validateType(key: string, value: any, descr: TypeDescription): string | null {
+  if (value === undefined) {
+    return isOptional(descr) ? null : `'${key}' is undefined (should be a ${describe(descr)})`;
+  } else if (isBaseType(descr)) {
+    return validateBaseType(key, value, descr);
+  } else if (isUnionType(descr)) {
+    let validDescr = descr.find((p) => !validateType(key, value, p));
+    return validDescr ? null : `'${key}' is not a ${describe(descr)}`;
+  }
+  let result: string | null = null;
+  if ("element" in descr) {
+    result = validateArrayType(key, value, descr.element!);
+  } else if ("shape" in descr && !result) {
+    if (typeof value !== "object" || Array.isArray(value)) {
+      result = `'${key}' is not an object`;
+    } else {
+      const errors = validateSchema(value, descr.shape!);
+      if (errors.length) {
+        result = `'${key}' has not the correct shape (${errors.join(", ")})`;
+      }
+    }
+  }
+  if ("type" in descr && !result) {
+    result = validateType(key, value, descr.type!);
+  }
+  if ("validate" in descr && !result) {
+    result = !descr.validate!(value) ? `'${key}' is not valid` : null;
+  }
+  return result;
+}

tests/__snapshots__/reactivity.test.ts.snap

@@ -47,7 +47,7 @@ exports[`Reactivity: useState concurrent renderings 3`] = `
 `;
 
 exports[`Reactivity: useState destroyed component before being mounted is inactive 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -64,7 +64,7 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
 `;
 
 exports[`Reactivity: useState destroyed component before being mounted is inactive 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -78,7 +78,7 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
 `;
 
 exports[`Reactivity: useState destroyed component is inactive 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -95,7 +95,7 @@ exports[`Reactivity: useState destroyed component is inactive 1`] = `
 `;
 
 exports[`Reactivity: useState destroyed component is inactive 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -109,7 +109,7 @@ exports[`Reactivity: useState destroyed component is inactive 2`] = `
 `;
 
 exports[`Reactivity: useState one components can subscribe twice to same context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -124,7 +124,7 @@ exports[`Reactivity: useState one components can subscribe twice to same context
 `;
 
 exports[`Reactivity: useState parent and children subscribed to same context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -139,7 +139,7 @@ exports[`Reactivity: useState parent and children subscribed to same context 1`]
 `;
 
 exports[`Reactivity: useState parent and children subscribed to same context 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -216,7 +216,7 @@ exports[`Reactivity: useState several nodes on different level use same context
 `;
 
 exports[`Reactivity: useState two components are updated in parallel 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -231,7 +231,7 @@ exports[`Reactivity: useState two components are updated in parallel 1`] = `
 `;
 
 exports[`Reactivity: useState two components are updated in parallel 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -245,7 +245,7 @@ exports[`Reactivity: useState two components are updated in parallel 2`] = `
 `;
 
 exports[`Reactivity: useState two components can subscribe to same context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -260,7 +260,7 @@ exports[`Reactivity: useState two components can subscribe to same context 1`] =
 `;
 
 exports[`Reactivity: useState two components can subscribe to same context 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -274,7 +274,7 @@ exports[`Reactivity: useState two components can subscribe to same context 2`] =
 `;
 
 exports[`Reactivity: useState two independent components on different levels are updated in parallel 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -289,7 +289,7 @@ exports[`Reactivity: useState two independent components on different levels are
 `;
 
 exports[`Reactivity: useState two independent components on different levels are updated in parallel 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -303,7 +303,7 @@ exports[`Reactivity: useState two independent components on different levels are
 `;
 
 exports[`Reactivity: useState two independent components on different levels are updated in parallel 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -317,7 +317,7 @@ exports[`Reactivity: useState two independent components on different levels are
 `;
 
 exports[`Reactivity: useState useContext=useState hook is reactive, for one component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -331,7 +331,7 @@ exports[`Reactivity: useState useContext=useState hook is reactive, for one comp
 `;
 
 exports[`Reactivity: useState useless atoms should be deleted 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -356,7 +356,7 @@ exports[`Reactivity: useState useless atoms should be deleted 1`] = `
 `;
 
 exports[`Reactivity: useState useless atoms should be deleted 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -370,7 +370,7 @@ exports[`Reactivity: useState useless atoms should be deleted 2`] = `
 `;
 
 exports[`Reactivity: useState very simple use, with initial value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`app App supports env with getters/setters 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -16,7 +16,7 @@ exports[`app App supports env with getters/setters 1`] = `
 `;
 
 exports[`app can configure an app with props 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -30,7 +30,7 @@ exports[`app can configure an app with props 1`] = `
 `;
 
 exports[`app destroy remove the widget from the DOM 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -41,3 +41,17 @@ exports[`app destroy remove the widget from the DOM 1`] = `
   }
 }"
 `;
+
+exports[`app warnIfNoStaticProps works as expected 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  let block1 = createBlock(\`<div><block-text-0/></div>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    let txt1 = ctx['message'];
+    return block1([txt1]);
+  }
+}"
+`;

tests/app/app.test.ts

@@ -1,5 +1,5 @@
-import { App, Component, xml } from "../../src";
-import { status } from "../../src/component/status";
+import { App, Component, mount, xml } from "../../src";
+import { status } from "../../src/runtime/status";
 import { makeTestFixture, snapshotEverything, nextTick, elem } from "../helpers";
 
 let fixture: HTMLElement;
@@ -59,4 +59,21 @@ describe("app", () => {
     await app.mount(fixture);
     expect(fixture.innerHTML).toBe("<div>333</div>");
   });
+
+  test("warnIfNoStaticProps works as expected", async () => {
+    let originalconsoleWarn = console.warn;
+    let mockConsoleWarn = jest.fn(() => {});
+    console.warn = mockConsoleWarn;
+
+    class Root extends Component {
+      static template = xml`<div t-esc="message"/>`;
+    }
+
+    await mount(Root, fixture, { dev: true, props: { messge: "hey" }, warnIfNoStaticProps: true });
+
+    console.warn = originalconsoleWarn;
+    expect(mockConsoleWarn).toBeCalledWith(
+      "Component 'Root' does not have a static props description"
+    );
+  });
 });

tests/blockdom/block.test.ts

@@ -1,4 +1,4 @@
-import { createBlock, mount, patch, remove, text } from "../../src/blockdom";
+import { createBlock, mount, patch, remove, text } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/block_attributes.test.ts

@@ -1,4 +1,4 @@
-import { mount, patch, createBlock } from "../../src/blockdom";
+import { mount, patch, createBlock } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/block_event_handling.test.ts

@@ -1,4 +1,4 @@
-import { mount, createBlock, multi, config, patch } from "../../src/blockdom";
+import { mount, createBlock, multi, config, patch } from "../../src/runtime/blockdom";
 // import { defaultHandler, setupMainHandler } from "../../src/bdom/block";
 import { makeTestFixture } from "./helpers";
 

tests/blockdom/block_refs.test.ts

@@ -1,4 +1,4 @@
-import { createBlock, mount, patch, remove } from "../../src/blockdom";
+import { createBlock, mount, patch, remove } from "../../src/runtime/blockdom";
 import { logStep } from "../helpers";
 import { makeTestFixture } from "./helpers";
 

tests/blockdom/comment.test.ts

@@ -1,4 +1,4 @@
-import { comment, mount } from "../../src/blockdom";
+import { comment, mount } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/event_catcher.test.ts

@@ -1,6 +1,6 @@
-import { config, createBlock, createCatcher, mount } from "../../src/blockdom";
+import { config, createBlock, createCatcher, mount } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
-import { mainEventHandler } from "../../src/component/handler";
+import { mainEventHandler } from "../../src/runtime/event_handling";
 
 //------------------------------------------------------------------------------
 // Setup and helpers

tests/blockdom/html.test.ts

@@ -1,4 +1,4 @@
-import { html, mount, patch, text } from "../../src/blockdom";
+import { html, mount, patch, text } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/list.test.ts

@@ -1,4 +1,13 @@
-import { list, mount, multi, patch, text, createBlock, VNode, withKey } from "../../src/blockdom";
+import {
+  list,
+  mount,
+  multi,
+  patch,
+  text,
+  createBlock,
+  VNode,
+  withKey,
+} from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/multi.test.ts

@@ -1,4 +1,4 @@
-import { mount, multi, patch, text, createBlock } from "../../src/blockdom";
+import { mount, multi, patch, text, createBlock } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/namespace.test.ts

@@ -1,4 +1,4 @@
-import { createBlock, mount } from "../../src/blockdom";
+import { createBlock, mount } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/remove_hook.test.ts

@@ -1,4 +1,4 @@
-import { createBlock, mount, multi, patch } from "../../src/blockdom";
+import { createBlock, mount, multi, patch } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/text.test.ts

@@ -1,4 +1,4 @@
-import { mount, patch, remove, text } from "../../src/blockdom";
+import { mount, patch, remove, text } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

tests/blockdom/toggler.test.ts

@@ -1,4 +1,4 @@
-import { createBlock, mount, patch, text, toggler } from "../../src/blockdom";
+import { createBlock, mount, patch, text, toggler } from "../../src/runtime/blockdom";
 import { makeTestFixture } from "./helpers";
 
 //------------------------------------------------------------------------------

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`attributes changing a class with t-att-class (preexisting class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -15,7 +15,7 @@ exports[`attributes changing a class with t-att-class (preexisting class 1`] = `
 `;
 
 exports[`attributes changing a class with t-att-class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -29,7 +29,7 @@ exports[`attributes changing a class with t-att-class 1`] = `
 `;
 
 exports[`attributes changing an attribute with t-att- 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -43,7 +43,7 @@ exports[`attributes changing an attribute with t-att- 1`] = `
 `;
 
 exports[`attributes class and t-att-class should combine together 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -57,7 +57,7 @@ exports[`attributes class and t-att-class should combine together 1`] = `
 `;
 
 exports[`attributes class and t-attf-class with ternary operation 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -71,7 +71,7 @@ exports[`attributes class and t-attf-class with ternary operation 1`] = `
 `;
 
 exports[`attributes dynamic attribute evaluating to 0 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -85,7 +85,7 @@ exports[`attributes dynamic attribute evaluating to 0 1`] = `
 `;
 
 exports[`attributes dynamic attribute falsy variable  1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -99,7 +99,7 @@ exports[`attributes dynamic attribute falsy variable  1`] = `
 `;
 
 exports[`attributes dynamic attribute with a dash 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -113,7 +113,7 @@ exports[`attributes dynamic attribute with a dash 1`] = `
 `;
 
 exports[`attributes dynamic attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -127,7 +127,7 @@ exports[`attributes dynamic attributes 1`] = `
 `;
 
 exports[`attributes dynamic class attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -141,7 +141,7 @@ exports[`attributes dynamic class attribute 1`] = `
 `;
 
 exports[`attributes dynamic class attribute evaluating to 0 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -155,7 +155,7 @@ exports[`attributes dynamic class attribute evaluating to 0 1`] = `
 `;
 
 exports[`attributes dynamic empty class attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -169,7 +169,7 @@ exports[`attributes dynamic empty class attribute 1`] = `
 `;
 
 exports[`attributes dynamic formatted attributes with a dash 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -183,7 +183,7 @@ exports[`attributes dynamic formatted attributes with a dash 1`] = `
 `;
 
 exports[`attributes dynamic undefined class attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -197,7 +197,7 @@ exports[`attributes dynamic undefined class attribute 1`] = `
 `;
 
 exports[`attributes dynamic undefined generic attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -211,7 +211,7 @@ exports[`attributes dynamic undefined generic attribute 1`] = `
 `;
 
 exports[`attributes fixed variable 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -225,7 +225,7 @@ exports[`attributes fixed variable 1`] = `
 `;
 
 exports[`attributes format expression 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -239,7 +239,7 @@ exports[`attributes format expression 1`] = `
 `;
 
 exports[`attributes format literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -253,7 +253,7 @@ exports[`attributes format literal 1`] = `
 `;
 
 exports[`attributes format multiple 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -267,7 +267,7 @@ exports[`attributes format multiple 1`] = `
 `;
 
 exports[`attributes format value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -281,7 +281,7 @@ exports[`attributes format value 1`] = `
 `;
 
 exports[`attributes from object variables set previously 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -299,7 +299,7 @@ exports[`attributes from object variables set previously 1`] = `
 `;
 
 exports[`attributes from variables set previously (no external node) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -317,7 +317,7 @@ exports[`attributes from variables set previously (no external node) 1`] = `
 `;
 
 exports[`attributes from variables set previously 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -335,7 +335,7 @@ exports[`attributes from variables set previously 1`] = `
 `;
 
 exports[`attributes object 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -349,7 +349,7 @@ exports[`attributes object 1`] = `
 `;
 
 exports[`attributes static attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -362,7 +362,7 @@ exports[`attributes static attributes 1`] = `
 `;
 
 exports[`attributes static attributes on void elements 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -375,7 +375,7 @@ exports[`attributes static attributes on void elements 1`] = `
 `;
 
 exports[`attributes static attributes with dashes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -388,7 +388,7 @@ exports[`attributes static attributes with dashes 1`] = `
 `;
 
 exports[`attributes t-att-class and class should combine together 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -402,7 +402,7 @@ exports[`attributes t-att-class and class should combine together 1`] = `
 `;
 
 exports[`attributes t-att-class with multiple classes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -416,7 +416,7 @@ exports[`attributes t-att-class with multiple classes 1`] = `
 `;
 
 exports[`attributes t-att-class with multiple classes 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -430,7 +430,7 @@ exports[`attributes t-att-class with multiple classes 2`] = `
 `;
 
 exports[`attributes t-att-class with multiple classes, some of which are duplicate 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -444,7 +444,7 @@ exports[`attributes t-att-class with multiple classes, some of which are duplica
 `;
 
 exports[`attributes t-att-class with object 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -458,7 +458,7 @@ exports[`attributes t-att-class with object 1`] = `
 `;
 
 exports[`attributes t-attf-class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -472,7 +472,7 @@ exports[`attributes t-attf-class 1`] = `
 `;
 
 exports[`attributes t-attf-class should combine with class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -486,7 +486,7 @@ exports[`attributes t-attf-class should combine with class 1`] = `
 `;
 
 exports[`attributes t-attf-class with multiple classes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -500,7 +500,7 @@ exports[`attributes t-attf-class with multiple classes 1`] = `
 `;
 
 exports[`attributes t-attf-class with multiple classes separated by multiple spaces 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -514,7 +514,7 @@ exports[`attributes t-attf-class with multiple classes separated by multiple spa
 `;
 
 exports[`attributes tuple literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -528,7 +528,7 @@ exports[`attributes tuple literal 1`] = `
 `;
 
 exports[`attributes tuple variable 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -542,7 +542,7 @@ exports[`attributes tuple variable 1`] = `
 `;
 
 exports[`attributes two classes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -555,7 +555,7 @@ exports[`attributes two classes 1`] = `
 `;
 
 exports[`attributes two dynamic attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -570,7 +570,7 @@ exports[`attributes two dynamic attributes 1`] = `
 `;
 
 exports[`attributes updating classes (with obj notation) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -584,7 +584,7 @@ exports[`attributes updating classes (with obj notation) 1`] = `
 `;
 
 exports[`attributes various escapes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -600,7 +600,7 @@ exports[`attributes various escapes 1`] = `
 `;
 
 exports[`attributes various escapes 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -613,7 +613,7 @@ exports[`attributes various escapes 2 1`] = `
 `;
 
 exports[`special cases for some specific html attributes/properties input of type checkbox with t-att-indeterminate 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -627,7 +627,7 @@ exports[`special cases for some specific html attributes/properties input of typ
 `;
 
 exports[`special cases for some specific html attributes/properties input type= checkbox, with t-att-checked 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -641,7 +641,7 @@ exports[`special cases for some specific html attributes/properties input type=
 `;
 
 exports[`special cases for some specific html attributes/properties input with t-att-value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -655,7 +655,7 @@ exports[`special cases for some specific html attributes/properties input with t
 `;
 
 exports[`special cases for some specific html attributes/properties select with t-att-value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -669,7 +669,7 @@ exports[`special cases for some specific html attributes/properties select with
 `;
 
 exports[`special cases for some specific html attributes/properties textarea with t-att-value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -683,7 +683,7 @@ exports[`special cases for some specific html attributes/properties textarea wit
 `;
 
 exports[`special cases for some specific html attributes/properties various boolean html attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`comments only a comment 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -12,7 +12,7 @@ exports[`comments only a comment 1`] = `
 `;
 
 exports[`comments properly handle comments 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -25,7 +25,7 @@ exports[`comments properly handle comments 1`] = `
 `;
 
 exports[`comments properly handle comments between t-if/t-else 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-on can bind event handler 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -15,7 +15,7 @@ exports[`t-on can bind event handler 1`] = `
 `;
 
 exports[`t-on can bind handlers with arguments 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -30,7 +30,7 @@ exports[`t-on can bind handlers with arguments 1`] = `
 `;
 
 exports[`t-on can bind handlers with empty  object 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -45,7 +45,7 @@ exports[`t-on can bind handlers with empty  object 1`] = `
 `;
 
 exports[`t-on can bind handlers with empty object (with non empty inner string) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -60,7 +60,7 @@ exports[`t-on can bind handlers with empty object (with non empty inner string)
 `;
 
 exports[`t-on can bind handlers with empty object (with non empty inner string) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -87,7 +87,7 @@ exports[`t-on can bind handlers with empty object (with non empty inner string)
 `;
 
 exports[`t-on can bind handlers with object arguments 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -102,7 +102,7 @@ exports[`t-on can bind handlers with object arguments 1`] = `
 `;
 
 exports[`t-on can bind two event handlers 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -117,7 +117,7 @@ exports[`t-on can bind two event handlers 1`] = `
 `;
 
 exports[`t-on handler is bound to proper owner 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -131,7 +131,7 @@ exports[`t-on handler is bound to proper owner 1`] = `
 `;
 
 exports[`t-on handler is bound to proper owner, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -153,11 +153,10 @@ exports[`t-on handler is bound to proper owner, part 2 1`] = `
 `;
 
 exports[`t-on handler is bound to proper owner, part 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -166,7 +165,7 @@ exports[`t-on handler is bound to proper owner, part 3 1`] = `
 `;
 
 exports[`t-on handler is bound to proper owner, part 3 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -180,11 +179,11 @@ exports[`t-on handler is bound to proper owner, part 3 2`] = `
 `;
 
 exports[`t-on handler is bound to proper owner, part 4 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { prepareList, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -204,7 +203,7 @@ exports[`t-on handler is bound to proper owner, part 4 1`] = `
 `;
 
 exports[`t-on handler is bound to proper owner, part 4 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -218,7 +217,7 @@ exports[`t-on handler is bound to proper owner, part 4 2`] = `
 `;
 
 exports[`t-on receive event in first argument 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -232,7 +231,7 @@ exports[`t-on receive event in first argument 1`] = `
 `;
 
 exports[`t-on t-on modifiers (native listener) basic support for native listener 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -247,7 +246,7 @@ exports[`t-on t-on modifiers (native listener) basic support for native listener
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on combined with t-esc 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -262,7 +261,7 @@ exports[`t-on t-on modifiers (native listener) t-on combined with t-esc 1`] = `
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on combined with t-out 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -278,7 +277,7 @@ exports[`t-on t-on modifiers (native listener) t-on combined with t-out 1`] = `
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with .capture modifier 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -293,7 +292,7 @@ exports[`t-on t-on modifiers (native listener) t-on with .capture modifier 1`] =
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with empty handler (only modifiers) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -307,7 +306,7 @@ exports[`t-on t-on modifiers (native listener) t-on with empty handler (only mod
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with prevent and self modifiers (order matters) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -321,7 +320,7 @@ exports[`t-on t-on modifiers (native listener) t-on with prevent and self modifi
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with prevent and/or stop modifiers 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -337,7 +336,7 @@ exports[`t-on t-on modifiers (native listener) t-on with prevent and/or stop mod
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with prevent modifier in t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -364,7 +363,7 @@ exports[`t-on t-on modifiers (native listener) t-on with prevent modifier in t-f
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with self and prevent modifiers (order matters) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -378,7 +377,7 @@ exports[`t-on t-on modifiers (native listener) t-on with self and prevent modifi
 `;
 
 exports[`t-on t-on modifiers (native listener) t-on with self modifier 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -393,7 +392,7 @@ exports[`t-on t-on modifiers (native listener) t-on with self modifier 1`] = `
 `;
 
 exports[`t-on t-on modifiers (synthetic listener) basic support for synthetic 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -408,7 +407,7 @@ exports[`t-on t-on modifiers (synthetic listener) basic support for synthetic 1`
 `;
 
 exports[`t-on t-on with inline statement (function call) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -423,7 +422,7 @@ exports[`t-on t-on with inline statement (function call) 1`] = `
 `;
 
 exports[`t-on t-on with inline statement 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -438,7 +437,7 @@ exports[`t-on t-on with inline statement 1`] = `
 `;
 
 exports[`t-on t-on with inline statement, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -453,7 +452,7 @@ exports[`t-on t-on with inline statement, part 2 1`] = `
 `;
 
 exports[`t-on t-on with inline statement, part 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -469,11 +468,10 @@ exports[`t-on t-on with inline statement, part 3 1`] = `
 `;
 
 exports[`t-on t-on with t-call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -485,7 +483,7 @@ exports[`t-on t-on with t-call 1`] = `
 `;
 
 exports[`t-on t-on with t-call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -499,11 +497,10 @@ exports[`t-on t-on with t-call 2`] = `
 `;
 
 exports[`t-on t-on, with arguments and t-call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -515,7 +512,7 @@ exports[`t-on t-on, with arguments and t-call 1`] = `
 `;
 
 exports[`t-on t-on, with arguments and t-call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`misc complex template 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -79,15 +79,15 @@ exports[`misc complex template 1`] = `
 `;
 
 exports[`misc global 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, zero, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_2 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_3 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_4 = getTemplate(\`_callee-asc\`);
-  const callTemplate_5 = getTemplate(\`_callee-asc-toto\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, zero, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`_callee-uses-foo\`);
+  const callTemplate_2 = app.getTemplate(\`_callee-uses-foo\`);
+  const callTemplate_3 = app.getTemplate(\`_callee-uses-foo\`);
+  const callTemplate_4 = app.getTemplate(\`_callee-asc\`);
+  const callTemplate_5 = app.getTemplate(\`_callee-asc-toto\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   let block4 = createBlock(\`<span><block-text-0/></span>\`);
@@ -131,7 +131,7 @@ exports[`misc global 1`] = `
 `;
 
 exports[`misc global 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { withDefault } = helpers;
@@ -146,7 +146,7 @@ exports[`misc global 2`] = `
 `;
 
 exports[`misc global 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -162,7 +162,7 @@ exports[`misc global 3`] = `
 `;
 
 exports[`misc global 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput, withDefault } = helpers;
@@ -178,11 +178,11 @@ exports[`misc global 4`] = `
 `;
 
 exports[`misc other complex template 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, withKey, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`LOAD_INFOS_TEMPLATE\`);
+  let { prepareList, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`LOAD_INFOS_TEMPLATE\`);
   
   let block1 = createBlock(\`<div><header><nav class=\\"navbar navbar-expand-md navbar-light bg-light\\"><a block-attribute-0=\\"href\\"><b style=\\"color:#777;\\"><block-text-1/></b></a><button type=\\"button\\" class=\\"navbar-toggler\\" data-toggle=\\"collapse\\" data-target=\\"#top_menu_collapse\\"><span class=\\"navbar-toggler-icon\\"/></button><div class=\\"collapse navbar-collapse\\" id=\\"top_menu_collapse\\" aria-expanded=\\"false\\"><ul class=\\"nav navbar-nav ml-auto text-right\\" id=\\"top_menu\\"><block-child-0/><li class=\\"nav-item divider\\"/><block-child-1/></ul><div><div class=\\"input-group input-group-sm\\"><div class=\\"input-group-prepend input-group-sm\\"><button class=\\"btn btn-default fa fa-cog\\" title=\\"Settings\\" block-handler-2=\\"click\\"/><button class=\\"btn btn-default\\" block-handler-3=\\"click\\"> More </button><block-child-2/></div><input class=\\"form-control\\" type=\\"text\\" placeholder=\\"Search\\" aria-label=\\"Search\\" name=\\"search\\" block-attribute-4=\\"value\\" block-handler-5=\\"keyup\\" block-handler-6=\\"change\\" block-ref=\\"7\\"/><div class=\\"input-group-append\\"><button class=\\"btn btn-default fa fa-eraser\\" block-handler-8=\\"click\\"/></div></div></div></div></nav></header><div class=\\"container-fluid\\" block-ref=\\"9\\"><div class=\\"row\\"><!--div class=\\"form-group col-md-6\\">
                       <h5>Search options</h5>

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`memory t-foreach does not leak stuff in global scope 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`simple templates, mostly static can render a table row 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +14,7 @@ exports[`simple templates, mostly static can render a table row 1`] = `
 `;
 
 exports[`simple templates, mostly static div with a class attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -27,7 +27,7 @@ exports[`simple templates, mostly static div with a class attribute 1`] = `
 `;
 
 exports[`simple templates, mostly static div with a class attribute with a quote 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -40,7 +40,7 @@ exports[`simple templates, mostly static div with a class attribute with a quote
 `;
 
 exports[`simple templates, mostly static div with a span child node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -53,7 +53,7 @@ exports[`simple templates, mostly static div with a span child node 1`] = `
 `;
 
 exports[`simple templates, mostly static div with an arbitrary attribute with a quote 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -66,7 +66,7 @@ exports[`simple templates, mostly static div with an arbitrary attribute with a
 `;
 
 exports[`simple templates, mostly static div with an empty class attribute 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -79,7 +79,7 @@ exports[`simple templates, mostly static div with an empty class attribute 1`] =
 `;
 
 exports[`simple templates, mostly static div with content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -92,7 +92,7 @@ exports[`simple templates, mostly static div with content 1`] = `
 `;
 
 exports[`simple templates, mostly static dom node with t-esc 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -106,7 +106,7 @@ exports[`simple templates, mostly static dom node with t-esc 1`] = `
 `;
 
 exports[`simple templates, mostly static dom node with t-esc 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -120,7 +120,7 @@ exports[`simple templates, mostly static dom node with t-esc 2`] = `
 `;
 
 exports[`simple templates, mostly static dynamic text value 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -131,7 +131,7 @@ exports[`simple templates, mostly static dynamic text value 1`] = `
 `;
 
 exports[`simple templates, mostly static empty div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -144,7 +144,7 @@ exports[`simple templates, mostly static empty div 1`] = `
 `;
 
 exports[`simple templates, mostly static empty string 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -155,7 +155,7 @@ exports[`simple templates, mostly static empty string 1`] = `
 `;
 
 exports[`simple templates, mostly static empty string in a template set 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -166,7 +166,7 @@ exports[`simple templates, mostly static empty string in a template set 1`] = `
 `;
 
 exports[`simple templates, mostly static inline template string in t-esc 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -177,7 +177,7 @@ exports[`simple templates, mostly static inline template string in t-esc 1`] = `
 `;
 
 exports[`simple templates, mostly static inline template string with content in t-esc 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -192,7 +192,7 @@ exports[`simple templates, mostly static inline template string with content in
 `;
 
 exports[`simple templates, mostly static inline template string with variable in context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -203,7 +203,7 @@ exports[`simple templates, mostly static inline template string with variable in
 `;
 
 exports[`simple templates, mostly static multiple root nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -219,7 +219,7 @@ exports[`simple templates, mostly static multiple root nodes 1`] = `
 `;
 
 exports[`simple templates, mostly static simple string 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -230,7 +230,7 @@ exports[`simple templates, mostly static simple string 1`] = `
 `;
 
 exports[`simple templates, mostly static simple string in t tag 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -241,7 +241,7 @@ exports[`simple templates, mostly static simple string in t tag 1`] = `
 `;
 
 exports[`simple templates, mostly static static text and dynamic text (no t tag) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -254,7 +254,7 @@ exports[`simple templates, mostly static static text and dynamic text (no t tag)
 `;
 
 exports[`simple templates, mostly static static text and dynamic text 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -267,7 +267,7 @@ exports[`simple templates, mostly static static text and dynamic text 1`] = `
 `;
 
 exports[`simple templates, mostly static t-esc in dom node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -281,7 +281,7 @@ exports[`simple templates, mostly static t-esc in dom node 1`] = `
 `;
 
 exports[`simple templates, mostly static t-esc in dom node, variations 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -295,7 +295,7 @@ exports[`simple templates, mostly static t-esc in dom node, variations 1`] = `
 `;
 
 exports[`simple templates, mostly static t-esc in dom node, variations 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -309,7 +309,7 @@ exports[`simple templates, mostly static t-esc in dom node, variations 2`] = `
 `;
 
 exports[`simple templates, mostly static template with multiple t tag with multiple content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -325,7 +325,7 @@ exports[`simple templates, mostly static template with multiple t tag with multi
 `;
 
 exports[`simple templates, mostly static template with t tag with multiple content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -342,7 +342,7 @@ exports[`simple templates, mostly static template with t tag with multiple conte
 `;
 
 exports[`simple templates, mostly static two t-escs next to each other 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -355,7 +355,7 @@ exports[`simple templates, mostly static two t-escs next to each other 1`] = `
 `;
 
 exports[`simple templates, mostly static two t-escs next to each other 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -368,7 +368,7 @@ exports[`simple templates, mostly static two t-escs next to each other 2`] = `
 `;
 
 exports[`simple templates, mostly static two t-escs next to each other, in a div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`properly support svg add proper namespace to g tags 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +14,7 @@ exports[`properly support svg add proper namespace to g tags 1`] = `
 `;
 
 exports[`properly support svg add proper namespace to svg 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -27,7 +27,7 @@ exports[`properly support svg add proper namespace to svg 1`] = `
 `;
 
 exports[`properly support svg namespace to g tags not added if already in svg namespace 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -40,7 +40,7 @@ exports[`properly support svg namespace to g tags not added if already in svg na
 `;
 
 exports[`properly support svg namespace to svg tags added even if already in svg namespace 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -53,7 +53,7 @@ exports[`properly support svg namespace to svg tags added even if already in svg
 `;
 
 exports[`properly support svg svg creates new block if it is within html -- 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -73,7 +73,7 @@ exports[`properly support svg svg creates new block if it is within html -- 2 1`
 `;
 
 exports[`properly support svg svg creates new block if it is within html 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -88,11 +88,10 @@ exports[`properly support svg svg creates new block if it is within html 1`] = `
 `;
 
 exports[`properly support svg svg namespace added to sub templates if root tag is path 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`path\`);
+  const callTemplate_1 = app.getTemplate(\`path\`);
   
   let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
   
@@ -104,7 +103,7 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
 `;
 
 exports[`properly support svg svg namespace added to sub templates if root tag is path 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -117,7 +116,7 @@ exports[`properly support svg svg namespace added to sub templates if root tag i
 `;
 
 exports[`properly support svg svg namespace added to sub-blocks 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,11 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-call (template calling) basic caller 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`_basic-callee\`);
+  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -17,7 +16,7 @@ exports[`t-call (template calling) basic caller 1`] = `
 `;
 
 exports[`t-call (template calling) basic caller 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -30,11 +29,10 @@ exports[`t-call (template calling) basic caller 2`] = `
 `;
 
 exports[`t-call (template calling) basic caller, no parent node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`_basic-callee\`);
+  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
   
   return function template(ctx, node, key = \\"\\") {
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -43,7 +41,7 @@ exports[`t-call (template calling) basic caller, no parent node 1`] = `
 `;
 
 exports[`t-call (template calling) basic caller, no parent node 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -56,11 +54,11 @@ exports[`t-call (template calling) basic caller, no parent node 2`] = `
 `;
 
 exports[`t-call (template calling) call with several sub nodes on same line 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>hey</span>\`);
@@ -81,7 +79,7 @@ exports[`t-call (template calling) call with several sub nodes on same line 1`]
 `;
 
 exports[`t-call (template calling) call with several sub nodes on same line 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -96,11 +94,11 @@ exports[`t-call (template calling) call with several sub nodes on same line 2`]
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`subTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>hey</span>\`);
@@ -121,11 +119,11 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`subSubTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>cascade 0</span>\`);
@@ -144,11 +142,11 @@ exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`finalTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>cascade 1</span>\`);
@@ -167,7 +165,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0' 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -182,11 +180,11 @@ exports[`t-call (template calling) cascading t-call t-out='0' 4`] = `
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0', without external divs 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`subTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subTemplate\`);
   
   let block2 = createBlock(\`<span>hey</span>\`);
   let block4 = createBlock(\`<span>yay</span>\`);
@@ -205,11 +203,11 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0', without external divs 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`subSubTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`subSubTemplate\`);
   
   let block2 = createBlock(\`<span>cascade 0</span>\`);
   
@@ -226,11 +224,11 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0', without external divs 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`finalTemplate\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`finalTemplate\`);
   
   let block2 = createBlock(\`<span>cascade 1</span>\`);
   
@@ -247,7 +245,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 `;
 
 exports[`t-call (template calling) cascading t-call t-out='0', without external divs 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -263,10 +261,10 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 `;
 
 exports[`t-call (template calling) dynamic t-call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { call } = helpers;
+  const call = app.callTemplate.bind(app);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -279,7 +277,7 @@ exports[`t-call (template calling) dynamic t-call 1`] = `
 `;
 
 exports[`t-call (template calling) dynamic t-call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -293,7 +291,7 @@ exports[`t-call (template calling) dynamic t-call 2`] = `
 `;
 
 exports[`t-call (template calling) dynamic t-call 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -307,11 +305,11 @@ exports[`t-call (template calling) dynamic t-call 3`] = `
 `;
 
 exports[`t-call (template calling) inherit context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -326,7 +324,7 @@ exports[`t-call (template calling) inherit context 1`] = `
 `;
 
 exports[`t-call (template calling) inherit context 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -337,11 +335,10 @@ exports[`t-call (template calling) inherit context 2`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 1 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`recursive\`);
+  const callTemplate_1 = app.getTemplate(\`recursive\`);
   
   let block1 = createBlock(\`<div><span>hey</span><block-child-0/></div>\`);
   
@@ -356,11 +353,11 @@ exports[`t-call (template calling) recursive template, part 1 1`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -377,11 +374,11 @@ exports[`t-call (template calling) recursive template, part 2 1`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
   
@@ -411,11 +408,11 @@ exports[`t-call (template calling) recursive template, part 2 2`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -432,11 +429,11 @@ exports[`t-call (template calling) recursive template, part 3 1`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 3 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
   
@@ -466,11 +463,11 @@ exports[`t-call (template calling) recursive template, part 3 2`] = `
 `;
 
 exports[`t-call (template calling) recursive template, part 4: with t-set recursive index 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -488,11 +485,11 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 `;
 
 exports[`t-call (template calling) recursive template, part 4: with t-set recursive index 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
+  let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/> <block-text-1/></p><block-child-0/></div>\`);
   
@@ -524,11 +521,11 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 `;
 
 exports[`t-call (template calling) scoped parameters 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
@@ -547,7 +544,7 @@ exports[`t-call (template calling) scoped parameters 1`] = `
 `;
 
 exports[`t-call (template calling) scoped parameters 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -558,11 +555,11 @@ exports[`t-call (template calling) scoped parameters 2`] = `
 `;
 
 exports[`t-call (template calling) scoped parameters, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
@@ -582,7 +579,7 @@ exports[`t-call (template calling) scoped parameters, part 2 1`] = `
 `;
 
 exports[`t-call (template calling) scoped parameters, part 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -593,11 +590,10 @@ exports[`t-call (template calling) scoped parameters, part 2 2`] = `
 `;
 
 exports[`t-call (template calling) t-call allowed on a non t node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -609,7 +605,7 @@ exports[`t-call (template calling) t-call allowed on a non t node 1`] = `
 `;
 
 exports[`t-call (template calling) t-call allowed on a non t node 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -622,11 +618,11 @@ exports[`t-call (template calling) t-call allowed on a non t node 2`] = `
 `;
 
 exports[`t-call (template calling) t-call with body content as root of a template 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`antony\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`antony\`);
   
   let block1 = createBlock(\`<p>antony</p>\`);
   
@@ -641,7 +637,7 @@ exports[`t-call (template calling) t-call with body content as root of a templat
 `;
 
 exports[`t-call (template calling) t-call with body content as root of a template 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -656,11 +652,10 @@ exports[`t-call (template calling) t-call with body content as root of a templat
 `;
 
 exports[`t-call (template calling) t-call with t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -675,7 +670,7 @@ exports[`t-call (template calling) t-call with t-if 1`] = `
 `;
 
 exports[`t-call (template calling) t-call with t-if 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -688,11 +683,11 @@ exports[`t-call (template calling) t-call with t-if 2`] = `
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and body text content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -709,7 +704,7 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and body text content 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -723,11 +718,11 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and outside 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -757,7 +752,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside 1`] = `
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and outside 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -771,11 +766,11 @@ exports[`t-call (template calling) t-call with t-set inside and outside 2`] = `
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`main\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`main\`);
   
   let block1 = createBlock(\`<p><block-child-0/></p>\`);
   
@@ -790,11 +785,11 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] =
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -824,7 +819,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] =
 `;
 
 exports[`t-call (template calling) t-call with t-set inside and outside. 2 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -840,12 +835,12 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 3`] =
 `;
 
 exports[`t-call (template calling) t-call, conditional and t-set in t-call body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`callee1\`);
-  const callTemplate_2 = getTemplate(\`callee2\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`callee1\`);
+  const callTemplate_2 = app.getTemplate(\`callee2\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
@@ -869,7 +864,7 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 `;
 
 exports[`t-call (template calling) t-call, conditional and t-set in t-call body 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -882,7 +877,7 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 `;
 
 exports[`t-call (template calling) t-call, conditional and t-set in t-call body 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -896,11 +891,11 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 `;
 
 exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -915,7 +910,7 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] =
 `;
 
 exports[`t-call (template calling) t-esc inside t-call, with t-set outside 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -929,11 +924,11 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 2`] =
 `;
 
 exports[`t-call (template calling) with unused body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -946,7 +941,7 @@ exports[`t-call (template calling) with unused body 1`] = `
 `;
 
 exports[`t-call (template calling) with unused body 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -959,11 +954,11 @@ exports[`t-call (template calling) with unused body 2`] = `
 `;
 
 exports[`t-call (template calling) with unused setbody 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -977,7 +972,7 @@ exports[`t-call (template calling) with unused setbody 1`] = `
 `;
 
 exports[`t-call (template calling) with unused setbody 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -990,11 +985,11 @@ exports[`t-call (template calling) with unused setbody 2`] = `
 `;
 
 exports[`t-call (template calling) with used body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -1007,7 +1002,7 @@ exports[`t-call (template calling) with used body 1`] = `
 `;
 
 exports[`t-call (template calling) with used body 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -1022,11 +1017,11 @@ exports[`t-call (template calling) with used body 2`] = `
 `;
 
 exports[`t-call (template calling) with used setbody 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<span><block-child-0/></span>\`);
   
@@ -1043,7 +1038,7 @@ exports[`t-call (template calling) with used setbody 1`] = `
 `;
 
 exports[`t-call (template calling) with used setbody 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`debugging t-debug 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -21,7 +21,7 @@ exports[`debugging t-debug 1`] = `
 `;
 
 exports[`debugging t-debug on sub template 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -35,11 +35,10 @@ exports[`debugging t-debug on sub template 1`] = `
 `;
 
 exports[`debugging t-debug on sub template 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -51,7 +50,7 @@ exports[`debugging t-debug on sub template 2`] = `
 `;
 
 exports[`debugging t-log 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-esc div with falsy values 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -19,7 +19,7 @@ exports[`t-esc div with falsy values 1`] = `
 `;
 
 exports[`t-esc escaping 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -33,7 +33,7 @@ exports[`t-esc escaping 1`] = `
 `;
 
 exports[`t-esc escaping on a node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -47,7 +47,7 @@ exports[`t-esc escaping on a node 1`] = `
 `;
 
 exports[`t-esc escaping on a node with a body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { withDefault } = helpers;
@@ -62,7 +62,7 @@ exports[`t-esc escaping on a node with a body 1`] = `
 `;
 
 exports[`t-esc escaping on a node with a body, as a default 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { withDefault } = helpers;
@@ -77,7 +77,7 @@ exports[`t-esc escaping on a node with a body, as a default 1`] = `
 `;
 
 exports[`t-esc falsy values in text nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -97,7 +97,7 @@ exports[`t-esc falsy values in text nodes 1`] = `
 `;
 
 exports[`t-esc literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -111,7 +111,7 @@ exports[`t-esc literal 1`] = `
 `;
 
 exports[`t-esc t-esc is escaped 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue } = helpers;
@@ -134,7 +134,7 @@ exports[`t-esc t-esc is escaped 1`] = `
 `;
 
 exports[`t-esc t-esc work with spread operator 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -148,11 +148,11 @@ exports[`t-esc t-esc work with spread operator 1`] = `
 `;
 
 exports[`t-esc t-esc=0 is escaped 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<p>escaped</p>\`);
@@ -169,7 +169,7 @@ exports[`t-esc t-esc=0 is escaped 1`] = `
 `;
 
 exports[`t-esc t-esc=0 is escaped 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -184,7 +184,7 @@ exports[`t-esc t-esc=0 is escaped 2`] = `
 `;
 
 exports[`t-esc variable 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-foreach does not pollute the rendering context 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -23,7 +23,7 @@ exports[`t-foreach does not pollute the rendering context 1`] = `
 `;
 
 exports[`t-foreach iterate on items (on a element node) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -47,7 +47,7 @@ exports[`t-foreach iterate on items (on a element node) 1`] = `
 `;
 
 exports[`t-foreach iterate on items 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -78,7 +78,7 @@ exports[`t-foreach iterate on items 1`] = `
 `;
 
 exports[`t-foreach iterate, dict param 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -109,7 +109,7 @@ exports[`t-foreach iterate, dict param 1`] = `
 `;
 
 exports[`t-foreach iterate, position 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -145,7 +145,7 @@ exports[`t-foreach iterate, position 1`] = `
 `;
 
 exports[`t-foreach simple iteration (in a node) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -167,7 +167,7 @@ exports[`t-foreach simple iteration (in a node) 1`] = `
 `;
 
 exports[`t-foreach simple iteration 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -186,7 +186,7 @@ exports[`t-foreach simple iteration 1`] = `
 `;
 
 exports[`t-foreach simple iteration with two nodes inside 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -212,11 +212,11 @@ exports[`t-foreach simple iteration with two nodes inside 1`] = `
 `;
 
 exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { prepareList, isBoundary, withDefault, setContextValue, withKey } = helpers;
+  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>\`);
@@ -265,7 +265,7 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
 `;
 
 exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -283,11 +283,11 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
 `;
 
 exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { prepareList, withKey } = helpers;
+  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>\`);
@@ -330,7 +330,7 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
 `;
 
 exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -352,7 +352,7 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
 `;
 
 exports[`t-foreach t-foreach in t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -386,7 +386,7 @@ exports[`t-foreach t-foreach in t-foreach 1`] = `
 `;
 
 exports[`t-foreach t-foreach with t-if inside (no external node) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -412,7 +412,7 @@ exports[`t-foreach t-foreach with t-if inside (no external node) 1`] = `
 `;
 
 exports[`t-foreach t-foreach with t-if inside 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -440,7 +440,7 @@ exports[`t-foreach t-foreach with t-if inside 1`] = `
 `;
 
 exports[`t-foreach t-key on t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -463,7 +463,7 @@ exports[`t-foreach t-key on t-foreach 1`] = `
 `;
 
 exports[`t-foreach throws error if invalid loop expression 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -488,7 +488,7 @@ exports[`t-foreach throws error if invalid loop expression 1`] = `
 `;
 
 exports[`t-foreach with t-memo 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-if a t-if next to a div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -19,7 +19,7 @@ exports[`t-if a t-if next to a div 1`] = `
 `;
 
 exports[`t-if a t-if with two inner nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -39,7 +39,7 @@ exports[`t-if a t-if with two inner nodes 1`] = `
 `;
 
 exports[`t-if boolean value condition elif (no outside node) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -60,7 +60,7 @@ exports[`t-if boolean value condition elif (no outside node) 1`] = `
 `;
 
 exports[`t-if boolean value condition elif 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -83,7 +83,7 @@ exports[`t-if boolean value condition elif 1`] = `
 `;
 
 exports[`t-if boolean value condition else 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -102,7 +102,7 @@ exports[`t-if boolean value condition else 1`] = `
 `;
 
 exports[`t-if boolean value condition false else 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -121,7 +121,7 @@ exports[`t-if boolean value condition false else 1`] = `
 `;
 
 exports[`t-if boolean value condition missing 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -138,7 +138,7 @@ exports[`t-if boolean value condition missing 1`] = `
 `;
 
 exports[`t-if can use some boolean operators in expressions 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -176,7 +176,7 @@ exports[`t-if can use some boolean operators in expressions 1`] = `
 `;
 
 exports[`t-if div containing a t-if with two inner nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -197,7 +197,7 @@ exports[`t-if div containing a t-if with two inner nodes 1`] = `
 `;
 
 exports[`t-if dynamic content after t-if with two children nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -219,7 +219,7 @@ exports[`t-if dynamic content after t-if with two children nodes 1`] = `
 `;
 
 exports[`t-if just a t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -234,7 +234,7 @@ exports[`t-if just a t-if 1`] = `
 `;
 
 exports[`t-if simple t-if/t-else 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -251,7 +251,7 @@ exports[`t-if simple t-if/t-else 1`] = `
 `;
 
 exports[`t-if simple t-if/t-else in a div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -270,7 +270,7 @@ exports[`t-if simple t-if/t-else in a div 1`] = `
 `;
 
 exports[`t-if t-esc with t-elif 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -289,7 +289,7 @@ exports[`t-if t-esc with t-elif 1`] = `
 `;
 
 exports[`t-if t-esc with t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -306,7 +306,7 @@ exports[`t-if t-esc with t-if 1`] = `
 `;
 
 exports[`t-if t-if and t-else with two nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -328,7 +328,7 @@ exports[`t-if t-if and t-else with two nodes 1`] = `
 `;
 
 exports[`t-if t-if in a div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -345,7 +345,7 @@ exports[`t-if t-if in a div 1`] = `
 `;
 
 exports[`t-if t-if in a t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -367,7 +367,7 @@ exports[`t-if t-if in a t-if 1`] = `
 `;
 
 exports[`t-if t-if with empty content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -383,7 +383,7 @@ exports[`t-if t-if with empty content 1`] = `
 `;
 
 exports[`t-if t-if/t-else with more content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -402,7 +402,7 @@ exports[`t-if t-if/t-else with more content 1`] = `
 `;
 
 exports[`t-if t-set, then t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -423,7 +423,7 @@ exports[`t-if t-set, then t-if 1`] = `
 `;
 
 exports[`t-if t-set, then t-if, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -446,7 +446,7 @@ exports[`t-if t-set, then t-if, part 2 1`] = `
 `;
 
 exports[`t-if t-set, then t-if, part 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -472,7 +472,7 @@ exports[`t-if t-set, then t-if, part 3 1`] = `
 `;
 
 exports[`t-if two consecutive t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -490,7 +490,7 @@ exports[`t-if two consecutive t-if 1`] = `
 `;
 
 exports[`t-if two consecutive t-if in a div 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -510,7 +510,7 @@ exports[`t-if two consecutive t-if in a div 1`] = `
 `;
 
 exports[`t-if two t-ifs next to each other 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-key can use t-key directive on a node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -16,7 +16,7 @@ exports[`t-key can use t-key directive on a node 1`] = `
 `;
 
 exports[`t-key can use t-key directive on a node 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -31,7 +31,7 @@ exports[`t-key can use t-key directive on a node 2 1`] = `
 `;
 
 exports[`t-key can use t-key directive on a node as a function 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -46,7 +46,7 @@ exports[`t-key can use t-key directive on a node as a function 1`] = `
 `;
 
 exports[`t-key t-key directive in a list 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -70,7 +70,7 @@ exports[`t-key t-key directive in a list 1`] = `
 `;
 
 exports[`t-key t-key on sub dom node pushes a child block in its parent 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -91,7 +91,7 @@ exports[`t-key t-key on sub dom node pushes a child block in its parent 1`] = `
 `;
 
 exports[`t-key t-key on sub dom node pushes a child block in its parent 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-out literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -16,7 +16,7 @@ exports[`t-out literal 1`] = `
 `;
 
 exports[`t-out literal, no outside html element 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -28,11 +28,11 @@ exports[`t-out literal, no outside html element 1`] = `
 `;
 
 exports[`t-out multiple calls to t-out 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<span>coucou</span>\`);
@@ -49,7 +49,7 @@ exports[`t-out multiple calls to t-out 1`] = `
 `;
 
 exports[`t-out multiple calls to t-out 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -65,7 +65,7 @@ exports[`t-out multiple calls to t-out 2`] = `
 `;
 
 exports[`t-out not escaping 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -80,11 +80,11 @@ exports[`t-out not escaping 1`] = `
 `;
 
 exports[`t-out t-out 0 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`_basic-callee\`);
+  let { isBoundary, zero } = helpers;
+  const callTemplate_1 = app.getTemplate(\`_basic-callee\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<div>zero</div>\`);
@@ -101,7 +101,7 @@ exports[`t-out t-out 0 1`] = `
 `;
 
 exports[`t-out t-out 0 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { zero } = helpers;
@@ -116,7 +116,7 @@ exports[`t-out t-out 0 2`] = `
 `;
 
 exports[`t-out t-out and another sibling node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -131,7 +131,7 @@ exports[`t-out t-out and another sibling node 1`] = `
 `;
 
 exports[`t-out t-out bdom 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
@@ -154,7 +154,7 @@ exports[`t-out t-out bdom 1`] = `
 `;
 
 exports[`t-out t-out block 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -169,7 +169,7 @@ exports[`t-out t-out block 1`] = `
 `;
 
 exports[`t-out t-out escaped 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -184,7 +184,7 @@ exports[`t-out t-out escaped 1`] = `
 `;
 
 exports[`t-out t-out markedup 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -199,7 +199,7 @@ exports[`t-out t-out markedup 1`] = `
 `;
 
 exports[`t-out t-out on a node with a body, as a default 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput, withDefault } = helpers;
@@ -215,7 +215,7 @@ exports[`t-out t-out on a node with a body, as a default 1`] = `
 `;
 
 exports[`t-out t-out on a node with a dom node in body, as a default 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput, withDefault } = helpers;
@@ -232,7 +232,7 @@ exports[`t-out t-out on a node with a dom node in body, as a default 1`] = `
 `;
 
 exports[`t-out t-out switch escaped 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -247,7 +247,7 @@ exports[`t-out t-out switch escaped 1`] = `
 `;
 
 exports[`t-out t-out switch escaped on markup 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -262,7 +262,7 @@ exports[`t-out t-out switch escaped on markup 1`] = `
 `;
 
 exports[`t-out t-out switch markup 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -277,7 +277,7 @@ exports[`t-out t-out switch markup 1`] = `
 `;
 
 exports[`t-out t-out switch markup on bdom 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue, safeOutput } = helpers;
@@ -309,7 +309,7 @@ exports[`t-out t-out switch markup on bdom 1`] = `
 `;
 
 exports[`t-out t-out switch markup on escaped 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -324,7 +324,7 @@ exports[`t-out t-out switch markup on escaped 1`] = `
 `;
 
 exports[`t-out t-out with a <t/> in body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -336,7 +336,7 @@ exports[`t-out t-out with a <t/> in body 1`] = `
 `;
 
 exports[`t-out t-out with arbitrary object 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -351,7 +351,7 @@ exports[`t-out t-out with arbitrary object 1`] = `
 `;
 
 exports[`t-out t-out with arbitrary object 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -366,7 +366,7 @@ exports[`t-out t-out with arbitrary object 2 1`] = `
 `;
 
 exports[`t-out t-out with comment 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -381,7 +381,7 @@ exports[`t-out t-out with comment 1`] = `
 `;
 
 exports[`t-out t-out with just a t-set t-value in body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -393,7 +393,7 @@ exports[`t-out t-out with just a t-set t-value in body 1`] = `
 `;
 
 exports[`t-out variable 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -408,7 +408,7 @@ exports[`t-out variable 1`] = `
 `;
 
 exports[`t-out with a String class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -423,7 +423,7 @@ exports[`t-out with a String class 1`] = `
 `;
 
 exports[`t-out with an extended String class 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -438,7 +438,7 @@ exports[`t-out with an extended String class 1`] = `
 `;
 
 exports[`t-raw is deprecated should warn 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -453,7 +453,7 @@ exports[`t-raw is deprecated should warn 1`] = `
 `;
 
 exports[`t-raw is deprecated t-out is actually called in t-raw's place 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-ref can get a dynamic ref on a node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -17,7 +17,7 @@ exports[`t-ref can get a dynamic ref on a node 1`] = `
 `;
 
 exports[`t-ref can get a ref on a node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -32,11 +32,10 @@ exports[`t-ref can get a ref on a node 1`] = `
 `;
 
 exports[`t-ref ref in a t-call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -48,7 +47,7 @@ exports[`t-ref ref in a t-call 1`] = `
 `;
 
 exports[`t-ref ref in a t-call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -63,7 +62,7 @@ exports[`t-ref ref in a t-call 2`] = `
 `;
 
 exports[`t-ref ref in a t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -83,7 +82,7 @@ exports[`t-ref ref in a t-if 1`] = `
 `;
 
 exports[`t-ref refs in a loop 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -111,7 +110,7 @@ exports[`t-ref refs in a loop 1`] = `
 `;
 
 exports[`t-ref two refs, one in a t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`t-set evaluate value expression 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -19,7 +19,7 @@ exports[`t-set evaluate value expression 1`] = `
 `;
 
 exports[`t-set evaluate value expression, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -37,7 +37,7 @@ exports[`t-set evaluate value expression, part 2 1`] = `
 `;
 
 exports[`t-set set from attribute literal (no outside div) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -52,7 +52,7 @@ exports[`t-set set from attribute literal (no outside div) 1`] = `
 `;
 
 exports[`t-set set from attribute literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -70,7 +70,7 @@ exports[`t-set set from attribute literal 1`] = `
 `;
 
 exports[`t-set set from attribute lookup 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -88,7 +88,7 @@ exports[`t-set set from attribute lookup 1`] = `
 `;
 
 exports[`t-set set from body literal (with t-if/t-else 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue } = helpers;
@@ -113,7 +113,7 @@ exports[`t-set set from body literal (with t-if/t-else 1`] = `
 `;
 
 exports[`t-set set from body literal 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -128,7 +128,7 @@ exports[`t-set set from body literal 1`] = `
 `;
 
 exports[`t-set set from body lookup 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue } = helpers;
@@ -150,7 +150,7 @@ exports[`t-set set from body lookup 1`] = `
 `;
 
 exports[`t-set set from empty body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -168,7 +168,7 @@ exports[`t-set set from empty body 1`] = `
 `;
 
 exports[`t-set t-set and t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -189,7 +189,7 @@ exports[`t-set t-set and t-if 1`] = `
 `;
 
 exports[`t-set t-set body is evaluated immediately 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, LazyValue, safeOutput } = helpers;
@@ -215,11 +215,11 @@ exports[`t-set t-set body is evaluated immediately 1`] = `
 `;
 
 exports[`t-set t-set can't alter from within callee 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
   
@@ -236,7 +236,7 @@ exports[`t-set t-set can't alter from within callee 1`] = `
 `;
 
 exports[`t-set t-set can't alter from within callee 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -255,11 +255,11 @@ exports[`t-set t-set can't alter from within callee 2`] = `
 `;
 
 exports[`t-set t-set can't alter in t-call body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`sub\`);
+  let { isBoundary, withDefault, setContextValue } = helpers;
+  const callTemplate_1 = app.getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
   
@@ -280,7 +280,7 @@ exports[`t-set t-set can't alter in t-call body 1`] = `
 `;
 
 exports[`t-set t-set can't alter in t-call body 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -299,7 +299,7 @@ exports[`t-set t-set can't alter in t-call body 2`] = `
 `;
 
 exports[`t-set t-set does not modify render context existing key values 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -317,7 +317,7 @@ exports[`t-set t-set does not modify render context existing key values 1`] = `
 `;
 
 exports[`t-set t-set evaluates an expression only once 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -336,7 +336,7 @@ exports[`t-set t-set evaluates an expression only once 1`] = `
 `;
 
 exports[`t-set t-set outside modified in t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
@@ -366,7 +366,7 @@ exports[`t-set t-set outside modified in t-foreach 1`] = `
 `;
 
 exports[`t-set t-set outside modified in t-foreach increment-after operator 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
@@ -396,7 +396,7 @@ exports[`t-set t-set outside modified in t-foreach increment-after operator 1`]
 `;
 
 exports[`t-set t-set outside modified in t-foreach increment-before operator 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
@@ -426,7 +426,7 @@ exports[`t-set t-set outside modified in t-foreach increment-before operator 1`]
 `;
 
 exports[`t-set t-set should reuse variable if possible 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
@@ -455,7 +455,7 @@ exports[`t-set t-set should reuse variable if possible 1`] = `
 `;
 
 exports[`t-set t-set with content and sub t-esc 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue } = helpers;
@@ -479,7 +479,7 @@ exports[`t-set t-set with content and sub t-esc 1`] = `
 `;
 
 exports[`t-set t-set with t-value (falsy) and body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, LazyValue, safeOutput } = helpers;
@@ -507,7 +507,7 @@ exports[`t-set t-set with t-value (falsy) and body 1`] = `
 `;
 
 exports[`t-set t-set with t-value (truthy) and body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, LazyValue, safeOutput } = helpers;
@@ -535,7 +535,7 @@ exports[`t-set t-set with t-value (truthy) and body 1`] = `
 `;
 
 exports[`t-set t-set, t-if, and mix of expression/body lookup, 1 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -557,7 +557,7 @@ exports[`t-set t-set, t-if, and mix of expression/body lookup, 1 1`] = `
 `;
 
 exports[`t-set t-set, t-if, and mix of expression/body lookup, 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -579,7 +579,7 @@ exports[`t-set t-set, t-if, and mix of expression/body lookup, 2 1`] = `
 `;
 
 exports[`t-set t-set, t-if, and mix of expression/body lookup, 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;
@@ -600,7 +600,7 @@ exports[`t-set t-set, t-if, and mix of expression/body lookup, 3 1`] = `
 `;
 
 exports[`t-set value priority (with non text body 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, LazyValue } = helpers;
@@ -623,7 +623,7 @@ exports[`t-set value priority (with non text body 1`] = `
 `;
 
 exports[`t-set value priority 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`qweb t-tag can fallback if falsy tag 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -15,7 +15,7 @@ exports[`qweb t-tag can fallback if falsy tag 1`] = `
 `;
 
 exports[`qweb t-tag can update 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -29,7 +29,7 @@ exports[`qweb t-tag can update 1`] = `
 `;
 
 exports[`qweb t-tag simple usecases 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -43,7 +43,7 @@ exports[`qweb t-tag simple usecases 1`] = `
 `;
 
 exports[`qweb t-tag simple usecases 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -57,7 +57,7 @@ exports[`qweb t-tag simple usecases 2`] = `
 `;
 
 exports[`qweb t-tag with multiple attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -71,7 +71,7 @@ exports[`qweb t-tag with multiple attributes 1`] = `
 `;
 
 exports[`qweb t-tag with multiple child nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -85,7 +85,7 @@ exports[`qweb t-tag with multiple child nodes 1`] = `
 `;
 
 exports[`qweb t-tag with multiple t-tag in same template 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -102,7 +102,7 @@ exports[`qweb t-tag with multiple t-tag in same template 1`] = `
 `;
 
 exports[`qweb t-tag with multiple t-tag in same template, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`loading templates addTemplates does not modify its xml document in place 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -15,7 +15,7 @@ exports[`loading templates addTemplates does not modify its xml document in plac
 `;
 
 exports[`loading templates can initialize qweb with a string 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -28,7 +28,7 @@ exports[`loading templates can initialize qweb with a string 1`] = `
 `;
 
 exports[`loading templates can initialize qweb with an XMLDocument 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -41,11 +41,10 @@ exports[`loading templates can initialize qweb with an XMLDocument 1`] = `
 `;
 
 exports[`loading templates can load a few templates from a xml string 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`items\`);
+  const callTemplate_1 = app.getTemplate(\`items\`);
   
   let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
   
@@ -57,7 +56,7 @@ exports[`loading templates can load a few templates from a xml string 1`] = `
 `;
 
 exports[`loading templates can load a few templates from a xml string 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -73,11 +72,10 @@ exports[`loading templates can load a few templates from a xml string 2`] = `
 `;
 
 exports[`loading templates can load a few templates from an XMLDocument 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`items\`);
+  const callTemplate_1 = app.getTemplate(\`items\`);
   
   let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
   
@@ -89,7 +87,7 @@ exports[`loading templates can load a few templates from an XMLDocument 1`] = `
 `;
 
 exports[`loading templates can load a few templates from an XMLDocument 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`translation support can set and remove translatable attributes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +14,7 @@ exports[`translation support can set and remove translatable attributes 1`] = `
 `;
 
 exports[`translation support can translate node content 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -27,7 +27,7 @@ exports[`translation support can translate node content 1`] = `
 `;
 
 exports[`translation support does not translate node content if disabled 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -40,7 +40,7 @@ exports[`translation support does not translate node content if disabled 1`] = `
 `;
 
 exports[`translation support some attributes are translated 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -53,7 +53,7 @@ exports[`translation support some attributes are translated 1`] = `
 `;
 
 exports[`translation support translation is done on the trimmed text, with extra spaces readded after 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`white space handling consecutives whitespaces are condensed into a single space 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +14,7 @@ exports[`white space handling consecutives whitespaces are condensed into a sing
 `;
 
 exports[`white space handling nothing is done in pre tags 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -27,7 +27,7 @@ exports[`white space handling nothing is done in pre tags 1`] = `
 `;
 
 exports[`white space handling nothing is done in pre tags 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -42,7 +42,7 @@ exports[`white space handling nothing is done in pre tags 2`] = `
 `;
 
 exports[`white space handling nothing is done in pre tags 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -57,7 +57,7 @@ exports[`white space handling nothing is done in pre tags 3`] = `
 `;
 
 exports[`white space handling pre inside a div with a new line 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -70,7 +70,7 @@ exports[`white space handling pre inside a div with a new line 1`] = `
 `;
 
 exports[`white space handling white space only text nodes are condensed into a single space 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -83,7 +83,7 @@ exports[`white space handling white space only text nodes are condensed into a s
 `;
 
 exports[`white space handling whitespace only text nodes with newlines are removed 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

tests/compiler/attributes.test.ts

@@ -1,4 +1,4 @@
-import { mount, patch } from "../../src/blockdom";
+import { mount, patch } from "../../src/runtime/blockdom";
 import { makeTestFixture, renderToBdom, renderToString, snapshotEverything } from "../helpers";
 
 snapshotEverything();

tests/compiler/error_handling.test.ts

@@ -12,15 +12,6 @@ describe("error handling", () => {
     expect(() => context.renderToString("invalidname")).toThrow("Missing template");
   });
 
-  test("cannot add twice the same template", () => {
-    const context = new TestContext();
-    context.addTemplate("test", `<t></t>`);
-    expect(() => context.addTemplate("test", "<div/>", { allowDuplicate: true })).not.toThrow(
-      "already defined"
-    );
-    expect(() => context.addTemplate("test", "<div/>")).toThrow("already defined");
-  });
-
   test("addTemplates throw if parser error", () => {
     const context = new TestContext();
     expect(() => {

tests/compiler/event_handling.test.ts

@@ -1,8 +1,8 @@
-import { TemplateSet } from "../../src/app/template_set";
-import { mount } from "../../src/blockdom";
+import { TemplateSet } from "../../src/runtime/template_set";
+import { mount } from "../../src/runtime/blockdom";
 import { makeTestFixture, renderToBdom, renderToString, snapshotEverything } from "../helpers";
-import { markup } from "../../src/utils";
-import { STATUS } from "../../src/component/status";
+import { markup } from "../../src/runtime/utils";
+import { STATUS } from "../../src/runtime/status";
 
 snapshotEverything();
 // -----------------------------------------------------------------------------

tests/compiler/inline_expressions.test.ts

@@ -215,4 +215,10 @@ describe("expression evaluation", () => {
     expect(compileExpr("[a, {b, c},d]")).toBe("[ctx['a'],{b:ctx['b'],c:ctx['c']},ctx['d']]");
     expect(compileExpr("{a:[b, {c, d: e}]}")).toBe("{a:[ctx['b'],{c:ctx['c'],d:ctx['e']}]}");
   });
+
+  test("preserving spaces where needed for text operators", () => {
+    expect(compileExpr("new Date()")).toBe("new Date()");
+    expect(compileExpr("a.c in b")).toBe("ctx['a'].c in ctx['b']");
+    expect(compileExpr("typeof val")).toBe("typeof ctx['val']");
+  });
 });

tests/compiler/svg.test.ts

@@ -1,5 +1,5 @@
 import { renderToString, renderToBdom, snapshotEverything, makeTestFixture } from "../helpers";
-import { mount } from "../../src/blockdom";
+import { mount } from "../../src/runtime/blockdom";
 import { mount as mountComponent, Component, xml } from "../../src/index";
 
 // NB: check the snapshots to see where the SVG namespaces are added

tests/compiler/t_esc.test.ts

@@ -1,4 +1,4 @@
-import { mount } from "../../src/blockdom";
+import { mount } from "../../src/runtime/blockdom";
 import {
   makeTestFixture,
   renderToBdom,

tests/compiler/t_foreach.test.ts

@@ -5,7 +5,7 @@ import {
   TestContext,
   makeTestFixture,
 } from "../helpers";
-import { mount, patch } from "../../src/blockdom";
+import { mount, patch } from "../../src/runtime/blockdom";
 
 snapshotEverything();
 

tests/compiler/t_if.test.ts

@@ -1,5 +1,5 @@
 // import { mountBlock } from "../../src/blockdom/block";
-import { mount } from "../../src/blockdom";
+import { mount } from "../../src/runtime/blockdom";
 import { makeTestFixture, renderToBdom, renderToString, snapshotEverything } from "../helpers";
 
 snapshotEverything();

tests/compiler/t_key.test.ts

@@ -1,5 +1,5 @@
 import { renderToString, renderToBdom, snapshotEverything, makeTestFixture } from "../helpers";
-import { mount, patch } from "../../src/blockdom/index";
+import { mount, patch } from "../../src/runtime/blockdom/index";
 
 snapshotEverything();
 

tests/compiler/t_out.test.ts

@@ -5,9 +5,9 @@ import {
   TestContext,
   makeTestFixture,
 } from "../helpers";
-import { mount, patch } from "../../src/blockdom";
-import { createBlock } from "../../src/blockdom/index";
-import { markup } from "../../src/utils";
+import { mount, patch } from "../../src/runtime/blockdom";
+import { createBlock } from "../../src/runtime/blockdom/index";
+import { markup } from "../../src/runtime/utils";
 
 snapshotEverything();
 

tests/compiler/t_ref.test.ts

@@ -1,5 +1,5 @@
-import { TemplateSet } from "../../src/app/template_set";
-import { mount } from "../../src/blockdom";
+import { TemplateSet } from "../../src/runtime/template_set";
+import { mount } from "../../src/runtime/blockdom";
 import { renderToBdom, snapshotEverything } from "../helpers";
 
 snapshotEverything();

tests/compiler/t_tag.test.ts

@@ -1,4 +1,4 @@
-import { mount, patch } from "../../src/blockdom";
+import { mount, patch } from "../../src/runtime/blockdom";
 import { makeTestFixture, renderToBdom, renderToString, snapshotEverything } from "../helpers";
 
 snapshotEverything();

tests/compiler/validation.test.ts

@@ -1,4 +1,4 @@
-import { TemplateSet } from "../../src/app/template_set";
+import { TemplateSet } from "../../src/runtime/template_set";
 import { renderToString, snapshotTemplate, TestContext } from "../helpers";
 
 // -----------------------------------------------------------------------------
@@ -11,11 +11,12 @@ describe("basic validation", () => {
     expect(() => context.getTemplate("invalidname")).toThrow("Missing template");
   });
 
-  test("cannot add twice the same template", () => {
+  test("cannot add a different template with the same name", () => {
     const context = new TemplateSet();
-    expect(() => context.addTemplate("test", "<div/>", { allowDuplicate: true })).not.toThrow(
-      "already defined"
-    );
+    context.addTemplate("test", `<t/>`);
+    // Same template with the same name is fine
+    expect(() => context.addTemplate("test", "<t/>")).not.toThrow();
+    // Different template with the same name crashes
     expect(() => context.addTemplate("test", "<div/>")).toThrow("already defined");
   });
 

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`basics GrandChild display is controlled by its GrandParent 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -13,7 +13,7 @@ exports[`basics GrandChild display is controlled by its GrandParent 1`] = `
 `;
 
 exports[`basics GrandChild display is controlled by its GrandParent 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -28,7 +28,7 @@ exports[`basics GrandChild display is controlled by its GrandParent 2`] = `
 `;
 
 exports[`basics GrandChild display is controlled by its GrandParent 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -41,7 +41,7 @@ exports[`basics GrandChild display is controlled by its GrandParent 3`] = `
 `;
 
 exports[`basics Multi root component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -58,7 +58,7 @@ exports[`basics Multi root component 1`] = `
 `;
 
 exports[`basics a class component inside a class component, no external dom 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -69,7 +69,7 @@ exports[`basics a class component inside a class component, no external dom 1`]
 `;
 
 exports[`basics a class component inside a class component, no external dom 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -82,7 +82,7 @@ exports[`basics a class component inside a class component, no external dom 2`]
 `;
 
 exports[`basics a component cannot be mounted in a detached node (even if node is detached later) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -95,7 +95,7 @@ exports[`basics a component cannot be mounted in a detached node (even if node i
 `;
 
 exports[`basics a component inside a component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -109,7 +109,7 @@ exports[`basics a component inside a component 1`] = `
 `;
 
 exports[`basics a component inside a component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -122,7 +122,7 @@ exports[`basics a component inside a component 2`] = `
 `;
 
 exports[`basics can be clicked on and updated 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -138,7 +138,7 @@ exports[`basics can be clicked on and updated 1`] = `
 `;
 
 exports[`basics can handle empty props 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -152,7 +152,7 @@ exports[`basics can handle empty props 1`] = `
 `;
 
 exports[`basics can handle empty props 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -166,11 +166,10 @@ exports[`basics can handle empty props 2`] = `
 `;
 
 exports[`basics can inject values in tagged templates 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
-  let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = app.getTemplate(\`__template__999\`);
   
   return function template(ctx, node, key = \\"\\") {
     return callTemplate_1.call(this, ctx, node, key + \`__1\`);
@@ -179,7 +178,7 @@ exports[`basics can inject values in tagged templates 1`] = `
 `;
 
 exports[`basics can inject values in tagged templates 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -193,7 +192,7 @@ exports[`basics can inject values in tagged templates 2`] = `
 `;
 
 exports[`basics can mount a component with just some text 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -204,7 +203,7 @@ exports[`basics can mount a component with just some text 1`] = `
 `;
 
 exports[`basics can mount a component with no text 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -215,7 +214,7 @@ exports[`basics can mount a component with no text 1`] = `
 `;
 
 exports[`basics can mount a simple component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -228,7 +227,7 @@ exports[`basics can mount a simple component 1`] = `
 `;
 
 exports[`basics can mount a simple component with multiple roots 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -244,7 +243,7 @@ exports[`basics can mount a simple component with multiple roots 1`] = `
 `;
 
 exports[`basics can mount a simple component with props 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -258,7 +257,7 @@ exports[`basics can mount a simple component with props 1`] = `
 `;
 
 exports[`basics child can be updated 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -269,7 +268,7 @@ exports[`basics child can be updated 1`] = `
 `;
 
 exports[`basics child can be updated 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -280,7 +279,7 @@ exports[`basics child can be updated 2`] = `
 `;
 
 exports[`basics class component with dynamic text 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -294,7 +293,7 @@ exports[`basics class component with dynamic text 1`] = `
 `;
 
 exports[`basics class parent, class child component with props 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -305,7 +304,7 @@ exports[`basics class parent, class child component with props 1`] = `
 `;
 
 exports[`basics class parent, class child component with props 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -319,7 +318,7 @@ exports[`basics class parent, class child component with props 2`] = `
 `;
 
 exports[`basics component children doesn't leak (if case) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -334,7 +333,7 @@ exports[`basics component children doesn't leak (if case) 1`] = `
 `;
 
 exports[`basics component children doesn't leak (if case) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -347,7 +346,7 @@ exports[`basics component children doesn't leak (if case) 2`] = `
 `;
 
 exports[`basics component children doesn't leak (t-key case) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -359,7 +358,7 @@ exports[`basics component children doesn't leak (t-key case) 1`] = `
 `;
 
 exports[`basics component children doesn't leak (t-key case) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -372,7 +371,7 @@ exports[`basics component children doesn't leak (t-key case) 2`] = `
 `;
 
 exports[`basics component with dynamic content can be updated 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -386,7 +385,7 @@ exports[`basics component with dynamic content can be updated 1`] = `
 `;
 
 exports[`basics do not remove previously rendered dom if not necessary 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -399,7 +398,7 @@ exports[`basics do not remove previously rendered dom if not necessary 1`] = `
 `;
 
 exports[`basics do not remove previously rendered dom if not necessary, variation 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -413,7 +412,7 @@ exports[`basics do not remove previously rendered dom if not necessary, variatio
 `;
 
 exports[`basics higher order components parent and child 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -424,7 +423,7 @@ exports[`basics higher order components parent and child 1`] = `
 `;
 
 exports[`basics higher order components parent and child 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -441,7 +440,7 @@ exports[`basics higher order components parent and child 2`] = `
 `;
 
 exports[`basics higher order components parent and child 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -454,7 +453,7 @@ exports[`basics higher order components parent and child 3`] = `
 `;
 
 exports[`basics higher order components parent and child 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -467,7 +466,7 @@ exports[`basics higher order components parent and child 4`] = `
 `;
 
 exports[`basics list of two sub components inside other nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -492,7 +491,7 @@ exports[`basics list of two sub components inside other nodes 1`] = `
 `;
 
 exports[`basics list of two sub components inside other nodes 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -505,7 +504,7 @@ exports[`basics list of two sub components inside other nodes 2`] = `
 `;
 
 exports[`basics parent, child and grandchild 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -516,7 +515,7 @@ exports[`basics parent, child and grandchild 1`] = `
 `;
 
 exports[`basics parent, child and grandchild 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -527,7 +526,7 @@ exports[`basics parent, child and grandchild 2`] = `
 `;
 
 exports[`basics parent, child and grandchild 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -540,7 +539,7 @@ exports[`basics parent, child and grandchild 3`] = `
 `;
 
 exports[`basics props is set on root component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -553,7 +552,7 @@ exports[`basics props is set on root component 1`] = `
 `;
 
 exports[`basics reconciliation alg is not confused in some specific situation 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -569,7 +568,7 @@ exports[`basics reconciliation alg is not confused in some specific situation 1`
 `;
 
 exports[`basics reconciliation alg is not confused in some specific situation 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -582,7 +581,7 @@ exports[`basics reconciliation alg is not confused in some specific situation 2`
 `;
 
 exports[`basics rerendering a widget with a sub widget 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -593,7 +592,7 @@ exports[`basics rerendering a widget with a sub widget 1`] = `
 `;
 
 exports[`basics rerendering a widget with a sub widget 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -609,7 +608,7 @@ exports[`basics rerendering a widget with a sub widget 2`] = `
 `;
 
 exports[`basics same t-keys in two different places 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -626,7 +625,7 @@ exports[`basics same t-keys in two different places 1`] = `
 `;
 
 exports[`basics same t-keys in two different places 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -640,7 +639,7 @@ exports[`basics same t-keys in two different places 2`] = `
 `;
 
 exports[`basics simple component with a dynamic text 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -654,7 +653,7 @@ exports[`basics simple component with a dynamic text 1`] = `
 `;
 
 exports[`basics simple component, useState 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -668,7 +667,7 @@ exports[`basics simple component, useState 1`] = `
 `;
 
 exports[`basics some simple sanity checks (el/status) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -681,7 +680,7 @@ exports[`basics some simple sanity checks (el/status) 1`] = `
 `;
 
 exports[`basics sub components between t-ifs 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -707,7 +706,7 @@ exports[`basics sub components between t-ifs 1`] = `
 `;
 
 exports[`basics sub components between t-ifs 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -720,7 +719,7 @@ exports[`basics sub components between t-ifs 2`] = `
 `;
 
 exports[`basics t-elif works with t-component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -740,7 +739,7 @@ exports[`basics t-elif works with t-component 1`] = `
 `;
 
 exports[`basics t-elif works with t-component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -753,7 +752,7 @@ exports[`basics t-elif works with t-component 2`] = `
 `;
 
 exports[`basics t-else with empty string works with t-component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -773,7 +772,7 @@ exports[`basics t-else with empty string works with t-component 1`] = `
 `;
 
 exports[`basics t-else with empty string works with t-component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -786,7 +785,7 @@ exports[`basics t-else with empty string works with t-component 2`] = `
 `;
 
 exports[`basics t-else works with t-component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -806,7 +805,7 @@ exports[`basics t-else works with t-component 1`] = `
 `;
 
 exports[`basics t-else works with t-component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -819,7 +818,7 @@ exports[`basics t-else works with t-component 2`] = `
 `;
 
 exports[`basics t-if works with t-component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -836,7 +835,7 @@ exports[`basics t-if works with t-component 1`] = `
 `;
 
 exports[`basics t-if works with t-component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -849,7 +848,7 @@ exports[`basics t-if works with t-component 2`] = `
 `;
 
 exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -868,7 +867,7 @@ exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
 `;
 
 exports[`basics t-key on a component with t-if, and a sibling component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -881,7 +880,7 @@ exports[`basics t-key on a component with t-if, and a sibling component 2`] = `
 `;
 
 exports[`basics text after a conditional component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -899,7 +898,7 @@ exports[`basics text after a conditional component 1`] = `
 `;
 
 exports[`basics text after a conditional component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -912,7 +911,7 @@ exports[`basics text after a conditional component 2`] = `
 `;
 
 exports[`basics three level of components with collapsing root nodes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -923,7 +922,7 @@ exports[`basics three level of components with collapsing root nodes 1`] = `
 `;
 
 exports[`basics three level of components with collapsing root nodes 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -934,7 +933,7 @@ exports[`basics three level of components with collapsing root nodes 2`] = `
 `;
 
 exports[`basics three level of components with collapsing root nodes 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -947,7 +946,7 @@ exports[`basics three level of components with collapsing root nodes 3`] = `
 `;
 
 exports[`basics two child components 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -960,7 +959,7 @@ exports[`basics two child components 1`] = `
 `;
 
 exports[`basics two child components 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -973,7 +972,7 @@ exports[`basics two child components 2`] = `
 `;
 
 exports[`basics update props of component without concrete own node 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -988,7 +987,7 @@ exports[`basics update props of component without concrete own node 1`] = `
 `;
 
 exports[`basics update props of component without concrete own node 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1000,7 +999,7 @@ exports[`basics update props of component without concrete own node 2`] = `
 `;
 
 exports[`basics update props of component without concrete own node 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1015,7 +1014,7 @@ exports[`basics update props of component without concrete own node 3`] = `
 `;
 
 exports[`basics updating a component with t-foreach as root 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -1034,7 +1033,7 @@ exports[`basics updating a component with t-foreach as root 1`] = `
 `;
 
 exports[`basics updating widget immediately 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1045,7 +1044,7 @@ exports[`basics updating widget immediately 1`] = `
 `;
 
 exports[`basics updating widget immediately 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1062,7 +1061,7 @@ exports[`basics updating widget immediately 2`] = `
 `;
 
 exports[`basics widget after a t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -1087,7 +1086,7 @@ exports[`basics widget after a t-foreach 1`] = `
 `;
 
 exports[`basics widget after a t-foreach 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1100,7 +1099,7 @@ exports[`basics widget after a t-foreach 2`] = `
 `;
 
 exports[`basics zero or one child components 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1115,7 +1114,7 @@ exports[`basics zero or one child components 1`] = `
 `;
 
 exports[`basics zero or one child components 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1128,7 +1127,7 @@ exports[`basics zero or one child components 2`] = `
 `;
 
 exports[`mount targets can mount a component (with default position='last-child') 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1141,7 +1140,7 @@ exports[`mount targets can mount a component (with default position='last-child'
 `;
 
 exports[`mount targets can mount a component (with position='first-child') 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1154,7 +1153,7 @@ exports[`mount targets can mount a component (with position='first-child') 1`] =
 `;
 
 exports[`mount targets default mount option is 'last-child' 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1167,7 +1166,7 @@ exports[`mount targets default mount option is 'last-child' 1`] = `
 `;
 
 exports[`mount targets mount function: can mount a component (with default position='last-child') 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1180,7 +1179,7 @@ exports[`mount targets mount function: can mount a component (with default posit
 `;
 
 exports[`support svg components add proper namespace to svg 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1194,7 +1193,7 @@ exports[`support svg components add proper namespace to svg 1`] = `
 `;
 
 exports[`support svg components add proper namespace to svg 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1207,7 +1206,7 @@ exports[`support svg components add proper namespace to svg 2`] = `
 `;
 
 exports[`t-out in components can render list of t-out  1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, safeOutput, withKey } = helpers;
@@ -1231,7 +1230,7 @@ exports[`t-out in components can render list of t-out  1`] = `
 `;
 
 exports[`t-out in components can switch the contents of two t-out repeatedly 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;
@@ -1245,7 +1244,7 @@ exports[`t-out in components can switch the contents of two t-out repeatedly 1`]
 `;
 
 exports[`t-out in components update properly on state changes 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { safeOutput } = helpers;

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

@@ -1,7 +1,18 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`basics display a nice error if a component is not a component 1`] = `
+"function anonymous(app, bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return component(\`SomeComponent\`, {}, key + \`__1\`, node, ctx);
+  }
+}"
+`;
+
 exports[`basics display a nice error if it cannot find component (in dev mode) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +25,7 @@ exports[`basics display a nice error if it cannot find component (in dev mode) 1
 `;
 
 exports[`basics display a nice error if it cannot find component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -25,7 +36,7 @@ exports[`basics display a nice error if it cannot find component 1`] = `
 `;
 
 exports[`basics no component catching error lead to full app destruction 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -39,7 +50,7 @@ exports[`basics no component catching error lead to full app destruction 1`] = `
 `;
 
 exports[`basics no component catching error lead to full app destruction 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -53,7 +64,7 @@ exports[`basics no component catching error lead to full app destruction 2`] = `
 `;
 
 exports[`basics simple catchError 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -72,7 +83,7 @@ exports[`basics simple catchError 1`] = `
 `;
 
 exports[`basics simple catchError 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -86,7 +97,7 @@ exports[`basics simple catchError 2`] = `
 `;
 
 exports[`can catch errors an error in onWillDestroy 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -102,7 +113,7 @@ exports[`can catch errors an error in onWillDestroy 1`] = `
 `;
 
 exports[`can catch errors an error in onWillDestroy 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -115,7 +126,7 @@ exports[`can catch errors an error in onWillDestroy 2`] = `
 `;
 
 exports[`can catch errors an error in onWillDestroy, variation 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -131,7 +142,7 @@ exports[`can catch errors an error in onWillDestroy, variation 1`] = `
 `;
 
 exports[`can catch errors an error in onWillDestroy, variation 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -144,7 +155,7 @@ exports[`can catch errors an error in onWillDestroy, variation 2`] = `
 `;
 
 exports[`can catch errors calling a hook outside setup should crash 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -155,7 +166,7 @@ exports[`can catch errors calling a hook outside setup should crash 1`] = `
 `;
 
 exports[`can catch errors can catch an error in a component render function 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -174,7 +185,7 @@ exports[`can catch errors can catch an error in a component render function 1`]
 `;
 
 exports[`can catch errors can catch an error in a component render function 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -194,7 +205,7 @@ exports[`can catch errors can catch an error in a component render function 2`]
 `;
 
 exports[`can catch errors can catch an error in a component render function 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -208,7 +219,7 @@ exports[`can catch errors can catch an error in a component render function 3`]
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -227,7 +238,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -247,7 +258,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -268,7 +279,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -288,7 +299,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 2 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -301,7 +312,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 2 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -314,7 +325,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the constructor call of a component render function 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -327,7 +338,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -346,7 +357,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -366,7 +377,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -380,7 +391,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent updated) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -402,7 +413,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent updated) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -422,7 +433,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the initial call of a component render function (parent updated) 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -436,7 +447,7 @@ exports[`can catch errors can catch an error in the initial call of a component
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in child of child) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -447,7 +458,7 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in child of child) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -461,7 +472,7 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in child of child) 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -480,7 +491,7 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in child of child) 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -493,7 +504,7 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in root component) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -512,7 +523,7 @@ exports[`can catch errors can catch an error in the mounted call (in root compon
 `;
 
 exports[`can catch errors can catch an error in the mounted call (in root component) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -525,7 +536,7 @@ exports[`can catch errors can catch an error in the mounted call (in root compon
 `;
 
 exports[`can catch errors can catch an error in the mounted call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -544,7 +555,7 @@ exports[`can catch errors can catch an error in the mounted call 1`] = `
 `;
 
 exports[`can catch errors can catch an error in the mounted call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -564,7 +575,7 @@ exports[`can catch errors can catch an error in the mounted call 2`] = `
 `;
 
 exports[`can catch errors can catch an error in the mounted call 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -577,7 +588,7 @@ exports[`can catch errors can catch an error in the mounted call 3`] = `
 `;
 
 exports[`can catch errors can catch an error in the willPatch call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -597,7 +608,7 @@ exports[`can catch errors can catch an error in the willPatch call 1`] = `
 `;
 
 exports[`can catch errors can catch an error in the willPatch call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -617,7 +628,7 @@ exports[`can catch errors can catch an error in the willPatch call 2`] = `
 `;
 
 exports[`can catch errors can catch an error in the willPatch call 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -631,7 +642,7 @@ exports[`can catch errors can catch an error in the willPatch call 3`] = `
 `;
 
 exports[`can catch errors can catch an error in the willStart call 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -650,7 +661,7 @@ exports[`can catch errors can catch an error in the willStart call 1`] = `
 `;
 
 exports[`can catch errors can catch an error in the willStart call 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -670,7 +681,7 @@ exports[`can catch errors can catch an error in the willStart call 2`] = `
 `;
 
 exports[`can catch errors can catch an error in the willStart call 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -683,7 +694,7 @@ exports[`can catch errors can catch an error in the willStart call 3`] = `
 `;
 
 exports[`can catch errors can catch an error origination from a child's willStart function 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -704,7 +715,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
 `;
 
 exports[`can catch errors can catch an error origination from a child's willStart function 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -724,7 +735,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
 `;
 
 exports[`can catch errors can catch an error origination from a child's willStart function 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -737,7 +748,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
 `;
 
 exports[`can catch errors can catch an error origination from a child's willStart function 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -750,7 +761,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
 `;
 
 exports[`can catch errors catchError in catchError 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -769,7 +780,7 @@ exports[`can catch errors catchError in catchError 1`] = `
 `;
 
 exports[`can catch errors catchError in catchError 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -783,7 +794,7 @@ exports[`can catch errors catchError in catchError 2`] = `
 `;
 
 exports[`can catch errors catchError in catchError 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -797,7 +808,7 @@ exports[`can catch errors catchError in catchError 3`] = `
 `;
 
 exports[`can catch errors catching error, rethrow, render parent  -- a main component loop implementation 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, capture, markRaw, withKey } = helpers;
@@ -823,7 +834,7 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
 `;
 
 exports[`can catch errors catching error, rethrow, render parent  -- a main component loop implementation 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -835,7 +846,7 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
 `;
 
 exports[`can catch errors catching error, rethrow, render parent  -- a main component loop implementation 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -846,7 +857,7 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
 `;
 
 exports[`can catch errors catching error, rethrow, render parent  -- a main component loop implementation 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -859,7 +870,7 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
 `;
 
 exports[`can catch errors catching error, rethrow, render parent  -- a main component loop implementation 5`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -872,7 +883,7 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
 `;
 
 exports[`can catch errors catching in child makes parent render 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, capture, markRaw, withKey } = helpers;
@@ -898,7 +909,7 @@ exports[`can catch errors catching in child makes parent render 1`] = `
 `;
 
 exports[`can catch errors catching in child makes parent render 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -910,7 +921,7 @@ exports[`can catch errors catching in child makes parent render 2`] = `
 `;
 
 exports[`can catch errors catching in child makes parent render 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -923,7 +934,7 @@ exports[`can catch errors catching in child makes parent render 3`] = `
 `;
 
 exports[`can catch errors catching in child makes parent render 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -937,7 +948,7 @@ exports[`can catch errors catching in child makes parent render 4`] = `
 `;
 
 exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { markRaw } = helpers;
@@ -957,7 +968,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
 `;
 
 exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -968,7 +979,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
 `;
 
 exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot } = helpers;
@@ -988,7 +999,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
 `;
 
 exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1001,7 +1012,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
 `;
 
 exports[`can catch errors onError in class inheritance is called if rethrown 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1012,7 +1023,7 @@ exports[`can catch errors onError in class inheritance is called if rethrown 1`]
 `;
 
 exports[`can catch errors onError in class inheritance is called if rethrown 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1031,7 +1042,7 @@ exports[`can catch errors onError in class inheritance is called if rethrown 2`]
 `;
 
 exports[`can catch errors onError in class inheritance is not called if no rethrown 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1042,7 +1053,7 @@ exports[`can catch errors onError in class inheritance is not called if no rethr
 `;
 
 exports[`can catch errors onError in class inheritance is not called if no rethrown 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1061,7 +1072,7 @@ exports[`can catch errors onError in class inheritance is not called if no rethr
 `;
 
 exports[`errors and promises a rendering error in a sub component will reject the mount promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1075,7 +1086,7 @@ exports[`errors and promises a rendering error in a sub component will reject th
 `;
 
 exports[`errors and promises a rendering error in a sub component will reject the mount promise 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1089,7 +1100,7 @@ exports[`errors and promises a rendering error in a sub component will reject th
 `;
 
 exports[`errors and promises a rendering error will reject the mount promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1103,7 +1114,7 @@ exports[`errors and promises a rendering error will reject the mount promise 1`]
 `;
 
 exports[`errors and promises a rendering error will reject the render promise (with sub components) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1118,7 +1129,7 @@ exports[`errors and promises a rendering error will reject the render promise (w
 `;
 
 exports[`errors and promises a rendering error will reject the render promise (with sub components) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1131,7 +1142,7 @@ exports[`errors and promises a rendering error will reject the render promise (w
 `;
 
 exports[`errors and promises a rendering error will reject the render promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1148,7 +1159,7 @@ exports[`errors and promises a rendering error will reject the render promise 1`
 `;
 
 exports[`errors and promises an error in mounted call will reject the mount promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1161,7 +1172,7 @@ exports[`errors and promises an error in mounted call will reject the mount prom
 `;
 
 exports[`errors and promises an error in onMounted callback will have the component's setup in its stack trace 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1174,7 +1185,7 @@ exports[`errors and promises an error in onMounted callback will have the compon
 `;
 
 exports[`errors and promises an error in patched call will reject the render promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1188,7 +1199,7 @@ exports[`errors and promises an error in patched call will reject the render pro
 `;
 
 exports[`errors and promises an error in willPatch call will reject the render promise 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1202,7 +1213,7 @@ exports[`errors and promises an error in willPatch call will reject the render p
 `;
 
 exports[`errors and promises errors in mounted and in willUnmount 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1215,7 +1226,7 @@ exports[`errors and promises errors in mounted and in willUnmount 1`] = `
 `;
 
 exports[`errors and promises errors in onWillRender/onRender aren't wrapped more than once 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -1228,7 +1239,7 @@ exports[`errors and promises errors in onWillRender/onRender aren't wrapped more
 `;
 
 exports[`errors and promises errors in rerender 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`event handling Invalid handler throws an error 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -15,7 +15,7 @@ exports[`event handling Invalid handler throws an error 1`] = `
 `;
 
 exports[`event handling handler is not called if component is destroyed 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -29,7 +29,7 @@ exports[`event handling handler is not called if component is destroyed 1`] = `
 `;
 
 exports[`event handling handler receive the event as argument 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -45,7 +45,7 @@ exports[`event handling handler receive the event as argument 1`] = `
 `;
 
 exports[`event handling handler receive the event as argument 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -58,7 +58,7 @@ exports[`event handling handler receive the event as argument 2`] = `
 `;
 
 exports[`event handling input blur event is not called if component is destroyed 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -75,7 +75,7 @@ exports[`event handling input blur event is not called if component is destroyed
 `;
 
 exports[`event handling input blur event is not called if component is destroyed 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -89,7 +89,7 @@ exports[`event handling input blur event is not called if component is destroyed
 `;
 
 exports[`event handling objects from scope are properly captured by t-on 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;
@@ -115,7 +115,7 @@ exports[`event handling objects from scope are properly captured by t-on 1`] = `
 `;
 
 exports[`event handling support for callable expression in event handler 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -130,7 +130,7 @@ exports[`event handling support for callable expression in event handler 1`] = `
 `;
 
 exports[`event handling t-on with handler bound to dynamic argument on a t-foreach 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey } = helpers;

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`basics basic use 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -12,7 +12,7 @@ exports[`basics basic use 1`] = `
 `;
 
 exports[`basics basic use 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -26,7 +26,7 @@ exports[`basics basic use 2`] = `
 `;
 
 exports[`basics can select a sub widget  1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -44,7 +44,7 @@ exports[`basics can select a sub widget  1`] = `
 `;
 
 exports[`basics can select a sub widget  2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -57,7 +57,7 @@ exports[`basics can select a sub widget  2`] = `
 `;
 
 exports[`basics can select a sub widget  3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -70,7 +70,7 @@ exports[`basics can select a sub widget  3`] = `
 `;
 
 exports[`basics can select a sub widget, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -88,7 +88,7 @@ exports[`basics can select a sub widget, part 2 1`] = `
 `;
 
 exports[`basics can select a sub widget, part 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -101,7 +101,7 @@ exports[`basics can select a sub widget, part 2 2`] = `
 `;
 
 exports[`basics can select a sub widget, part 2 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -114,7 +114,7 @@ exports[`basics can select a sub widget, part 2 3`] = `
 `;
 
 exports[`basics sub widget is interactive 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -125,7 +125,7 @@ exports[`basics sub widget is interactive 1`] = `
 `;
 
 exports[`basics sub widget is interactive 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -140,7 +140,7 @@ exports[`basics sub widget is interactive 2`] = `
 `;
 
 exports[`basics top level sub widget with a parent 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -154,7 +154,7 @@ exports[`basics top level sub widget with a parent 1`] = `
 `;
 
 exports[`basics top level sub widget with a parent 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -165,7 +165,7 @@ exports[`basics top level sub widget with a parent 2`] = `
 `;
 
 exports[`basics top level sub widget with a parent 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`hooks autofocus hook input in a t-if 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -22,7 +22,7 @@ exports[`hooks autofocus hook input in a t-if 1`] = `
 `;
 
 exports[`hooks autofocus hook simple input 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -38,7 +38,7 @@ exports[`hooks autofocus hook simple input 1`] = `
 `;
 
 exports[`hooks can use onWillStart, onWillUpdateProps 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -49,7 +49,7 @@ exports[`hooks can use onWillStart, onWillUpdateProps 1`] = `
 `;
 
 exports[`hooks can use onWillStart, onWillUpdateProps 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -63,7 +63,7 @@ exports[`hooks can use onWillStart, onWillUpdateProps 2`] = `
 `;
 
 exports[`hooks can use useComponent 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -76,7 +76,7 @@ exports[`hooks can use useComponent 1`] = `
 `;
 
 exports[`hooks can use useEnv 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -90,7 +90,7 @@ exports[`hooks can use useEnv 1`] = `
 `;
 
 exports[`hooks mounted callbacks should be called in reverse order from willUnmount callbacks 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -104,7 +104,7 @@ exports[`hooks mounted callbacks should be called in reverse order from willUnmo
 `;
 
 exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -117,7 +117,7 @@ exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 1`] = `
 `;
 
 exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -135,7 +135,7 @@ exports[`hooks parent and child env (with useChildSubEnv then useSubEnv) 2`] = `
 `;
 
 exports[`hooks parent and child env (with useChildSubEnv) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -148,7 +148,7 @@ exports[`hooks parent and child env (with useChildSubEnv) 1`] = `
 `;
 
 exports[`hooks parent and child env (with useChildSubEnv) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -162,7 +162,7 @@ exports[`hooks parent and child env (with useChildSubEnv) 2`] = `
 `;
 
 exports[`hooks parent and child env (with useSubEnv) 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -175,7 +175,7 @@ exports[`hooks parent and child env (with useSubEnv) 1`] = `
 `;
 
 exports[`hooks parent and child env (with useSubEnv) 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -189,7 +189,7 @@ exports[`hooks parent and child env (with useSubEnv) 2`] = `
 `;
 
 exports[`hooks two different call to willPatch/patched should work 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -203,7 +203,7 @@ exports[`hooks two different call to willPatch/patched should work 1`] = `
 `;
 
 exports[`hooks useChildSubEnv does not pollute user env 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -217,7 +217,7 @@ exports[`hooks useChildSubEnv does not pollute user env 1`] = `
 `;
 
 exports[`hooks useChildSubEnv supports arbitrary descriptor 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -228,7 +228,7 @@ exports[`hooks useChildSubEnv supports arbitrary descriptor 1`] = `
 `;
 
 exports[`hooks useChildSubEnv supports arbitrary descriptor 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -243,7 +243,7 @@ exports[`hooks useChildSubEnv supports arbitrary descriptor 2`] = `
 `;
 
 exports[`hooks useEffect hook dependencies prevent effects from rerunning when unchanged 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -256,7 +256,7 @@ exports[`hooks useEffect hook dependencies prevent effects from rerunning when u
 `;
 
 exports[`hooks useEffect hook effect can depend on stuff in dom 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -275,7 +275,7 @@ exports[`hooks useEffect hook effect can depend on stuff in dom 1`] = `
 `;
 
 exports[`hooks useEffect hook effect runs on mount, is reapplied on patch, and is cleaned up on unmount and before reapplying 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -288,7 +288,7 @@ exports[`hooks useEffect hook effect runs on mount, is reapplied on patch, and i
 `;
 
 exports[`hooks useEffect hook effect with empty dependency list never reruns 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -302,7 +302,7 @@ exports[`hooks useEffect hook effect with empty dependency list never reruns 1`]
 `;
 
 exports[`hooks useEffect hook properly behaves when the effect function throws 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -315,7 +315,7 @@ exports[`hooks useEffect hook properly behaves when the effect function throws 1
 `;
 
 exports[`hooks useExternalListener 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -330,7 +330,7 @@ exports[`hooks useExternalListener 1`] = `
 `;
 
 exports[`hooks useExternalListener 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -344,7 +344,7 @@ exports[`hooks useExternalListener 2`] = `
 `;
 
 exports[`hooks useRef hook: basic use 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -360,7 +360,7 @@ exports[`hooks useRef hook: basic use 1`] = `
 `;
 
 exports[`hooks useSubEnv modifies user env 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -374,7 +374,7 @@ exports[`hooks useSubEnv modifies user env 1`] = `
 `;
 
 exports[`hooks useSubEnv supports arbitrary descriptor 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -385,7 +385,7 @@ exports[`hooks useSubEnv supports arbitrary descriptor 1`] = `
 `;
 
 exports[`hooks useSubEnv supports arbitrary descriptor 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   

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

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`lifecycle hooks basic checks for a component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -14,7 +14,7 @@ exports[`lifecycle hooks basic checks for a component 1`] = `
 `;
 
 exports[`lifecycle hooks component semantics 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -29,7 +29,7 @@ exports[`lifecycle hooks component semantics 1`] = `
 `;
 
 exports[`lifecycle hooks component semantics 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -42,7 +42,7 @@ exports[`lifecycle hooks component semantics 2`] = `
 `;
 
 exports[`lifecycle hooks component semantics 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -62,7 +62,7 @@ exports[`lifecycle hooks component semantics 3`] = `
 `;
 
 exports[`lifecycle hooks component semantics 4`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -75,7 +75,7 @@ exports[`lifecycle hooks component semantics 4`] = `
 `;
 
 exports[`lifecycle hooks component semantics 5`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -88,7 +88,7 @@ exports[`lifecycle hooks component semantics 5`] = `
 `;
 
 exports[`lifecycle hooks component semantics 6`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -101,7 +101,7 @@ exports[`lifecycle hooks component semantics 6`] = `
 `;
 
 exports[`lifecycle hooks components are unmounted and destroyed if no longer in DOM, even after updateprops 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -119,7 +119,7 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
 `;
 
 exports[`lifecycle hooks components are unmounted and destroyed if no longer in DOM, even after updateprops 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -133,7 +133,7 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
 `;
 
 exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -148,7 +148,7 @@ exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM
 `;
 
 exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -161,7 +161,7 @@ exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM
 `;
 
 exports[`lifecycle hooks destroy new children before being mountged 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -178,7 +178,7 @@ exports[`lifecycle hooks destroy new children before being mountged 1`] = `
 `;
 
 exports[`lifecycle hooks destroy new children before being mountged 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -189,7 +189,7 @@ exports[`lifecycle hooks destroy new children before being mountged 2`] = `
 `;
 
 exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -203,7 +203,7 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
 `;
 
 exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -216,7 +216,7 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
 `;
 
 exports[`lifecycle hooks lifecycle callbacks are bound to component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -227,7 +227,7 @@ exports[`lifecycle hooks lifecycle callbacks are bound to component 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle callbacks are bound to component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -238,7 +238,7 @@ exports[`lifecycle hooks lifecycle callbacks are bound to component 2`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -252,7 +252,7 @@ exports[`lifecycle hooks lifecycle semantics 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -265,7 +265,7 @@ exports[`lifecycle hooks lifecycle semantics 2`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -280,7 +280,7 @@ exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 2 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -291,7 +291,7 @@ exports[`lifecycle hooks lifecycle semantics, part 2 2`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 2 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -304,7 +304,7 @@ exports[`lifecycle hooks lifecycle semantics, part 2 3`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -319,7 +319,7 @@ exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 4 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -334,7 +334,7 @@ exports[`lifecycle hooks lifecycle semantics, part 4 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 4 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -345,7 +345,7 @@ exports[`lifecycle hooks lifecycle semantics, part 4 2`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 4 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -358,7 +358,7 @@ exports[`lifecycle hooks lifecycle semantics, part 4 3`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 5 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -373,7 +373,7 @@ exports[`lifecycle hooks lifecycle semantics, part 5 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -386,7 +386,7 @@ exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -397,7 +397,7 @@ exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
 `;
 
 exports[`lifecycle hooks lifecycle semantics, part 6 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -410,7 +410,7 @@ exports[`lifecycle hooks lifecycle semantics, part 6 2`] = `
 `;
 
 exports[`lifecycle hooks mounted hook is called if mounted in DOM 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -423,7 +423,7 @@ exports[`lifecycle hooks mounted hook is called if mounted in DOM 1`] = `
 `;
 
 exports[`lifecycle hooks mounted hook is called on every mount, not just the first one 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -438,7 +438,7 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
 `;
 
 exports[`lifecycle hooks mounted hook is called on every mount, not just the first one 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -451,7 +451,7 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
 `;
 
 exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -465,7 +465,7 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
 `;
 
 exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -478,7 +478,7 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
 `;
 
 exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -495,7 +495,7 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 `;
 
 exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -509,7 +509,7 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 `;
 
 exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -522,7 +522,7 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
 `;
 
 exports[`lifecycle hooks onWillRender 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -533,7 +533,7 @@ exports[`lifecycle hooks onWillRender 1`] = `
 `;
 
 exports[`lifecycle hooks onWillRender 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -548,7 +548,7 @@ exports[`lifecycle hooks onWillRender 2`] = `
 `;
 
 exports[`lifecycle hooks patched hook is called after updateProps 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -562,7 +562,7 @@ exports[`lifecycle hooks patched hook is called after updateProps 1`] = `
 `;
 
 exports[`lifecycle hooks patched hook is called after updateProps 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -575,7 +575,7 @@ exports[`lifecycle hooks patched hook is called after updateProps 2`] = `
 `;
 
 exports[`lifecycle hooks patched hook is called after updating State 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -589,7 +589,7 @@ exports[`lifecycle hooks patched hook is called after updating State 1`] = `
 `;
 
 exports[`lifecycle hooks render in mounted 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -603,7 +603,7 @@ exports[`lifecycle hooks render in mounted 1`] = `
 `;
 
 exports[`lifecycle hooks render in patched 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -617,7 +617,7 @@ exports[`lifecycle hooks render in patched 1`] = `
 `;
 
 exports[`lifecycle hooks render in willPatch 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -631,7 +631,7 @@ exports[`lifecycle hooks render in willPatch 1`] = `
 `;
 
 exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly called 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -646,7 +646,7 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
 `;
 
 exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly called 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -659,7 +659,7 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
 `;
 
 exports[`lifecycle hooks timeout in onWillStart emits a warning 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -672,7 +672,7 @@ exports[`lifecycle hooks timeout in onWillStart emits a warning 1`] = `
 `;
 
 exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -685,7 +685,7 @@ exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 1`] = `
 `;
 
 exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -696,7 +696,7 @@ exports[`lifecycle hooks timeout in onWillUpdateProps emits a warning 2`] = `
 `;
 
 exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents, in proper order 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -710,7 +710,7 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 `;
 
 exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents, in proper order 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -724,7 +724,7 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 `;
 
 exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents, in proper order 3`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -738,7 +738,7 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
 `;
 
 exports[`lifecycle hooks willStart hook is called on sub component 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -749,7 +749,7 @@ exports[`lifecycle hooks willStart hook is called on sub component 1`] = `
 `;
 
 exports[`lifecycle hooks willStart hook is called on sub component 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -762,7 +762,7 @@ exports[`lifecycle hooks willStart hook is called on sub component 2`] = `
 `;
 
 exports[`lifecycle hooks willStart is called 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -775,7 +775,7 @@ exports[`lifecycle hooks willStart is called 1`] = `
 `;
 
 exports[`lifecycle hooks willStart is called with component as this 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -788,7 +788,7 @@ exports[`lifecycle hooks willStart is called with component as this 1`] = `
 `;
 
 exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is mounted in some other position 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -808,7 +808,7 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
 `;
 
 exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is mounted in some other position 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -821,7 +821,7 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
 `;
 
 exports[`lifecycle hooks willUpdateProps hook is called 1`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
@@ -832,7 +832,7 @@ exports[`lifecycle hooks willUpdateProps hook is called 1`] = `
 `;
 
 exports[`lifecycle hooks willUpdateProps hook is called 2`] = `
-"function anonymous(bdom, helpers
+"function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;