mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[FIX] prevent crash in case with t-foreach and t-out with components
The t-out directive is compiled internally into a LazyValue, which represents a value that may or may not be created sometimes in the future. It can also be reused more than once, and this is where there may be an issue: if a component is contained in the lazyvalue, it needs a unique key (coming from the t-foreach) to be properly indexed in the parent children map. However, the LazyValue does not keep the key information, so it is not able to provide it to its content. The fix is then quite clear: the LazyValue class should store the key information, and provides it to its content. This allows the LazyValue to be used multiple times, in any place in a template. closes #1270
This commit is contained in:
committed by
Sam Degueldre
parent
669fd622ec
commit
7ab34c5ca5
@@ -163,7 +163,7 @@ exports[`basics t-set with a body expression can be passed in props, and then t-
|
||||
return function template(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`abc\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`abc\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
const b3 = comp1({val: ctx['abc']}, key + \`__1\`, node, this, null);
|
||||
return block1([], [b3]);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`components in t-out simple list 1`] = `
|
||||
"function anonymous(app, bdom, helpers
|
||||
) {
|
||||
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
||||
let { prepareList, isBoundary, withDefault, LazyValue, safeOutput, withKey } = helpers;
|
||||
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
|
||||
|
||||
function value1(ctx, node, key = \\"\\") {
|
||||
return comp1({}, key + \`__1\`, node, this, null);
|
||||
}
|
||||
|
||||
return function template(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx = Object.create(ctx);
|
||||
const [k_block1, v_block1, l_block1, c_block1] = prepareList([1,2]);;
|
||||
for (let i1 = 0; i1 < l_block1; i1++) {
|
||||
ctx[\`n\`] = v_block1[i1];
|
||||
const key1 = ctx['n'];
|
||||
ctx[\`blabla\`] = new LazyValue(value1, ctx, this, node, key1);
|
||||
c_block1[i1] = withKey(safeOutput(ctx['blabla']), key1);
|
||||
}
|
||||
return list(c_block1);
|
||||
}
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`components in t-out simple list 2`] = `
|
||||
"function anonymous(app, bdom, helpers
|
||||
) {
|
||||
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
||||
|
||||
return function template(ctx, node, key = \\"\\") {
|
||||
return text(\`child\`);
|
||||
}
|
||||
}"
|
||||
`;
|
||||
@@ -59,7 +59,7 @@ exports[`t-set slots with a t-set with a component in body 1`] = `
|
||||
function slot1(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
const b3 = text(\` in slot \`);
|
||||
const b4 = safeOutput(ctx['v']);
|
||||
return multi([b3, b4]);
|
||||
@@ -114,7 +114,7 @@ exports[`t-set slots with an t-set with a component in body 1`] = `
|
||||
function slot1(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
const b5 = text(\` tea \`);
|
||||
const b6 = safeOutput(ctx['v']);
|
||||
return multi([b5, b6]);
|
||||
@@ -169,7 +169,7 @@ exports[`t-set slots with an unused t-set with a component in body 1`] = `
|
||||
function slot1(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
return text(\` in slot \`);
|
||||
}
|
||||
|
||||
@@ -343,7 +343,7 @@ exports[`t-set t-set with a component in body 1`] = `
|
||||
return function template(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
const b3 = safeOutput(ctx['v']);
|
||||
return block1([], [b3]);
|
||||
}
|
||||
@@ -377,7 +377,7 @@ exports[`t-set t-set with something in body 1`] = `
|
||||
return function template(ctx, node, key = \\"\\") {
|
||||
ctx = Object.create(ctx);
|
||||
ctx[isBoundary] = 1
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node);
|
||||
ctx[\`v\`] = new LazyValue(value1, ctx, this, node, key);
|
||||
const b3 = safeOutput(ctx['v']);
|
||||
return block1([], [b3]);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
import { Component, mount, xml } from "../../src/index";
|
||||
import { makeTestFixture, snapshotEverything } from "../helpers";
|
||||
|
||||
snapshotEverything();
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
// t-out
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
describe("components in t-out", () => {
|
||||
let fixture: HTMLElement;
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = makeTestFixture();
|
||||
});
|
||||
|
||||
test("simple list", async () => {
|
||||
class Child extends Component {
|
||||
static template = xml`child`;
|
||||
}
|
||||
|
||||
class Parent extends Component {
|
||||
static template = xml`
|
||||
<t t-foreach="[1,2]" t-as="n" t-key="n">
|
||||
<t t-set="blabla">
|
||||
<Child />
|
||||
</t>
|
||||
<t t-out="blabla"/>
|
||||
</t>`;
|
||||
static components = { Child };
|
||||
}
|
||||
|
||||
await mount(Parent, fixture);
|
||||
expect(fixture.innerHTML).toBe("childchild");
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user