[FIX] app, components: dynamic t-call should propagate the key

Have a Component which has a Component node, and a dynamic t-call itself having
a Component node.

Before this commit, both children had the same `key`, (as in the key in parent.children, which registers on the parent all its children).

As a result, the scheduler was endlessly hanging.

After this commit, it works as expected.
This commit is contained in:
Lucas Perais (lpe)
2022-01-10 15:20:13 +01:00
committed by Géry Debongnie
parent 3945c009ed
commit 5c324fa075
3 changed files with 65 additions and 2 deletions
@@ -41,6 +41,46 @@ exports[`t-call dynamic t-call 3`] = `
}"
`;
exports[`t-call dynamic t-call: key is propagated 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { call } = helpers;
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
const template1 = (ctx['sub']);
let b3 = call(this, template1, ctx, node, key + \`__2\`);
return multi([b2, b3]);
}
}"
`;
exports[`t-call dynamic t-call: key is propagated 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"id\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let attr1 = ctx['id'];
return block1([attr1]);
}
}"
`;
exports[`t-call dynamic t-call: key is propagated 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`t-call handlers are properly bound through a dynamic t-call 1`] = `
"function anonymous(bdom, helpers
) {
+23
View File
@@ -183,4 +183,27 @@ describe("t-call", () => {
fixture.querySelector("p")!.click();
expect(value).toBe(3);
});
test("dynamic t-call: key is propagated", async () => {
let childId = 0;
class Child extends Component {
static template = xml`<div t-att-id="id" />`;
id: any;
setup() {
this.id = childId++;
}
}
const sub = xml`<Child />`;
class Parent extends Component {
static template = xml`<Child /><t t-call="{{ sub }}"/>`;
static components = { Child };
sub = sub;
}
await mount(Parent, fixture);
expect(fixture.innerHTML).toBe(`<div id="0"></div><div id="1"></div>`);
});
});