From 2fb6ebb0c5aec047c44e17d5147c38972129783c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?G=C3=A9ry=20Debongnie?= Date: Tue, 12 Mar 2019 11:42:46 +0100 Subject: [PATCH] small refactoring --- web/static/src/ts/core/component.ts | 46 ++++++++----------- web/static/src/ts/core/qweb_vdom.ts | 4 -- web/static/src/ts/widget.ts | 30 +++++++++--- .../core/__snapshots__/component.test.ts.snap | 6 +-- 4 files changed, 42 insertions(+), 44 deletions(-) diff --git a/web/static/src/ts/core/component.ts b/web/static/src/ts/core/component.ts index d099e815..e8d7599c 100644 --- a/web/static/src/ts/core/component.ts +++ b/web/static/src/ts/core/component.ts @@ -18,7 +18,7 @@ export interface WEnv { let wl: any[] = []; (window).wl = wl; -interface Meta { +export interface Meta { readonly id: number; vnode: VNode | null; isStarted: boolean; @@ -31,7 +31,7 @@ interface Meta { cmap: { [key: number]: number }; renderId: number; - renderProps: any; + renderProps: Props | null; renderPromise: Promise | null; boundHandlers: { [key: number]: any }; } @@ -51,7 +51,7 @@ export class Component< Props, State extends {} > extends EventBus { - readonly __widget__: Meta; + readonly __widget__: Meta; 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 { + async updateProps(nextProps: Props): Promise { + if (nextProps === this.__widget__.renderProps) { + await this.__widget__.renderPromise; + return; + } const shouldUpdate = this.shouldUpdate(nextProps); - this.props = nextProps; - return shouldUpdate ? this.render() : Promise.resolve(); + return shouldUpdate ? this._updateProps(nextProps) : Promise.resolve(); } //-------------------------------------------------------------------------- // Private //-------------------------------------------------------------------------- + async _updateProps(nextProps: Props): Promise { + this.props = nextProps; + return this.render(); + } + async render(): Promise { 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 { + async _start(): Promise { 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) => boolean) { + visitSubTree(callback: (w: Component) => boolean) { const shouldVisitChildren = callback(this); if (shouldVisitChildren) { const children = this.__widget__.children; @@ -321,21 +329,3 @@ export class Component< } } } - -export class PureComponent extends Component { - shouldUpdate(nextProps: P): boolean { - for (let k in nextProps) { - if (nextProps[k] !== this.props[k]) { - return true; - } - } - return false; - } - async updateState(nextState: Partial) { - for (let k in nextState) { - if (nextState[k] !== this.state[k]) { - return super.updateState(nextState); - } - } - } -} diff --git a/web/static/src/ts/core/qweb_vdom.ts b/web/static/src/ts/core/qweb_vdom.ts index 48b35eb2..8ab751c8 100644 --- a/web/static/src/ts/core/qweb_vdom.ts +++ b/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`); diff --git a/web/static/src/ts/widget.ts b/web/static/src/ts/widget.ts index 2e1f99b3..9b6254cc 100644 --- a/web/static/src/ts/widget.ts +++ b/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 extends Component {} - -export class PureWidget extends PureComponent { +export class Widget extends Component { constructor(parent, props) { super(parent, props); (this.__widget__).isMobile = this.env.isMobile; } - shouldUpdate(nextProps: P): boolean { + async updateProps(nextProps: P): Promise { if ((this.__widget__).isMobile !== this.env.isMobile) { (this.__widget__).isMobile = this.env.isMobile; - return true; + return this._updateProps(nextProps); + } + return super.updateProps(nextProps); + } +} + +export class PureWidget extends Widget { + shouldUpdate(nextProps: P): boolean { + for (let k in nextProps) { + if (nextProps[k] !== this.props[k]) { + return true; + } + } + return false; + } + async updateState(nextState: Partial) { + for (let k in nextState) { + if (nextState[k] !== this.state[k]) { + return super.updateState(nextState); + } } - return super.shouldUpdate(nextProps); } } diff --git a/web/static/tests/core/__snapshots__/component.test.ts.snap b/web/static/tests/core/__snapshots__/component.test.ts.snap index 85b6188a..2549ab0b 100644 --- a/web/static/tests/core/__snapshots__/component.test.ts.snap +++ b/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.__widget__.renderPromise; - } else { - def3 = w4.updateProps(props4); - } + def3 = w4.updateProps(props4); } else { isNew4 = true if (props4 === w4.__widget__.renderProps) {