From 9843d165852bc18042b213c7546da8e97834e1db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A9ry=20Debongnie?= <ged@odoo.com>
Date: Fri, 23 Aug 2019 22:22:34 +0200
Subject: [PATCH] [REF] component: improve render method

---
 src/component/component.ts                    | 20 +++++++++----------
 .../props_validation.test.ts.snap             |  4 ++++
 tests/component/props_validation.test.ts      |  8 ++++++++
 tests/store/connected_component.test.ts       |  3 +++
 4 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/component/component.ts b/src/component/component.ts
index 126e1bb9..3641543d 100644
--- a/src/component/component.ts
+++ b/src/component/component.ts
@@ -273,7 +273,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     if (this.__owl__.isMounted) {
       return;
     }
-    if (!this.__owl__.vnode ) {
+    if (!this.__owl__.vnode) {
       // we use the fact that renderId === 1 as a way to determine that the
       // component is mounted for the first time
       const vnode = await this.__prepare();
@@ -297,20 +297,17 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     }
   }
 
-  async render(force: boolean = false, patchQueue?: any[], scope?: any, vars?: any): Promise<void> {
+  async render(force: boolean = false): Promise<void> {
     const __owl__ = this.__owl__;
     if (!__owl__.isMounted) {
       return;
     }
-    const shouldPatch: boolean = !patchQueue;
-    if (shouldPatch) {
-      patchQueue = [];
-    }
-    __owl__.renderId++
-    const renderId = __owl__.renderId;
-    await this.__render(force, patchQueue, scope, vars);
+    const patchQueue = [];
 
-    if (shouldPatch && __owl__.isMounted && renderId === __owl__.renderId) {
+    const renderId = ++__owl__.renderId;
+    await this.__render(force, patchQueue, undefined, undefined);
+
+    if (__owl__.isMounted && renderId === __owl__.renderId) {
       // we only update the vnode and the actual DOM if no other rendering
       // occurred between now and when the render method was initially called.
       this.__applyPatchQueue(<any[]>patchQueue);
@@ -456,7 +453,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
       }
       await this.willUpdateProps(nextProps);
       this.props = nextProps;
-      await this.render(forceUpdate, patchQueue, scope, vars);
+      await this.__render(forceUpdate, patchQueue, scope, vars);
     }
   }
 
@@ -513,6 +510,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     }
     __owl__.render = qweb.render.bind(qweb, this.template);
     this.__observeState();
+
     return this.__render(false, [], scope, vars);
   }
 
diff --git a/tests/component/__snapshots__/props_validation.test.ts.snap b/tests/component/__snapshots__/props_validation.test.ts.snap
index 709338da..f76c5631 100644
--- a/tests/component/__snapshots__/props_validation.test.ts.snap
+++ b/tests/component/__snapshots__/props_validation.test.ts.snap
@@ -1,5 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`default props default values are also set whenever component is updated 1`] = `"<div>1</div>"`;
+
+exports[`default props default values are also set whenever component is updated 2`] = `"<div>4</div>"`;
+
 exports[`props validation props are validated in dev mode (code snapshot) 1`] = `
 "function anonymous(context,extra
 ) {
diff --git a/tests/component/props_validation.test.ts b/tests/component/props_validation.test.ts
index 939e6976..2c30bf37 100644
--- a/tests/component/props_validation.test.ts
+++ b/tests/component/props_validation.test.ts
@@ -327,9 +327,17 @@ describe("default props", () => {
     class TestWidget extends Widget {
       static defaultProps = { p: 4 };
     }
+    env.qweb.addTemplates(`
+        <templates>
+            <div t-name="TestWidget"><t t-esc="props.p"/></div>
+        </templates>`);
 
     const w = new TestWidget(env, { p: 1 });
+    await w.mount(fixture);
+    expect(fixture.innerHTML).toMatchSnapshot();
     await w.__updateProps({});
+    await w.render();
     expect(w.props.p).toBe(4);
+    expect(fixture.innerHTML).toMatchSnapshot();
   });
 });
diff --git a/tests/store/connected_component.test.ts b/tests/store/connected_component.test.ts
index 29b259bd..29914c11 100644
--- a/tests/store/connected_component.test.ts
+++ b/tests/store/connected_component.test.ts
@@ -818,9 +818,11 @@ describe("connected components and default values", () => {
     expect(fixture.innerHTML).toBe("<div><div>Hello, John</div></div>");
 
     await app.__updateProps({ initialRecipient: "James" }, true);
+    await app.render();
     expect(fixture.innerHTML).toBe("<div><div>Hello, James</div></div>");
 
     await app.__updateProps({ initialRecipient: undefined }, true);
+    await app.render();
     expect(fixture.innerHTML).toBe("<div><div>Hello, John</div></div>");
   });
 
@@ -903,6 +905,7 @@ describe("connected components and default values", () => {
     );
 
     await app.__updateProps({ threadId: 2 }, true);
+    await app.render();
     expect(fixture.innerHTML).toBe("<div><div><div>200Message200</div></div></div>");
 
     store.commit("changeMessageContent", 200, "UpdatedMessage200");