NextERP/owl
2
0
Fork 0
mirror of https://github.com/odoo/owl.git synced 2025-10-06 19:59:41 +07:00
Code Issues Packages Projects Releases Wiki Activity

[FIX] qweb, t-call: t-call nested in t-slot

Browse Source 
Have a t-call within a t-set-slot of a component.
The called template has a t-component directive.

It should be like:

```xml
<t t-name="Zero">
  <Slotted>
    <t t-call="someTemplate" />
  </Slotted>
</t>

<t t-name="someTemplate">
  <SomeComponent />
</t>
```

Before this commit, the parent of SomeComponent was the Zero component

After this commit, the parent of SomeComponent is the Slotted Component as it should be

closes #862
This commit is contained in:
Lucas Perais (lpe)
2021-06-09 17:00:26 +02:00
committed by Géry Debongnie
parent 9cbcf20b33
commit d67d295eaa
6 changed files with 56 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/qweb/base_directives.ts
+1 -1
View File
@@ -281,7 +281,7 @@ QWeb.addDirective({
// Step 4: add the appropriate function call to current component
// ------------------------------------------------
const parentComponent = `utils.getComponent(context)`;
const parentComponent = ctx.rootContext.shouldDefineParent ? `parent` : `utils.getComponent(context)`;
const key = ctx.generateTemplateKey();
const parentNode = ctx.parentNode ? `c${ctx.parentNode}` : "result";
const extra = `Object.assign({}, extra, {parentNode: ${parentNode}, parent: ${parentComponent}, key: ${key}})`;
src/qweb/qweb.ts
+1
View File
@@ -436,6 +436,7 @@ export class QWeb extends EventBus {
ctx.variables = Object.create(null);
ctx.parentNode = ctx.generateID();
ctx.allowMultipleRoots = true;
ctx.shouldDefineParent = true;
ctx.hasParentWidget = true;
ctx.shouldDefineResult = false;
ctx.addLine(`let c${ctx.parentNode} = extra.parentNode;`);
tests/component/__snapshots__/component.test.ts.snap
+2
View File
@@ -1573,6 +1573,7 @@ exports[`t-call handlers are properly bound through a t-call 1`] = `
) {
// Template name: \\"sub\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let h = this.h;
let c2 = extra.parentNode;
let key0 = extra.key || \\"\\";
@@ -1591,6 +1592,7 @@ exports[`t-call handlers with arguments are properly bound through a t-call 1`]
) {
// Template name: \\"sub\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c2 = extra.parentNode;
tests/component/__snapshots__/slots.test.ts.snap
+13
View File
@@ -68,6 +68,7 @@ exports[`t-slot directive can define and call slots 3`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_header_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
let c5 = [], p5 = {key:5};
@@ -81,6 +82,7 @@ exports[`t-slot directive can define and call slots 4`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_footer_template\\"
let parent = extra.parent;
let h = this.h;
let c6 = extra.parentNode;
let c7 = [], p7 = {key:7};
@@ -158,6 +160,7 @@ exports[`t-slot directive can define and call slots using old t-set keyword 3`]
"function anonymous(context, extra
) {
// Template name: \\"slot_header_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
let c5 = [], p5 = {key:5};
@@ -171,6 +174,7 @@ exports[`t-slot directive can define and call slots using old t-set keyword 4`]
"function anonymous(context, extra
) {
// Template name: \\"slot_footer_template\\"
let parent = extra.parent;
let h = this.h;
let c6 = extra.parentNode;
let c7 = [], p7 = {key:7};
@@ -184,6 +188,7 @@ exports[`t-slot directive content is the default slot 1`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
let c5 = [], p5 = {key:5};
@@ -214,6 +219,7 @@ exports[`t-slot directive default slot work with text nodes 1`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
c4.push({text: \`sts rocks\`});
@@ -243,6 +249,7 @@ exports[`t-slot directive multiple roots are allowed in a default slot 1`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
let c5 = [], p5 = {key:5};
@@ -260,6 +267,7 @@ exports[`t-slot directive multiple roots are allowed in a named slot 1`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_content_template\\"
let parent = extra.parent;
let h = this.h;
let c4 = extra.parentNode;
let c5 = [], p5 = {key:5};
@@ -295,6 +303,7 @@ exports[`t-slot directive refs are properly bound in slots 1`] = `
) {
// Template name: \\"slot_footer_template\\"
let utils = this.constructor.utils;
let parent = extra.parent;
context.__owl__.refs = context.__owl__.refs || {};
let h = this.h;
let c8 = extra.parentNode;
@@ -321,6 +330,7 @@ exports[`t-slot directive slots are rendered with proper context 1`] = `
) {
// Template name: \\"slot_footer_template\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let h = this.h;
let c8 = extra.parentNode;
let c9 = [], p9 = {key:9,on:{}};
@@ -418,6 +428,7 @@ exports[`t-slot directive slots are rendered with proper context, part 2 3`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c10 = extra.parentNode;
@@ -516,6 +527,7 @@ exports[`t-slot directive slots are rendered with proper context, part 3 3`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c10 = extra.parentNode;
@@ -570,6 +582,7 @@ exports[`t-slot directive slots are rendered with proper context, part 4 2`] = `
"function anonymous(context, extra
) {
// Template name: \\"slot_default_template\\"
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c4 = extra.parentNode;
tests/component/slots.test.ts
+31
View File
@@ -1118,4 +1118,35 @@ describe("t-slot directive", () => {
expect(env.qweb.templates[Toggler.template].fn.toString()).toMatchSnapshot();
});
test("t-slot within dynamic t-call", async () => {
let child;
class Child extends Component {
static template = xml`<div class="child"/>`;
constructor(...args) {
super(...args);
child = this;
}
}
class Slotted extends Component {
static template = xml`<div class="slotted"><t t-slot="default" /></div>`;
}
class UsingTcallInSlotted extends Component {
tcallTemplate = xml`<div class="slot"><Child/></div>`;
static template = xml`
<div>
<Slotted>
<t t-call="{{ tcallTemplate }}"/>
</Slotted>
</div>`;
static components = { Slotted , Child };
}
await mount(UsingTcallInSlotted, {target: fixture});
expect(child.__owl__.parent).toBeInstanceOf(Slotted);
expect(fixture.innerHTML).toBe(`<div><div class="slotted"><div class="slot"><div class="child"></div></div></div></div>`);
});
});
tests/qweb/__snapshots__/qweb.test.ts.snap
+8 -4
View File
@@ -1514,6 +1514,7 @@ exports[`t-call (template calling recursive template, part 1 2`] = `
) {
// Template name: \\"recursive\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c3 = extra.parentNode;
@@ -1530,7 +1531,7 @@ exports[`t-call (template calling recursive template, part 1 2`] = `
scope = Object.create(scope);
scope.__access_mode__ = 'ro';
let k7 = \`__7__\${key0}__\`;
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c4, parent: utils.getComponent(context), key: k7}));
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c4, parent: parent, key: k7}));
scope = _origScope6;
}
}"
@@ -1566,6 +1567,7 @@ exports[`t-call (template calling recursive template, part 2 2`] = `
) {
// Template name: \\"nodeTemplate\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c2 = extra.parentNode;
@@ -1607,7 +1609,7 @@ exports[`t-call (template calling recursive template, part 2 2`] = `
scope[utils.zero] = c__0;
}
let k11 = \`__11__\${key0}__\${key1}__\`;
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: utils.getComponent(context), key: k11}));
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: parent, key: k11}));
}
scope = _origScope10;
}
@@ -1645,6 +1647,7 @@ exports[`t-call (template calling recursive template, part 3 2`] = `
) {
// Template name: \\"nodeTemplate\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c2 = extra.parentNode;
@@ -1686,7 +1689,7 @@ exports[`t-call (template calling recursive template, part 3 2`] = `
scope[utils.zero] = c__0;
}
let k11 = \`__11__\${key0}__\${key1}__\`;
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: utils.getComponent(context), key: k11}));
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: parent, key: k11}));
}
scope = _origScope10;
}
@@ -1725,6 +1728,7 @@ exports[`t-call (template calling recursive template, part 4: with t-set recursi
) {
// Template name: \\"nodeTemplate\\"
let utils = this.constructor.utils;
let parent = extra.parent;
let scope = Object.create(context);
let h = this.h;
let c2 = extra.parentNode;
@@ -1771,7 +1775,7 @@ exports[`t-call (template calling recursive template, part 4: with t-set recursi
scope[utils.zero] = c__0;
}
let k11 = \`__11__\${key0}__\${key1}__\`;
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: utils.getComponent(context), key: k11}));
this.constructor.subTemplates['1'].call(this, scope, Object.assign({}, extra, {parentNode: c3, parent: parent, key: k11}));
}
scope = _origScope10;
}