[REF] component: refactor fiber creation methods

src/component/component.ts

@@ -293,7 +293,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     if (__owl__.isMounted) {
       return;
     }
-    const fiber = this.__createRootFiber(false);
+    const fiber = this.__createFiber(false, undefined, undefined, undefined);
     if (!__owl__.vnode) {
       fiber.promise = this.__prepareAndRender(fiber);
       const vnode = await fiber.promise;
@@ -340,7 +340,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     if (!__owl__.isMounted) {
       return;
     }
-    const fiber = this.__createRootFiber(force);
+    const fiber = this.__createFiber(force, undefined, undefined, undefined);
     fiber.patchQueue.push(fiber);
     fiber.promise = this.__render(fiber);
     await fiber.promise;
@@ -352,38 +352,25 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
     }
   }
 
-  __createRootFiber(force): Fiber<Props> {
+  __createFiber(force, scope, vars, parent?: Fiber<any>): Fiber<Props> {
     const fiber: Fiber<Props> = {
       force,
-      scope: undefined,
+      scope,
-      vars: undefined,
+      vars,
       rootFiber: null,
       isCancelled: false,
       component: this,
       vnode: null,
-      patchQueue: [],
+      patchQueue: parent ? parent.patchQueue : [],
       willPatchResult: null,
       props: this.props,
       promise: null
     };
-    fiber.rootFiber = fiber;
+    fiber.rootFiber = parent || fiber;
     this.__owl__.currentFiber = fiber;
     return fiber;
   }
 
-  __createSubFiber(parent: Fiber<Props>, scope, vars): Fiber<Props> {
-    const fiber = Object.create(parent);
-    fiber.scope = scope;
-    fiber.vars = vars;
-    fiber.component = this;
-    fiber.vnode = null;
-    fiber.willPatchResult = null;
-    this.__owl__.currentFiber = fiber;
-    fiber.props = this.props;
-    fiber.promise = null;
-    return fiber;
-  }
-
   /**
    * Destroy the component.  This operation is quite complex:
    *  - it recursively destroy all children
@@ -537,7 +524,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
       }
       await this.willUpdateProps(nextProps);
       this.props = nextProps;
-      const fiber = this.__createSubFiber(parentFiber, scope, vars);
+      const fiber = this.__createFiber(parentFiber.force, scope, vars, parentFiber);
       fiber.patchQueue.push(fiber);
 
       await this.__render(fiber);
@@ -560,7 +547,7 @@ export class Component<T extends Env, Props extends {}, State extends {}> {
    * parent template.
    */
   __prepare(parentFiber: Fiber<any>, scope: any, vars: any): Promise<VNode> {
-    const fiber = this.__createSubFiber(parentFiber, scope, vars);
+    const fiber = this.__createFiber(parentFiber.force, scope, vars, parentFiber);
     fiber.promise = this.__prepareAndRender(fiber);
     return fiber.promise;
   }

src/store/connected_component.ts

@@ -1,4 +1,5 @@
 import { Component, Env, Fiber } from "../component/component";
+import { VNode } from "../vdom/index";
 
 //------------------------------------------------------------------------------
 // Connect function
@@ -46,9 +47,7 @@ export class ConnectedComponent<T extends Env, P, S> extends Component<T, P, S>
   /**
    * Need to do this here so 'deep' can be overrided by subcomponent easily
    */
-  async __prepareAndRender(
+  async __prepareAndRender(fiber: Fiber<P>): Promise<VNode> {
-    fiber: Fiber
-  ): ReturnType<Component<any, any, any>["__prepareAndRender"]> {
     const store = this.getStore(this.env);
     const ownProps = this.props || {};
     this.storeProps = (<any>this.constructor).mapStoreToProps(store.state, ownProps, store.getters);

tests/component/props_validation.test.ts

@@ -334,7 +334,7 @@ describe("default props", () => {
     const w = new TestWidget(env, { p: 1 });
     await w.mount(fixture);
     expect(fixture.innerHTML).toMatchSnapshot();
-    const fiber = w.__createRootFiber(false);
+    const fiber = w.__createFiber(false, undefined, undefined, undefined);
     await w.__updateProps({}, fiber);
     await w.render();
     expect(w.props.p).toBe(4);

tests/store/connected_component.test.ts

@@ -910,7 +910,7 @@ describe("connected components and default values", () => {
     await app.mount(fixture);
     expect(fixture.innerHTML).toBe("<div><div>Hello, John</div></div>");
 
-    const fiber = app.__createRootFiber(true);
+    const fiber = app.__createFiber(true, undefined, undefined, undefined);
     await app.__updateProps({ initialRecipient: "James" }, fiber);
     await app.render();
     expect(fixture.innerHTML).toBe("<div><div>Hello, James</div></div>");
@@ -998,7 +998,7 @@ describe("connected components and default values", () => {
       "<div><div><div>100Message100</div><div>101Message101</div></div></div>"
     );
 
-    const fiber = app.__createRootFiber(true);
+    const fiber = app.__createFiber(true, undefined, undefined, undefined);
     await app.__updateProps({ threadId: 2 }, fiber);
     await app.render();
     expect(fixture.innerHTML).toBe("<div><div><div>200Message200</div></div></div>");