[IMP] qweb,component: make QWeb an event bus

closes #197

src/component.ts

@@ -134,6 +134,19 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
       parent.__owl__.children[id] = this;
     } else {
       this.env = parent;
+      this.env.qweb.on("update", this, () => {
+        if (this.__owl__.isMounted) {
+          this.render(true);
+        }
+        if (this.__owl__.isDestroyed) {
+          // this is unlikely to happen, but if a root widget is destroyed,
+          // we want to remove our subscription.  The usual way to do that
+          // would be to perform some check in the destroy method, but since
+          // it is very performance sensitive, and since this is a rare event,
+          // we simply do it lazily
+          this.env.qweb.off("update", this);
+        }
+      });
     }
     this.__owl__ = {
       id: id,
@@ -593,7 +606,9 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
       for (let i = 0, l = propsDef.length; i < l; i++) {
         if (!(propsDef[i] in props)) {
           throw new Error(
-            `Missing props '${propsDef[i]}' (component '${this.constructor.name}')`
+            `Missing props '${propsDef[i]}' (component '${
+              this.constructor.name
+            }')`
           );
         }
       }
@@ -603,7 +618,9 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
         if (!(propName in props)) {
           if (propsDef[propName] && !propsDef[propName].optional) {
             throw new Error(
-              `Missing props '${propName}' (component '${this.constructor.name}')`
+              `Missing props '${propName}' (component '${
+                this.constructor.name
+              }')`
             );
           } else {
             break;

src/qweb_core.ts

@@ -1,5 +1,6 @@
 import { VNode, h } from "./vdom";
 import { QWebVar, compileExpr } from "./qweb_expressions";
+import { EventBus } from "./event_bus";
 
 /**
  * Owl QWeb Engine
@@ -127,7 +128,7 @@ let nextID = 1;
 //------------------------------------------------------------------------------
 // QWeb rendering engine
 //------------------------------------------------------------------------------
-export class QWeb {
+export class QWeb extends EventBus {
   templates: { [name: string]: Template } = {};
   utils = UTILS;
   static components = Object.create(null);
@@ -146,6 +147,7 @@ export class QWeb {
   nextSlotId = 1;
 
   constructor(data?: string) {
+    super();
     if (data) {
       this.addTemplates(data);
     }
@@ -348,10 +350,10 @@ export class QWeb {
 
     const firstLetter = node.tagName[0];
     if (firstLetter === firstLetter.toUpperCase()) {
-        // this is a component, we modify in place the xml document to change
-        // <SomeComponent ... /> to <t t-component="SomeComponent" ... />
-        node.setAttribute('t-component', node.tagName);
-        node.nodeValue = 't';
+      // this is a component, we modify in place the xml document to change
+      // <SomeComponent ... /> to <t t-component="SomeComponent" ... />
+      node.setAttribute("t-component", node.tagName);
+      node.nodeValue = "t";
     }
     const attributes = (<Element>node).attributes;
 
@@ -391,7 +393,7 @@ export class QWeb {
           fullName = name;
           value = attributes[j].textContent;
           validDirectives.push({ directive, value, fullName });
-          if (directive.name === "on" || directive.name === 'model') {
+          if (directive.name === "on" || directive.name === "model") {
             withHandlers = true;
           }
         }