[FIX] fiber, lifecycle: trigger a render during the fiber.complete

Have a component which does a render in its onWillPatch, onPatched, onMounted hooks.

Before this commit, the result was incorrect: the second rendering was not taken into account.

After this commit, those renderings are correctly applied at the price of a delayed render when the fiber
is in a critical state.
This commit is contained in:
Lucas Perais (lpe)
2021-12-14 09:31:25 +01:00
committed by Aaron Bohy
parent e2819323ee
commit ddc358f48a
6 changed files with 224 additions and 8 deletions
+40 -2
View File
@@ -2466,10 +2466,14 @@ test("two renderings initiated between willPatch and patched", async () => {
let parent: any = null;
class Panel extends Component {
static template = xml`<abc><t t-esc="props.val"/></abc>`;
static template = xml`<abc><t t-esc="props.val"/><t t-esc="mounted" /></abc>`;
mounted: any;
setup() {
useLogLifecycle();
onMounted(() => parent.render());
onMounted(() => {
this.mounted = "Mounted";
parent.render();
});
onWillUnmount(() => parent.render());
}
}
@@ -2498,8 +2502,22 @@ test("two renderings initiated between willPatch and patched", async () => {
"Panel:rendered",
"Panel:mounted",
"Parent:mounted",
"Parent:willRender",
"Panel:willUpdateProps",
"Parent:rendered",
]).toBeLogged();
await nextTick();
expect([
"Panel:willRender",
"Panel:rendered",
"Parent:willPatch",
"Panel:willPatch",
"Panel:patched",
"Parent:patched",
]).toBeLogged();
expect(fixture.innerHTML).toBe("<div><abc>Panel1Mounted</abc></div>");
parent.state.panel = "Panel2";
await nextTick();
expect(fixture.innerHTML).toBe("<div><abc>Panel2</abc></div>");
@@ -2515,6 +2533,20 @@ test("two renderings initiated between willPatch and patched", async () => {
"Panel:willDestroy",
"Panel:mounted",
"Parent:patched",
"Parent:willRender",
"Panel:willUpdateProps",
"Parent:rendered",
]).toBeLogged();
await nextTick();
expect(fixture.innerHTML).toBe("<div><abc>Panel2Mounted</abc></div>");
expect([
"Panel:willRender",
"Panel:rendered",
"Parent:willPatch",
"Panel:willPatch",
"Panel:patched",
"Parent:patched",
]).toBeLogged();
parent.state.flag = false;
@@ -2527,7 +2559,13 @@ test("two renderings initiated between willPatch and patched", async () => {
"Panel:willUnmount",
"Panel:willDestroy",
"Parent:patched",
"Parent:willRender",
"Parent:rendered",
]).toBeLogged();
await nextTick();
expect(fixture.innerHTML).toBe("<div></div>");
expect(["Parent:willPatch", "Parent:patched"]).toBeLogged();
});
test("parent and child rendered at exact same time", async () => {