diff --git a/src/qweb/qweb.ts b/src/qweb/qweb.ts index 3a9565ff..aa6478d9 100644 --- a/src/qweb/qweb.ts +++ b/src/qweb/qweb.ts @@ -90,6 +90,26 @@ function isComponent(obj) { return obj && obj.hasOwnProperty("__owl__"); } +class VDomArray extends Array { + toString() { + return vDomToString(this); + } +} + +function vDomToString(vdom: VNode[]): string { + return vdom + .map((vnode) => { + if (vnode.sel) { + const node = document.createElement(vnode.sel); + const result = patch(node, vnode); + return (result.elm).outerHTML; + } else { + return vnode.text; + } + }) + .join(""); +} + const UTILS: Utils = { zero: Symbol("zero"), toObj(expr) { @@ -111,20 +131,8 @@ const UTILS: Utils = { addNameSpace(vnode) { addNS(vnode.data, vnode.children, vnode.sel); }, - VDomArray: class VDomArray extends Array {}, - vDomToString: function (vdom: VNode[]): string { - return vdom - .map((vnode) => { - if (vnode.sel) { - const node = document.createElement(vnode.sel); - const result = patch(node, vnode); - return (result.elm).outerHTML; - } else { - return vnode.text; - } - }) - .join(""); - }, + VDomArray, + vDomToString, getComponent(obj) { while (obj && !isComponent(obj)) { obj = obj.__proto__; diff --git a/tests/component/__snapshots__/component.test.ts.snap b/tests/component/__snapshots__/component.test.ts.snap index 28108bf8..c5d2f542 100644 --- a/tests/component/__snapshots__/component.test.ts.snap +++ b/tests/component/__snapshots__/component.test.ts.snap @@ -1405,6 +1405,47 @@ exports[`other directives with t-component t-set outside modified in t-foreach 1 }" `; +exports[`props evaluation t-set with a body expression can be used as textual prop 1`] = ` +"function anonymous(context, extra +) { + // Template name: \\"__template__2\\" + let utils = this.constructor.utils; + let QWeb = this.constructor; + let parent = context; + let scope = Object.create(context); + let h = this.h; + let c1 = [], p1 = {key:1}; + let vn1 = h('div', p1, c1); + let c2 = new utils.VDomArray(); + c2.push({text: \`42\`}); + scope.abc = c2 + // Component 'Child' + let w3 = '__4__' in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap['__4__']] : false; + let props3 = {val:scope.abc}; + if (w3 && w3.__owl__.currentFiber && !w3.__owl__.vnode) { + w3.destroy(); + w3 = false; + } + if (w3) { + w3.__updateProps(props3, extra.fiber, undefined); + let pvnode = w3.__owl__.pvnode; + c1.push(pvnode); + } else { + let componentKey3 = \`Child\`; + let W3 = context.constructor.components[componentKey3] || QWeb.components[componentKey3]|| scope['Child']; + if (!W3) {throw new Error('Cannot find the definition of component \\"' + componentKey3 + '\\"')} + w3 = new W3(parent, props3); + parent.__owl__.cmap['__4__'] = w3.__owl__.id; + let fiber = w3.__prepare(extra.fiber, undefined, () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; }); + let pvnode = h('dummy', {key: '__4__', hook: {remove() {},destroy(vn) {w3.destroy();}}}); + c1.push(pvnode); + w3.__owl__.pvnode = pvnode; + } + w3.__owl__.parentLastFiberId = extra.fiber.id; + return vn1; +}" +`; + exports[`random stuff/miscellaneous can inject values in tagged templates 1`] = ` "function anonymous(context, extra ) { diff --git a/tests/component/component.test.ts b/tests/component/component.test.ts index 27e1ed0f..e018d6f7 100644 --- a/tests/component/component.test.ts +++ b/tests/component/component.test.ts @@ -1725,6 +1725,48 @@ describe("props evaluation ", () => { await widget.mount(fixture); expect(normalize(fixture.innerHTML)).toBe("
42
"); }); + + test("t-set with a body expression can be used as textual prop", async () => { + class Child extends Component { + static template = xml``; + } + class Parent extends Component { + static components = { Child }; + static template = xml` +
+ 42 + +
`; + } + + const widget = new Parent(); + await widget.mount(fixture); + expect(fixture.innerHTML).toBe("
42
"); + expect(env.qweb.templates[Parent.template].fn.toString()).toMatchSnapshot(); + }); + + test("t-set with a body expression can be passed in props, and then t-raw", async () => { + class Child extends Component { + static template = xml` + + + + `; + } + class Parent extends Component { + static components = { Child }; + static template = xml` +
+

43

+ +
`; + } + + const widget = new Parent(); + await widget.mount(fixture); + expect(fixture.innerHTML).toBe("
<p>4343</p>

43

"); + }); + }); describe("other directives with t-component", () => {