mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
Géry Debongnie
a51b286671
It is common in Owl components to have anonymous function as props. However, since each rendering create a different (but equivalent) closure, Owl will consider the props different, so will update the child component, but this is (often) not necessary. This commit will help reduce the problem by introducing a new `.alike` prop suffix, that will let Owl know that each version of that specific prop should be considered the same, so, will be ignored by the props comparison code. closes #1360
483 lines
16 KiB
Plaintext
483 lines
16 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`list of components components in a node in a t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"item\\"]);
|
|
|
|
let block1 = createBlock(\`<div><ul><block-child-0/></ul></div>\`);
|
|
let block3 = createBlock(\`<li><block-child-0/></li>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['items']);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`item\`] = v_block2[i1];
|
|
const key1 = 'li_'+ctx['item'];
|
|
const b4 = comp1({item: ctx['item']}, key + \`__1__\${key1}\`, node, this, null);
|
|
c_block2[i1] = withKey(block3([], [b4]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components components in a node in a t-foreach 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-text-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].item;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components crash on duplicate key in dev mode 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, OwlError, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, []);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList([1,2]);;
|
|
const keys1 = new Set();
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`item\`] = v_block1[i1];
|
|
const key1 = 'child';
|
|
if (keys1.has(String(key1))) { throw new OwlError(\`Got duplicate key in t-foreach: \${key1}\`)}
|
|
keys1.add(String(key1));
|
|
const props1 = {};
|
|
helpers.validateProps(\`Child\`, props1, this);
|
|
c_block1[i1] = withKey(comp1(props1, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components crash on duplicate key in dev mode 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return text(\`\`);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components crash when using object as keys that serialize to the same string 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, OwlError, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, []);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList([{},{}]);;
|
|
const keys1 = new Set();
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`item\`] = v_block1[i1];
|
|
const key1 = ctx['item'];
|
|
if (keys1.has(String(key1))) { throw new OwlError(\`Got duplicate key in t-foreach: \${key1}\`)}
|
|
keys1.add(String(key1));
|
|
const props1 = {};
|
|
helpers.validateProps(\`Child\`, props1, this);
|
|
c_block1[i1] = withKey(comp1(props1, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components crash when using object as keys that serialize to the same string 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return text(\`\`);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components list of sub components inside other nodes 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`SubComponent\`, true, false, false, []);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].blips);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`blip\`] = v_block2[i1];
|
|
const key1 = ctx['blip'].id;
|
|
const b4 = comp1({}, key + \`__1__\${key1}\`, node, this, null);
|
|
c_block2[i1] = withKey(block3([], [b4]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components list of sub components inside other nodes 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<span>asdf</span>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components order is correct when slots are not of same type 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { capture, markRaw } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, true, false, []);
|
|
|
|
let block2 = createBlock(\`<div>A</div>\`);
|
|
|
|
function slot1(ctx, node, key = \\"\\") {
|
|
let b2;
|
|
if (!ctx['state'].active) {
|
|
b2 = block2();
|
|
}
|
|
return multi([b2]);
|
|
}
|
|
|
|
function slot2(ctx, node, key = \\"\\") {
|
|
return text(\`B\`);
|
|
}
|
|
|
|
function slot3(ctx, node, key = \\"\\") {
|
|
return text(\`C\`);
|
|
}
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const ctx1 = capture(ctx);
|
|
return comp1({slots: markRaw({'a': {__render: slot1.bind(this), __ctx: ctx1, active: !ctx['state'].active}, 'b': {__render: slot2.bind(this), __ctx: ctx1, active: true}, 'c': {__render: slot3.bind(this), __ctx: ctx1, active: ctx['state'].active}})}, key + \`__1\`, node, this, null);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components order is correct when slots are not of same type 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, callSlot, withKey } = helpers;
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['slotNames']);;
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`slotName\`] = v_block1[i1];
|
|
const key1 = ctx['slotName'];
|
|
const slot1 = (ctx['slotName']);
|
|
c_block1[i1] = withKey(toggler(slot1, callSlot(ctx, node, key1 + \`__1__\${key1}\`, slot1, true, {})), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components reconciliation alg works for t-foreach in t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"blip\\"]);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].s);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`section\`] = v_block2[i1];
|
|
ctx[\`section_index\`] = i1;
|
|
const key1 = ctx['section_index'];
|
|
ctx = Object.create(ctx);
|
|
const [k_block3, v_block3, l_block3, c_block3] = prepareList(ctx['section'].blips);;
|
|
for (let i2 = 0; i2 < l_block3; i2++) {
|
|
ctx[\`blip\`] = v_block3[i2];
|
|
ctx[\`blip_index\`] = i2;
|
|
const key2 = ctx['blip_index'];
|
|
c_block3[i2] = withKey(comp1({blip: ctx['blip']}, key + \`__1__\${key1}__\${key2}\`, node, this, null), key2);
|
|
}
|
|
ctx = ctx.__proto__;
|
|
c_block2[i1] = withKey(list(c_block3), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components reconciliation alg works for t-foreach in t-foreach 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-text-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].blip;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"row\\",\\"col\\"]);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<p><block-child-0/></p>\`);
|
|
let block5 = createBlock(\`<p><block-child-0/></p>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].rows);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`row\`] = v_block2[i1];
|
|
const key1 = ctx['row'];
|
|
ctx = Object.create(ctx);
|
|
const [k_block4, v_block4, l_block4, c_block4] = prepareList(ctx['state'].cols);;
|
|
for (let i2 = 0; i2 < l_block4; i2++) {
|
|
ctx[\`col\`] = v_block4[i2];
|
|
const key2 = ctx['col'];
|
|
const b6 = comp1({row: ctx['row'],col: ctx['col']}, key + \`__1__\${key1}__\${key2}\`, node, this, null);
|
|
c_block4[i2] = withKey(block5([], [b6]), key2);
|
|
}
|
|
ctx = ctx.__proto__;
|
|
const b4 = list(c_block4);
|
|
c_block2[i1] = withKey(block3([], [b4]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-text-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].row+'_'+ctx['props'].col;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components simple list 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"value\\"]);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['state'].elems);;
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`elem\`] = v_block1[i1];
|
|
const key1 = ctx['elem'].id;
|
|
c_block1[i1] = withKey(comp1({value: ctx['elem'].value}, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components simple list 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<span><block-text-0/></span>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components sub components rendered in a loop 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"n\\"]);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].numbers);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`number\`] = v_block2[i1];
|
|
const key1 = ctx['number'];
|
|
c_block2[i1] = withKey(comp1({n: ctx['number']}, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components sub components rendered in a loop 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<p><block-text-0/></p>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].n;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components sub components with some state rendered in a loop 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, []);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].numbers);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`number\`] = v_block2[i1];
|
|
const key1 = ctx['number'];
|
|
c_block2[i1] = withKey(comp1({}, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components sub components with some state rendered in a loop 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<p><block-text-0/></p>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['state'].n;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components switch component position 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"key\\"]);
|
|
|
|
let block1 = createBlock(\`<span><block-child-0/></span>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['clist']);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`c\`] = v_block2[i1];
|
|
const key1 = ctx['c'];
|
|
c_block2[i1] = withKey(comp1({key: ctx['c']}, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components switch component position 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-text-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].key;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components t-foreach with t-component, and update 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, [\\"val\\"]);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(Array(2));;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`n\`] = v_block2[i1];
|
|
ctx[\`n_index\`] = i1;
|
|
const key1 = ctx['n_index'];
|
|
c_block2[i1] = withKey(comp1({val: ctx['n_index']}, key + \`__1__\${key1}\`, node, this, null), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`list of components t-foreach with t-component, and update 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['state'].val;
|
|
let txt2 = ctx['props'].val;
|
|
return block1([txt1, txt2]);
|
|
}
|
|
}"
|
|
`;
|