work on composability

src/core/qweb_directives.ts

@@ -218,6 +218,25 @@ const onDirective: Directive = {
   }
 };
 
+const widgetDirective: Directive = {
+  name: "widget",
+  priority: 100,
+  atNodeEncounter({ ctx, fullName, value, node, qweb}): boolean {
+    let spanID = ctx.generateID();
+    ctx.addLine(`let ${spanID} = document.createElement('span')`);
+    ctx.addNode(spanID)
+    let props = node.getAttribute('t-props');
+    let widgetID = ctx.generateID();
+    ctx.addLine(`let ${widgetID} = new context.widgets['${value}'](context, ${props})`);
+    ctx.addLine(`${widgetID}.mount(${spanID}).then(()=>${ctx.parentNode}.replaceChild(${widgetID}.el, ${spanID}))`);
+    let ref = node.getAttribute('t-ref');
+    if (ref) {
+      ctx.addLine(`context.refs['${ref}'] = ${widgetID}`);
+    }
+    return true;
+  }
+};
+
 export default [
   forEachDirective,
   ifDirective,
@@ -227,5 +246,6 @@ export default [
   setDirective,
   escDirective,
   rawDirective,
-  onDirective
+  onDirective,
+  widgetDirective
 ];

src/core/widget.ts

@@ -44,6 +44,8 @@ export default class Widget {
 
   async mount(target: HTMLElement) {
     await this.willStart();
+    this.env!.qweb.addTemplate(this.name, this.template);
+    delete this.template;
     await this.render();
     target.appendChild(this.el!);
   }
@@ -56,8 +58,6 @@ export default class Widget {
 
   setEnvironment(env: Env) {
     this.env = Object.create(env);
-    env.qweb.addTemplate(this.name, this.template);
-    delete this.template;
   }
 
   async updateState(newState: Object) {