mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[FIX] component: force mounting subcomponents with shouldUpdate
Components can implement shouldUpdate to return false. In that case, renderings coming from above should be ignored. However, if the component was unmounted and is remounted, we actually need to force a rerendering in that case, so it is mounted, otherwise the subcomponent is left in unmounted state, which means that rendering are ignored. closes #800
This commit is contained in:
@@ -333,7 +333,7 @@ export class Component<Props extends {} = any, T extends Env = Env> {
|
|||||||
message += `\nMaybe the DOM is not ready yet? (in that case, you can use owl.utils.whenReady)`;
|
message += `\nMaybe the DOM is not ready yet? (in that case, you can use owl.utils.whenReady)`;
|
||||||
throw new Error(message);
|
throw new Error(message);
|
||||||
}
|
}
|
||||||
const fiber = new Fiber(null, this, false, target, position);
|
const fiber = new Fiber(null, this, true, target, position);
|
||||||
fiber.shouldPatch = false;
|
fiber.shouldPatch = false;
|
||||||
if (!__owl__.vnode) {
|
if (!__owl__.vnode) {
|
||||||
this.__prepareAndRender(fiber, () => {});
|
this.__prepareAndRender(fiber, () => {});
|
||||||
|
|||||||
@@ -600,4 +600,51 @@ describe("unmounting and remounting", () => {
|
|||||||
await parent.render();
|
await parent.render();
|
||||||
expect(fixture.textContent).toBe("fixedsome text");
|
expect(fixture.textContent).toBe("fixedsome text");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test("remounting component tree where a component implement shouldupdate", async () => {
|
||||||
|
let state: any;
|
||||||
|
const steps = [];
|
||||||
|
class Child extends Component {
|
||||||
|
static template = xml`<div><t t-esc="state.word"/><t t-esc="props.name"/></div>`;
|
||||||
|
|
||||||
|
state = useState({ word: "hello" });
|
||||||
|
|
||||||
|
constructor(parent, props) {
|
||||||
|
super(parent, props);
|
||||||
|
state = this.state;
|
||||||
|
}
|
||||||
|
patched() {
|
||||||
|
steps.push("patched");
|
||||||
|
}
|
||||||
|
mounted() {
|
||||||
|
steps.push("mounted");
|
||||||
|
}
|
||||||
|
willUnmount() {
|
||||||
|
steps.push("willUnmount");
|
||||||
|
}
|
||||||
|
shouldUpdate() {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class Parent extends Component {
|
||||||
|
static template = xml`<div><Child name="state.name"/></div>`;
|
||||||
|
static components = { Child };
|
||||||
|
state = useState({ name: "World" });
|
||||||
|
}
|
||||||
|
|
||||||
|
const parent = await mount(Parent, { target: fixture });
|
||||||
|
expect(fixture.innerHTML).toBe("<div><div>helloWorld</div></div>");
|
||||||
|
|
||||||
|
parent.unmount();
|
||||||
|
expect(fixture.innerHTML).toBe("");
|
||||||
|
await parent.mount(fixture);
|
||||||
|
expect(fixture.innerHTML).toBe("<div><div>helloWorld</div></div>");
|
||||||
|
|
||||||
|
state.word = "test";
|
||||||
|
|
||||||
|
await nextTick();
|
||||||
|
expect(fixture.innerHTML).toBe("<div><div>testWorld</div></div>");
|
||||||
|
expect(steps).toEqual(["mounted", "willUnmount", "mounted", "patched"]);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user