mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
Samuel Degueldre
df59ec49ae
t-call-context is a feature that's supposed to mask the rendering context completely, but currently the component remains available through `this`. This commit stops treating `this` as a reserved word, so that it's compiled to a lookup in the rendering context, and adds `this` to the rendering context when binding the component's rendering function. With these changes, `this` behaves the same as before when outside a t-call-context, but when the rendering context is overriden, the template can no longer access `this`. `this` still represents the instance of the component inside of the rendering function since it's needed by owl internally. A side-effect of this change is that now the rendering context is no longer the instance of the component by default, but is always an object with the component in its prototype chain. This was already the case before in some contexts (eg inside t-foreach, or inside components with a t-set/t-call anywhere in its template). This can cause issues in rare cases when a component method was called directly on the rendering context, as before this change, the method's bound this would be the component instance (except in a t-foreach, component with a t-set/t-call, etc), while after this change it is now never the component instance. When the method only reads on `this` there is no issue as all the components properties are available on the rendering contexts, but setting a value on `this` will write on the rendering context and not the component which is likely a mistake. While this is a breaking change, simply adding a t-set/t-call to any template would break components that would be broken by this change, with this in mind we decided to make this change anyway so that developers get the error as early as possible in the development cycle rather than having a seemingly inocuous change break code under them.
506 lines
16 KiB
Plaintext
506 lines
16 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`t-on t-on expression captured in t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<div><button block-handler-0=\\"click\\">expr</button></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
ctx[isBoundary] = 1
|
|
setContextValue(ctx, \\"iter\\", 0);
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['arr']);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`val\`] = v_block2[i1];
|
|
const key1 = ctx['val'];
|
|
const v1 = ctx['otherState'];
|
|
const v2 = ctx['iter'];
|
|
let hdlr1 = [()=>v1.vals.push(v2+'_'+v2), ctx];
|
|
setContextValue(ctx, \\"iter\\", ctx['iter']+1);
|
|
c_block2[i1] = withKey(block3([hdlr1]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on expression in t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">Expr</button></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].values);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`val\`] = v_block2[i1];
|
|
ctx[\`val_index\`] = i1;
|
|
const key1 = ctx['val'];
|
|
let txt1 = ctx['val_index'];
|
|
let txt2 = ctx['val']+'';
|
|
const v1 = ctx['otherState'];
|
|
const v2 = ctx['val'];
|
|
let hdlr1 = [()=>v1.vals.push(v2), ctx];
|
|
c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on expression in t-foreach with t-set 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { isBoundary, withDefault, setContextValue, prepareList, withKey } = helpers;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">Expr</button></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
ctx[isBoundary] = 1
|
|
setContextValue(ctx, \\"bossa\\", 'nova');
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].values);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`val\`] = v_block2[i1];
|
|
ctx[\`val_index\`] = i1;
|
|
const key1 = ctx['val'];
|
|
setContextValue(ctx, \\"bossa\\", ctx['bossa']+'_'+ctx['val_index']);
|
|
let txt1 = ctx['val_index'];
|
|
let txt2 = ctx['val']+'';
|
|
const v1 = ctx['otherState'];
|
|
const v2 = ctx['val'];
|
|
const v3 = ctx['bossa'];
|
|
let hdlr1 = [()=>v1.vals.push(v2+'_'+v3), ctx];
|
|
c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on method call in t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block3 = createBlock(\`<div><block-text-0/>: <block-text-1/><button block-handler-2=\\"click\\">meth call</button></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].values);;
|
|
for (let i1 = 0; i1 < l_block2; i1++) {
|
|
ctx[\`val\`] = v_block2[i1];
|
|
ctx[\`val_index\`] = i1;
|
|
const key1 = ctx['val'];
|
|
let txt1 = ctx['val_index'];
|
|
let txt2 = ctx['val']+'';
|
|
const v1 = ctx['this'];
|
|
const v2 = ctx['val'];
|
|
let hdlr1 = [()=>v1.addVal(v2), ctx];
|
|
c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
|
|
}
|
|
const b2 = list(c_block2);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on component next to t-on on div 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/><p block-handler-0=\\"click\\">dec</p></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const hdlr1 = [ctx['increment'], ctx];
|
|
const b2 = catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
|
|
let hdlr2 = [ctx['decrement'], ctx];
|
|
return block1([hdlr2], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on component next to t-on on div 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<button><block-text-0/></button>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const hdlr1 = [ctx['increment'], ctx];
|
|
return catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<button><block-text-0/></button>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components and t-foreach 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, createCatcher, withKey } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList(['John','Raoul','Gérald']);;
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`name\`] = v_block1[i1];
|
|
const key1 = ctx['name'];
|
|
const v1 = ctx['this'];
|
|
const v2 = ctx['name'];
|
|
const hdlr1 = [()=>v1.log(v2), ctx];
|
|
c_block1[i1] = withKey(catcher1(comp1({value: ctx['name']}, key + \`__1__\${key1}\`, node, this, null), [hdlr1]), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components and 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'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, variation 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
let block1 = createBlock(\`<div><span/><block-child-0/><p/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const hdlr1 = [ctx['increment'], ctx];
|
|
const b2 = catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, variation 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<button><block-text-0/></button>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, with 'prevent' modifier 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click.prevent\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const hdlr1 = [\\"prevent\\", ctx['increment'], ctx];
|
|
return catcher1(comp1({value: ctx['state'].value}, key + \`__1\`, node, this, null), [hdlr1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, with 'prevent' modifier 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<button><block-text-0/></button>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let txt1 = ctx['props'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, with a handler update 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { isBoundary, withDefault, setContextValue, createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
ctx[isBoundary] = 1
|
|
setContextValue(ctx, \\"name\\", ctx['state'].name);
|
|
const v1 = ctx['this'];
|
|
const v2 = ctx['name'];
|
|
const hdlr1 = [()=>v1.log(v2), ctx];
|
|
return catcher1(comp1({value: ctx['name']}, key + \`__1\`, node, this, null), [hdlr1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on components, with a handler update 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'].value;
|
|
return block1([txt1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on destroyed components 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let b2;
|
|
if (ctx['state'].flag) {
|
|
b2 = comp1({}, key + \`__1\`, node, this, null);
|
|
}
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on destroyed components 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div block-handler-0=\\"click\\"/>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let hdlr1 = [ctx['onClick'], ctx];
|
|
return block1([hdlr1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on slot, with 'prevent' modifier 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { markRaw } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, true, false, true);
|
|
|
|
let block1 = createBlock(\`<button>button</button>\`);
|
|
|
|
function slot1(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return comp1({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx}})}, key + \`__1\`, node, this, null);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on slot, with 'prevent' modifier 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { callSlot, createCatcher } = helpers;
|
|
const catcher1 = createCatcher({\\"click.prevent\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const hdlr1 = [\\"prevent\\", ctx['doSomething'], ctx];
|
|
return catcher1(callSlot(ctx, node, key, 'default', false, {}), [hdlr1]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on t-set-slots 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { capture, createCatcher, markRaw } = helpers;
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
const comp1 = app.createComponent(\`Child\`, true, true, false, true);
|
|
|
|
let block6 = createBlock(\`<p>something</p>\`);
|
|
let block7 = createBlock(\`<p>paragraph</p>\`);
|
|
|
|
function slot1(ctx, node, key = \\"\\") {
|
|
const b6 = block6();
|
|
const b7 = block7();
|
|
const v1 = ctx['this'];
|
|
const hdlr1 = [()=>v1.state.count++, ctx];
|
|
return catcher1(multi([b6, b7]), [hdlr1]);
|
|
}
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const b2 = text(\` [\`);
|
|
const b3 = text(ctx['state'].count);
|
|
const b4 = text(\`] \`);
|
|
const ctx1 = capture(ctx);
|
|
const b8 = comp1({slots: markRaw({'myslot': {__render: slot1.bind(this), __ctx: ctx1}})}, key + \`__1\`, node, this, null);
|
|
return multi([b2, b3, b4, b8]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on t-set-slots 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { callSlot } = helpers;
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return callSlot(ctx, node, key, 'myslot', false, {});
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on t-slots 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { markRaw } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, true, false, true);
|
|
|
|
let block1 = createBlock(\`<p>something</p>\`);
|
|
|
|
function slot1(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return comp1({slots: markRaw({'default': {__render: slot1.bind(this), __ctx: ctx}})}, key + \`__1\`, node, this, null);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on on t-slots 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { callSlot, createCatcher } = helpers;
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const b2 = text(\` [\`);
|
|
const b3 = text(ctx['state'].count);
|
|
const b4 = text(\`] \`);
|
|
const v1 = ctx['this'];
|
|
const hdlr1 = [()=>v1.state.count++, ctx];
|
|
const b5 = catcher1(callSlot(ctx, node, key, 'default', false, {}), [hdlr1]);
|
|
return multi([b2, b3, b4, b5]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on when first component child is an empty component 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { createCatcher } = helpers;
|
|
const comp1 = app.createComponent(\`Child\`, true, false, false, false);
|
|
const catcher1 = createCatcher({\\"click\\":0});
|
|
|
|
let block1 = createBlock(\`<div block-handler-0=\\"click\\"><block-child-0/></div>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let hdlr1 = [ctx['push'], ctx];
|
|
const hdlr2 = [()=>{}, ctx];
|
|
const b2 = catcher1(comp1({list: ctx['list']}, key + \`__1\`, node, this, null), [hdlr2]);
|
|
return block1([hdlr1], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`t-on t-on when first component child is an empty component 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
let { prepareList, withKey } = helpers;
|
|
|
|
let block2 = createBlock(\`<span><block-text-0/></span>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
ctx = Object.create(ctx);
|
|
const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['props'].list);;
|
|
for (let i1 = 0; i1 < l_block1; i1++) {
|
|
ctx[\`c\`] = v_block1[i1];
|
|
ctx[\`c_index\`] = i1;
|
|
const key1 = ctx['c_index'];
|
|
let txt1 = ctx['c'];
|
|
c_block1[i1] = withKey(block2([txt1]), key1);
|
|
}
|
|
return list(c_block1);
|
|
}
|
|
}"
|
|
`;
|