small refactoring

web/static/src/ts/core/component.ts

@@ -18,7 +18,7 @@ export interface WEnv {
 let wl: any[] = [];
 (<any>window).wl = wl;
 
-interface Meta<T extends WEnv> {
+export interface Meta<T extends WEnv, Props> {
   readonly id: number;
   vnode: VNode | null;
   isStarted: boolean;
@@ -31,7 +31,7 @@ interface Meta<T extends WEnv> {
   cmap: { [key: number]: number };
 
   renderId: number;
-  renderProps: any;
+  renderProps: Props | null;
   renderPromise: Promise<VNode> | null;
   boundHandlers: { [key: number]: any };
 }
@@ -51,7 +51,7 @@ export class Component<
   Props,
   State extends {}
 > extends EventBus {
-  readonly __widget__: Meta<WEnv>;
+  readonly __widget__: Meta<WEnv, Props>;
   template: string = "default";
   inlineTemplate: string | null = null;
 
@@ -101,7 +101,7 @@ export class Component<
       cmap: {},
       renderId: 1,
       renderPromise: null,
-      renderProps: props,
+      renderProps: props || null,
       boundHandlers: {}
     };
   }
@@ -216,16 +216,24 @@ export class Component<
     }
   }
 
-  updateProps(nextProps: Props): Promise<void> {
+  async updateProps(nextProps: Props): Promise<void> {
+    if (nextProps === this.__widget__.renderProps) {
+      await this.__widget__.renderPromise;
+      return;
+    }
     const shouldUpdate = this.shouldUpdate(nextProps);
-    this.props = nextProps;
+    return shouldUpdate ? this._updateProps(nextProps) : Promise.resolve();
-    return shouldUpdate ? this.render() : Promise.resolve();
   }
 
   //--------------------------------------------------------------------------
   // Private
   //--------------------------------------------------------------------------
 
+  async _updateProps(nextProps: Props): Promise<void> {
+    this.props = nextProps;
+    return this.render();
+  }
+
   async render(): Promise<void> {
     if (this.__widget__.isDestroyed) {
       return;
@@ -240,14 +248,14 @@ export class Component<
     }
   }
 
-  private _patch(vnode) {
+  _patch(vnode) {
     this.__widget__.renderPromise = null;
     this.__widget__.vnode = patch(
       this.__widget__.vnode || document.createElement(vnode.sel!),
       vnode
     );
   }
-  private async _start(): Promise<VNode> {
+  async _start(): Promise<VNode> {
     this.__widget__.renderProps = this.props;
     this.__widget__.renderPromise = this.willStart().then(() => {
       if (this.__widget__.isDestroyed) {
@@ -311,7 +319,7 @@ export class Component<
     }
   }
 
-  private visitSubTree(callback: (w: Component<T, any, any>) => boolean) {
+  visitSubTree(callback: (w: Component<T, any, any>) => boolean) {
     const shouldVisitChildren = callback(this);
     if (shouldVisitChildren) {
       const children = this.__widget__.children;
@@ -321,21 +329,3 @@ export class Component<
     }
   }
 }
-
-export class PureComponent<T extends WEnv, P, S> extends Component<T, P, S> {
-  shouldUpdate(nextProps: P): boolean {
-    for (let k in nextProps) {
-      if (nextProps[k] !== this.props[k]) {
-        return true;
-      }
-    }
-    return false;
-  }
-  async updateState(nextState: Partial<S>) {
-    for (let k in nextState) {
-      if (nextState[k] !== this.state[k]) {
-        return super.updateState(nextState);
-      }
-    }
-  }
-}

web/static/src/ts/core/qweb_vdom.ts

@@ -852,11 +852,7 @@ const widgetDirective: Directive = {
     // check if we can reuse current rendering promise
     ctx.addIf(`w${widgetID} && w${widgetID}.__widget__.renderPromise`);
     ctx.addIf(`w${widgetID}.__widget__.isStarted`);
-    ctx.addIf(`props${widgetID} === w${widgetID}.__widget__.renderProps`);
-    ctx.addLine(`def${defID} = w${widgetID}.__widget__.renderPromise;`);
-    ctx.addElse();
     ctx.addLine(`def${defID} = w${widgetID}.updateProps(props${widgetID});`);
-    ctx.closeIf();
     ctx.addElse();
     ctx.addLine(`isNew${widgetID} = true`);
     ctx.addIf(`props${widgetID} === w${widgetID}.__widget__.renderProps`);

web/static/src/ts/widget.ts

@@ -1,22 +1,38 @@
-import { Component, PureComponent } from "./core/component";
+import { Component } from "./core/component";
 import { Env } from "./env";
 
 //------------------------------------------------------------------------------
 // Widget classes
 //------------------------------------------------------------------------------
 
-export class Widget<Props, State> extends Component<Env, Props, State> {}
+export class Widget<P, S> extends Component<Env, P, S> {
-
-export class PureWidget<P, S> extends PureComponent<Env, P, S> {
   constructor(parent, props) {
     super(parent, props);
     (<any>this.__widget__).isMobile = this.env.isMobile;
   }
-  shouldUpdate(nextProps: P): boolean {
+  async updateProps(nextProps: P): Promise<void> {
     if ((<any>this.__widget__).isMobile !== this.env.isMobile) {
       (<any>this.__widget__).isMobile = this.env.isMobile;
-      return true;
+      return this._updateProps(nextProps);
+    }
+    return super.updateProps(nextProps);
+  }
+}
+
+export class PureWidget<P, S> extends Widget<P, S> {
+  shouldUpdate(nextProps: P): boolean {
+    for (let k in nextProps) {
+      if (nextProps[k] !== this.props[k]) {
+        return true;
+      }
+    }
+    return false;
+  }
+  async updateState(nextState: Partial<S>) {
+    for (let k in nextState) {
+      if (nextState[k] !== this.state[k]) {
+        return super.updateState(nextState);
+      }
     }
-    return super.shouldUpdate(nextProps);
   }
 }

web/static/tests/core/__snapshots__/component.test.ts.snap

@@ -16,11 +16,7 @@ exports[`random stuff/miscellaneous snapshotting compiled code 1`] = `
     let isNew4 = !w4;
     if (w4 && w4.__widget__.renderPromise) {
         if (w4.__widget__.isStarted) {
-            if (props4 === w4.__widget__.renderProps) {
+            def3 = w4.updateProps(props4);
-                def3 = w4.__widget__.renderPromise;
-            } else {
-                def3 = w4.updateProps(props4);
-            }
         } else {
             isNew4 = true
             if (props4 === w4.__widget__.renderProps) {