[IMP] slots: add support for t-props on slots props

This commit is contained in:
Géry Debongnie
2022-06-06 08:17:51 +02:00
committed by Sam Degueldre
parent 5d5a530505
commit 1fc88f626f
18 changed files with 202 additions and 139 deletions
+6
View File
@@ -239,6 +239,12 @@ And the child component that includes the slot can provide values like this:
<t t-slot="foo" bool="other_var" num="5"> <t t-slot="foo" bool="other_var" num="5">
``` ```
or this:
```xml
<t t-slot="foo" t-props="someObject">
```
In the case of the default slot, you may declare the slot scope directly on the In the case of the default slot, you may declare the slot scope directly on the
component itself: component itself:
+20 -21
View File
@@ -1083,23 +1083,25 @@ export class CodeGenerator {
return `${name}: ${value || undefined}`; return `${name}: ${value || undefined}`;
} }
formatPropObject(obj: { [prop: string]: any }): string { formatPropObject(obj: { [prop: string]: any }): string[] {
const params = []; return Object.entries(obj).map(([k, v]) => this.formatProp(k, v));
for (const [n, v] of Object.entries(obj)) { }
params.push(this.formatProp(n, v));
getPropString(props: string[], dynProps: string | null): string {
let propString = `{${props.join(",")}}`;
if (dynProps) {
propString = `Object.assign({}, ${compileExpr(dynProps)}${
props.length ? ", " + propString : ""
})`;
} }
return params.join(", "); return propString;
} }
compileComponent(ast: ASTComponent, ctx: Context) { compileComponent(ast: ASTComponent, ctx: Context) {
let { block } = ctx; let { block } = ctx;
// props // props
const hasSlotsProp = "slots" in (ast.props || {}); const hasSlotsProp = "slots" in (ast.props || {});
const props: string[] = []; const props: string[] = ast.props ? this.formatPropObject(ast.props) : [];
const propExpr = this.formatPropObject(ast.props || {});
if (propExpr) {
props.push(propExpr);
}
// slots // slots
let slotDef: string = ""; let slotDef: string = "";
@@ -1123,7 +1125,7 @@ export class CodeGenerator {
params.push(`__scope: "${scope}"`); params.push(`__scope: "${scope}"`);
} }
if (ast.slots[slotName].attrs) { if (ast.slots[slotName].attrs) {
params.push(this.formatPropObject(ast.slots[slotName].attrs!)); params.push(...this.formatPropObject(ast.slots[slotName].attrs!));
} }
const slotInfo = `{${params.join(", ")}}`; const slotInfo = `{${params.join(", ")}}`;
slotStr.push(`'${slotName}': ${slotInfo}`); slotStr.push(`'${slotName}': ${slotInfo}`);
@@ -1136,14 +1138,7 @@ export class CodeGenerator {
props.push(`slots: markRaw(${slotDef})`); props.push(`slots: markRaw(${slotDef})`);
} }
const propStr = `{${props.join(",")}}`; let propString = this.getPropString(props, ast.dynamicProps);
let propString = propStr;
if (ast.dynamicProps) {
propString = `Object.assign({}, ${compileExpr(ast.dynamicProps)}${
props.length ? ", " + propStr : ""
})`;
}
let propVar: string; let propVar: string;
if ((slotDef && (ast.dynamicProps || hasSlotsProp)) || this.dev) { if ((slotDef && (ast.dynamicProps || hasSlotsProp)) || this.dev) {
@@ -1223,8 +1218,12 @@ export class CodeGenerator {
} else { } else {
slotName = "'" + ast.name + "'"; slotName = "'" + ast.name + "'";
} }
const dynProps = ast.attrs ? ast.attrs["t-props"] : null;
const scope = ast.attrs ? `{${this.formatPropObject(ast.attrs)}}` : null; if (ast.attrs) {
delete ast.attrs["t-props"];
}
const props = ast.attrs ? this.formatPropObject(ast.attrs) : [];
const scope = this.getPropString(props, dynProps);
if (ast.defaultContent) { if (ast.defaultContent) {
const name = this.compileInNewTarget("defaultContent", ast.defaultContent, ctx); const name = this.compileInNewTarget("defaultContent", ast.defaultContent, ctx);
blockString = `callSlot(ctx, node, key, ${slotName}, ${dynamic}, ${scope}, ${name})`; blockString = `callSlot(ctx, node, key, ${slotName}, ${dynamic}, ${scope}, ${name})`;
@@ -34,7 +34,7 @@ exports[`misc complex template 1`] = `
for (let i1 = 0; i1 < l_block4; i1++) { for (let i1 = 0; i1 < l_block4; i1++) {
ctx[\`slot\`] = v_block4[i1]; ctx[\`slot\`] = v_block4[i1];
const key1 = ctx['slot'].id; const key1 = ctx['slot'].id;
c_block4[i1] = withKey(component(\`SlotButton\`, {class: ctx['slot_container'], slot: ctx['slot']}, key + \`__1__\${key1}\`, node, ctx), key1); c_block4[i1] = withKey(component(\`SlotButton\`, {class: ctx['slot_container'],slot: ctx['slot']}, key + \`__1__\${key1}\`, node, ctx), key1);
} }
ctx = ctx.__proto__; ctx = ctx.__proto__;
b4 = list(c_block4); b4 = list(c_block4);
@@ -316,8 +316,8 @@ exports[`misc other complex template 1`] = `
if (!ctx['project']) { if (!ctx['project']) {
b24 = block24(); b24 = block24();
} else { } else {
const b26 = component(\`BundlesList\`, {bundles: ctx['bundles'].sticky, category_custom_views: ctx['category_custom_views'], search: ctx['search']}, key + \`__2\`, node, ctx); const b26 = component(\`BundlesList\`, {bundles: ctx['bundles'].sticky,category_custom_views: ctx['category_custom_views'],search: ctx['search']}, key + \`__2\`, node, ctx);
const b27 = component(\`BundlesList\`, {bundles: ctx['bundles'].dev, search: ctx['search']}, key + \`__3\`, node, ctx); const b27 = component(\`BundlesList\`, {bundles: ctx['bundles'].dev,search: ctx['search']}, key + \`__3\`, node, ctx);
b25 = block25([], [b26, b27]); b25 = block25([], [b26, b27]);
} }
return block1([attr1, txt1, hdlr2, hdlr3, attr8, hdlr4, hdlr5, ref1, hdlr6, ref2], [b2, b4, b14, b17, b22, b23, b24, b25]); return block1([attr1, txt1, hdlr2, hdlr3, attr8, hdlr4, hdlr5, ref1, hdlr6, ref2], [b2, b4, b14, b17, b22, b23, b24, b25]);
@@ -1019,7 +1019,7 @@ exports[`basics update props of component without concrete own node 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['props'].subKey; const tKey_1 = ctx['props'].subKey;
return toggler(tKey_1, component(\`Custom\`, {key: ctx['props'].key, subKey: ctx['props'].subKey}, tKey_1 + key + \`__1\`, node, ctx)); return toggler(tKey_1, component(\`Custom\`, {key: ctx['props'].key,subKey: ctx['props'].subKey}, tKey_1 + key + \`__1\`, node, ctx));
} }
}" }"
`; `;
@@ -227,7 +227,7 @@ exports[`concurrent renderings scenario 1 2`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA, fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA,fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -271,7 +271,7 @@ exports[`concurrent renderings scenario 2 2`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA, fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA,fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -314,7 +314,7 @@ exports[`concurrent renderings scenario 2bis 2`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA, fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentC\`, {fromA: ctx['props'].fromA,fromB: ctx['state'].fromB}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -371,7 +371,7 @@ exports[`concurrent renderings scenario 3 3`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA, fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA,fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -428,7 +428,7 @@ exports[`concurrent renderings scenario 4 3`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA, fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA,fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -601,7 +601,7 @@ exports[`concurrent renderings scenario 9 3`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA, fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx); const b2 = component(\`ComponentD\`, {fromA: ctx['props'].fromA,fromC: ctx['state'].fromC}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -778,7 +778,7 @@ exports[`concurrent renderings scenario 14 2`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`C\`, {fromB: ctx['state'].fromB, fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx); const b2 = component(\`C\`, {fromB: ctx['state'].fromB,fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -822,7 +822,7 @@ exports[`concurrent renderings scenario 15 2`] = `
let block1 = createBlock(\`<p><block-child-0/></p>\`); let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`C\`, {fromB: ctx['state'].fromB, fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx); const b2 = component(\`C\`, {fromB: ctx['state'].fromB,fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -861,7 +861,7 @@ exports[`concurrent renderings scenario 16 2`] = `
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom; let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return component(\`C\`, {fromB: ctx['state'].fromB, fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx); return component(\`C\`, {fromB: ctx['state'].fromB,fromA: ctx['props'].fromA}, key + \`__1\`, node, ctx);
} }
}" }"
`; `;
@@ -197,7 +197,7 @@ exports[`can catch errors can catch an error in a component render function 2`]
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -250,7 +250,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -291,7 +291,7 @@ exports[`can catch errors can catch an error in the constructor call of a compon
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -369,7 +369,7 @@ exports[`can catch errors can catch an error in the initial call of a component
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -425,7 +425,7 @@ exports[`can catch errors can catch an error in the initial call of a component
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -567,7 +567,7 @@ exports[`can catch errors can catch an error in the mounted call 2`] = `
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -620,7 +620,7 @@ exports[`can catch errors can catch an error in the willPatch call 2`] = `
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -673,7 +673,7 @@ exports[`can catch errors can catch an error in the willStart call 2`] = `
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -727,7 +727,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -840,7 +840,7 @@ exports[`can catch errors catching error, rethrow, render parent -- a main comp
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -915,7 +915,7 @@ exports[`can catch errors catching in child makes parent render 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -991,7 +991,7 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
if (ctx['state'].error) { if (ctx['state'].error) {
b2 = text(\`Error handled\`); b2 = text(\`Error handled\`);
} else { } else {
b3 = callSlot(ctx, node, key, 'default', false, null); b3 = callSlot(ctx, node, key, 'default', false, {});
} }
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
@@ -273,7 +273,7 @@ exports[`bound functions is referentially equal after update 1`] = `
let { bind } = helpers; let { bind } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {val: ctx['state'].val, fn: bind(ctx, ctx['someFunction'])}, key + \`__1\`, node, ctx); return component(\`Child\`, {val: ctx['state'].val,fn: bind(ctx, ctx['someFunction'])}, key + \`__1\`, node, ctx);
} }
}" }"
`; `;
@@ -115,7 +115,7 @@ exports[`props validation can specify that additional props are allowed (array)
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom; let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const props1 = {message: 'm', otherProp: 'o'}; const props1 = {message: 'm',otherProp: 'o'};
helpers.validateProps(\`Child\`, props1, ctx); helpers.validateProps(\`Child\`, props1, ctx);
return component(\`Child\`, props1, key + \`__1\`, node, ctx); return component(\`Child\`, props1, key + \`__1\`, node, ctx);
} }
@@ -141,7 +141,7 @@ exports[`props validation can specify that additional props are allowed (object)
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom; let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const props1 = {message: 'm', otherProp: 'o'}; const props1 = {message: 'm',otherProp: 'o'};
helpers.validateProps(\`Child\`, props1, ctx); helpers.validateProps(\`Child\`, props1, ctx);
return component(\`Child\`, props1, key + \`__1\`, node, ctx); return component(\`Child\`, props1, key + \`__1\`, node, ctx);
} }
@@ -32,7 +32,7 @@ exports[`reactivity in lifecycle Component is automatically subscribed to reacti
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom; let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {obj: ctx['obj'], reactiveObj: ctx['reactiveObj']}, key + \`__1\`, node, ctx); return component(\`Child\`, {obj: ctx['obj'],reactiveObj: ctx['reactiveObj']}, key + \`__1\`, node, ctx);
} }
}" }"
`; `;
@@ -92,7 +92,7 @@ exports[`refs refs are properly bound in slots 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'footer', false, null); const b2 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
+114 -78
View File
@@ -27,7 +27,7 @@ exports[`slots can define a default content 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'default', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
return block1([], [b3]); return block1([], [b3]);
} }
}" }"
@@ -68,8 +68,8 @@ exports[`slots can define and call slots 2`] = `
let block1 = createBlock(\`<div><div><block-child-0/></div><div><block-child-1/></div></div>\`); let block1 = createBlock(\`<div><div><block-child-0/></div><div><block-child-1/></div></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'header', false, null); const b2 = callSlot(ctx, node, key, 'header', false, {});
const b3 = callSlot(ctx, node, key, 'footer', false, null); const b3 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -99,7 +99,7 @@ exports[`slots can define and call slots with bound params 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'abc', false, null); const b2 = callSlot(ctx, node, key, 'abc', false, {});
const b3 = text(ctx['props'].slots['abc'].getValue()); const b3 = text(ctx['props'].slots['abc'].getValue());
return multi([b2, b3]); return multi([b2, b3]);
} }
@@ -142,9 +142,9 @@ exports[`slots can define and call slots with params 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let txt1 = ctx['props'].slots['header'].param; let txt1 = ctx['props'].slots['header'].param;
const b2 = callSlot(ctx, node, key, 'header', false, null); const b2 = callSlot(ctx, node, key, 'header', false, {});
let txt2 = ctx['props'].slots['footer'].param; let txt2 = ctx['props'].slots['footer'].param;
const b3 = callSlot(ctx, node, key, 'footer', false, null); const b3 = callSlot(ctx, node, key, 'footer', false, {});
return block1([txt1, txt2], [b2, b3]); return block1([txt1, txt2], [b2, b3]);
} }
}" }"
@@ -179,7 +179,7 @@ exports[`slots can render node with t-ref and Component in same slot 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -191,7 +191,7 @@ exports[`slots can render only empty slot 1`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -218,7 +218,7 @@ exports[`slots can use component in default-content of t-slot 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null, defaultContent1); return callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
} }
}" }"
`; `;
@@ -257,7 +257,7 @@ exports[`slots can use t-call in default-content of t-slot 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null, defaultContent1); return callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
} }
}" }"
`; `;
@@ -298,7 +298,7 @@ exports[`slots content is the default slot (variation) 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -332,7 +332,7 @@ exports[`slots content is the default slot 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -371,7 +371,7 @@ exports[`slots default content is not rendered if named slot is provided 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'header', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'header', false, {}, defaultContent1);
return block1([], [b3]); return block1([], [b3]);
} }
}" }"
@@ -409,7 +409,7 @@ exports[`slots default content is not rendered if slot is provided 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'default', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
return block1([], [b3]); return block1([], [b3]);
} }
}" }"
@@ -452,8 +452,8 @@ exports[`slots default slot next to named slot, with default content 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'default', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
const b5 = callSlot(ctx, node, key, 'footer', false, null, defaultContent2); const b5 = callSlot(ctx, node, key, 'footer', false, {}, defaultContent2);
return block1([], [b3, b5]); return block1([], [b3, b5]);
} }
}" }"
@@ -547,7 +547,7 @@ exports[`slots default slot work with text nodes (variation) 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -580,7 +580,7 @@ exports[`slots default slot work with text nodes 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -626,7 +626,7 @@ exports[`slots dynamic t-slot call 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let hdlr1 = [ctx['toggle'], ctx]; let hdlr1 = [ctx['toggle'], ctx];
const slot1 = (ctx['current'].slot); const slot1 = (ctx['current'].slot);
const b2 = toggler(slot1, callSlot(ctx, node, key, slot1, true, null)); const b2 = toggler(slot1, callSlot(ctx, node, key, slot1, true, {}));
return block1([hdlr1], [b2]); return block1([hdlr1], [b2]);
} }
}" }"
@@ -675,7 +675,7 @@ exports[`slots dynamic t-slot call with default 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let hdlr1 = [ctx['toggle'], ctx]; let hdlr1 = [ctx['toggle'], ctx];
const b3 = callSlot(ctx, node, key, (ctx['current'].slot), true, null, defaultContent1); const b3 = callSlot(ctx, node, key, (ctx['current'].slot), true, {}, defaultContent1);
return block1([hdlr1], [b3]); return block1([hdlr1], [b3]);
} }
}" }"
@@ -704,8 +704,8 @@ exports[`slots fun: two calls to the same slot 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -734,8 +734,8 @@ exports[`slots missing slots are ignored 2`] = `
let block1 = createBlock(\`<span><block-child-0/><span>some content</span><block-child-1/></span>\`); let block1 = createBlock(\`<span><block-child-0/><span>some content</span><block-child-1/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
const b3 = callSlot(ctx, node, key, 'footer', false, null); const b3 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -844,7 +844,7 @@ exports[`slots mix of slots, t-call, t-call with body, and giving own props chil
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = text(\`[C]\`); const b2 = text(\`[C]\`);
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -882,7 +882,7 @@ exports[`slots multiple roots are allowed in a default slot 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -921,7 +921,7 @@ exports[`slots multiple roots are allowed in a named slot 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'content', false, null); const b2 = callSlot(ctx, node, key, 'content', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -957,8 +957,8 @@ exports[`slots multiple slots containing components 2`] = `
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`); let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 's1', false, null); const b2 = callSlot(ctx, node, key, 's1', false, {});
const b3 = callSlot(ctx, node, key, 's2', false, null); const b3 = callSlot(ctx, node, key, 's2', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -1020,8 +1020,8 @@ exports[`slots named slot inside slot 2`] = `
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`); let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'brol', false, null); const b2 = callSlot(ctx, node, key, 'brol', false, {});
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -1069,8 +1069,8 @@ exports[`slots named slot inside slot, part 3 2`] = `
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`); let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'brol', false, null); const b2 = callSlot(ctx, node, key, 'brol', false, {});
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -1103,7 +1103,7 @@ exports[`slots named slots can define a default content 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'header', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'header', false, {}, defaultContent1);
return block1([], [b3]); return block1([], [b3]);
} }
}" }"
@@ -1159,9 +1159,9 @@ exports[`slots named slots inside slot, again 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'brol1', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'brol1', false, {}, defaultContent1);
const b5 = callSlot(ctx, node, key, 'brol2', false, null, defaultContent2); const b5 = callSlot(ctx, node, key, 'brol2', false, {}, defaultContent2);
const b6 = callSlot(ctx, node, key, 'default', false, null); const b6 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b3, b5, b6]); return block1([], [b3, b5, b6]);
} }
}" }"
@@ -1199,7 +1199,7 @@ exports[`slots nested slots in same template 2`] = `
let block1 = createBlock(\`<span id=\\"c1\\"><div><block-child-0/></div></span>\`); let block1 = createBlock(\`<span id=\\"c1\\"><div><block-child-0/></div></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1214,7 +1214,7 @@ exports[`slots nested slots in same template 3`] = `
let block1 = createBlock(\`<span id=\\"c2\\"><block-child-0/></span>\`); let block1 = createBlock(\`<span id=\\"c2\\"><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1256,7 +1256,7 @@ exports[`slots nested slots: evaluation context and parented relationship 2`] =
let { callSlot, markRaw } = helpers; let { callSlot, markRaw } = helpers;
function slot1(ctx, node, key = \\"\\") { function slot1(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
@@ -1274,7 +1274,7 @@ exports[`slots nested slots: evaluation context and parented relationship 3`] =
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1314,7 +1314,7 @@ exports[`slots no named slot content => just no children 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'header', false, null); const b2 = callSlot(ctx, node, key, 'header', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1345,7 +1345,7 @@ exports[`slots simple default slot 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1439,7 +1439,7 @@ exports[`slots simple default slot, variation 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -1509,7 +1509,7 @@ exports[`slots simple named and empty slot -- 2 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b3 = callSlot(ctx, node, key, 'myEmptySlot', false, null, defaultContent1); const b3 = callSlot(ctx, node, key, 'myEmptySlot', false, {}, defaultContent1);
return block1([], [b3]); return block1([], [b3]);
} }
}" }"
@@ -1541,8 +1541,8 @@ exports[`slots simple named and empty slot 2`] = `
let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`); let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
const b3 = callSlot(ctx, node, key, 'myEmptySlot', false, null); const b3 = callSlot(ctx, node, key, 'myEmptySlot', false, {});
return block1([], [b2, b3]); return block1([], [b2, b3]);
} }
}" }"
@@ -1629,7 +1629,7 @@ exports[`slots slot and (inline) t-call 3`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1678,7 +1678,7 @@ exports[`slots slot and t-call 3`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1712,7 +1712,7 @@ exports[`slots slot and t-esc 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1748,7 +1748,7 @@ exports[`slots slot are properly rendered if inner props are changed 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1793,7 +1793,7 @@ exports[`slots slot content has different key from other content -- dynamic slot
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`Child\`, {parent: 'SlotDisplay'}, key + \`__1\`, node, ctx); const b2 = component(\`Child\`, {parent: 'SlotDisplay'}, key + \`__1\`, node, ctx);
const slot1 = (ctx['slotName']); const slot1 = (ctx['slotName']);
const b3 = toggler(slot1, callSlot(ctx, node, key, slot1, true, null)); const b3 = toggler(slot1, callSlot(ctx, node, key, slot1, true, {}));
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -1837,7 +1837,7 @@ exports[`slots slot content has different key from other content -- static slot
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`Child\`, {parent: 'SlotDisplay'}, key + \`__1\`, node, ctx); const b2 = component(\`Child\`, {parent: 'SlotDisplay'}, key + \`__1\`, node, ctx);
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -1889,7 +1889,7 @@ exports[`slots slot content is bound to caller (variation) 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1923,7 +1923,7 @@ exports[`slots slot content is bound to caller 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -1955,7 +1955,7 @@ exports[`slots slot preserves properly parented relationship 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -2010,7 +2010,7 @@ exports[`slots slot preserves properly parented relationship, even through t-cal
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -2026,6 +2026,42 @@ exports[`slots slot preserves properly parented relationship, even through t-cal
}" }"
`; `;
exports[`slots slot with slot scope and t-props 1`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { capture, markRaw } = helpers;
let block2 = createBlock(\`<p><block-text-0/></p>\`);
let block3 = createBlock(\`<p><block-text-0/></p>\`);
function slot1(ctx, node, key = \\"\\") {
let txt1 = ctx['info'].a;
const b2 = block2([txt1]);
let txt2 = ctx['info'].b;
const b3 = block3([txt2]);
return multi([b2, b3]);
}
return function template(ctx, node, key = \\"\\") {
const ctx1 = capture(ctx);
return component(\`Child\`, {slots: markRaw({'slotName': {__render: slot1, __ctx: ctx1, __scope: \\"info\\"}})}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`slots slot with slot scope and t-props 2`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'slotName', false, Object.assign({}, ctx['info']));
}
}"
`;
exports[`slots slots and wrapper components 1`] = ` exports[`slots slots and wrapper components 1`] = `
"function anonymous(app, bdom, helpers "function anonymous(app, bdom, helpers
) { ) {
@@ -2051,7 +2087,7 @@ exports[`slots slots and wrapper components 2`] = `
let block1 = createBlock(\`<a href=\\"abc\\"><block-child-0/></a>\`); let block1 = createBlock(\`<a href=\\"abc\\"><block-child-0/></a>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2086,7 +2122,7 @@ exports[`slots slots are properly bound to correct component 2`] = `
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null, defaultContent1); return callSlot(ctx, node, key, 'default', false, {}, defaultContent1);
} }
}" }"
`; `;
@@ -2123,7 +2159,7 @@ exports[`slots slots are rendered with proper context 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'footer', false, null); const b2 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2170,7 +2206,7 @@ exports[`slots slots are rendered with proper context, part 2 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let attr1 = ctx['props'].to; let attr1 = ctx['props'].to;
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([attr1], [b2]); return block1([attr1], [b2]);
} }
}" }"
@@ -2218,7 +2254,7 @@ exports[`slots slots are rendered with proper context, part 3 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let attr1 = ctx['props'].to; let attr1 = ctx['props'].to;
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([attr1], [b2]); return block1([attr1], [b2]);
} }
}" }"
@@ -2257,7 +2293,7 @@ exports[`slots slots are rendered with proper context, part 4 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let attr1 = ctx['props'].to; let attr1 = ctx['props'].to;
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([attr1], [b2]); return block1([attr1], [b2]);
} }
}" }"
@@ -2297,7 +2333,7 @@ exports[`slots slots in slots, with vars 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") { function slot1(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
@@ -2316,7 +2352,7 @@ exports[`slots slots in slots, with vars 3`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2360,7 +2396,7 @@ exports[`slots slots in t-foreach and re-rendering 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let txt1 = ctx['state'].val; let txt1 = ctx['state'].val;
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([txt1], [b2]); return block1([txt1], [b2]);
} }
}" }"
@@ -2418,7 +2454,7 @@ exports[`slots slots in t-foreach in t-foreach 2`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2465,7 +2501,7 @@ exports[`slots slots in t-foreach with t-set and re-rendering 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
let txt1 = ctx['state'].val; let txt1 = ctx['state'].val;
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([txt1], [b2]); return block1([txt1], [b2]);
} }
}" }"
@@ -2501,7 +2537,7 @@ exports[`slots t-debug on a t-set-slot (defining a slot) 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'content', false, null); const b2 = callSlot(ctx, node, key, 'content', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2539,7 +2575,7 @@ exports[`slots t-set t-value in a slot 2`] = `
let block1 = createBlock(\`<span><block-child-0/></span>\`); let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2599,7 +2635,7 @@ exports[`slots t-slot in recursive templates 2`] = `
let block1 = createBlock(\`<wrapper><block-child-0/></wrapper>\`); let block1 = createBlock(\`<wrapper><block-child-0/></wrapper>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2637,7 +2673,7 @@ exports[`slots t-slot nested within another slot 2`] = `
} }
function slot2(ctx, node, key = \\"\\") { function slot2(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
@@ -2656,7 +2692,7 @@ exports[`slots t-slot nested within another slot 3`] = `
let block1 = createBlock(\`<span id=\\"modal\\"><block-child-0/></span>\`); let block1 = createBlock(\`<span id=\\"modal\\"><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2671,7 +2707,7 @@ exports[`slots t-slot nested within another slot 4`] = `
let block1 = createBlock(\`<span id=\\"portal\\"><block-child-0/></span>\`); let block1 = createBlock(\`<span id=\\"portal\\"><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2718,7 +2754,7 @@ exports[`slots t-slot scope context 2`] = `
function slot1(ctx, node, key = \\"\\") { function slot1(ctx, node, key = \\"\\") {
let hdlr1 = [ctx['onClick'], ctx]; let hdlr1 = [ctx['onClick'], ctx];
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([hdlr1], [b2]); return block1([hdlr1], [b2]);
} }
@@ -2735,7 +2771,7 @@ exports[`slots t-slot scope context 3`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -2771,7 +2807,7 @@ exports[`slots t-slot within dynamic t-call 2`] = `
let block1 = createBlock(\`<div class=\\"slotted\\"><block-child-0/></div>\`); let block1 = createBlock(\`<div class=\\"slotted\\"><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = callSlot(ctx, node, key, 'default', false, null); const b2 = callSlot(ctx, node, key, 'default', false, {});
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -2830,7 +2866,7 @@ exports[`slots template can just return a slot 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
}" }"
`; `;
@@ -147,7 +147,7 @@ exports[`style and class handling class on sub component, which is switched to a
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom; let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'someclass', child: ctx['state'].child}, key + \`__1\`, node, ctx); return component(\`Child\`, {class: 'someclass',child: ctx['state'].child}, key + \`__1\`, node, ctx);
} }
}" }"
`; `;
@@ -177,7 +177,7 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach,
for (let i2 = 0; i2 < l_block4; i2++) { for (let i2 = 0; i2 < l_block4; i2++) {
ctx[\`col\`] = v_block4[i2]; ctx[\`col\`] = v_block4[i2];
const key2 = ctx['col']; const key2 = ctx['col'];
const b6 = component(\`Child\`, {row: ctx['row'], col: ctx['col']}, key + \`__1__\${key1}__\${key2}\`, node, ctx); const b6 = component(\`Child\`, {row: ctx['row'],col: ctx['col']}, key + \`__1__\${key1}__\${key2}\`, node, ctx);
c_block4[i2] = withKey(block5([], [b6]), key2); c_block4[i2] = withKey(block5([], [b6]), key2);
} }
ctx = ctx.__proto__; ctx = ctx.__proto__;
@@ -366,7 +366,7 @@ exports[`t-on t-on on slot, with 'prevent' modifier 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const hdlr1 = [\\"prevent\\", ctx['doSomething'], ctx]; const hdlr1 = [\\"prevent\\", ctx['doSomething'], ctx];
return catcher1(callSlot(ctx, node, key, 'default', false, null), [hdlr1]); return catcher1(callSlot(ctx, node, key, 'default', false, {}), [hdlr1]);
} }
}" }"
`; `;
@@ -406,7 +406,7 @@ exports[`t-on t-on on t-set-slots 2`] = `
let { callSlot } = helpers; let { callSlot } = helpers;
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'myslot', false, null); return callSlot(ctx, node, key, 'myslot', false, {});
} }
}" }"
`; `;
@@ -441,7 +441,7 @@ exports[`t-on t-on on t-slots 2`] = `
const b3 = text(ctx['state'].count); const b3 = text(ctx['state'].count);
const b4 = text(\`] \`); const b4 = text(\`] \`);
const hdlr1 = [()=>this.state.count++, ctx]; const hdlr1 = [()=>this.state.count++, ctx];
const b5 = catcher1(callSlot(ctx, node, key, 'default', false, null), [hdlr1]); const b5 = catcher1(callSlot(ctx, node, key, 'default', false, {}), [hdlr1]);
return multi([b2, b3, b4, b5]); return multi([b2, b3, b4, b5]);
} }
}" }"
@@ -117,7 +117,7 @@ exports[`t-props t-props with props 1`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`); let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = component(\`Child\`, Object.assign({}, ctx['childProps'], {a: 1, b: 2}), key + \`__1\`, node, ctx); const b2 = component(\`Child\`, Object.assign({}, ctx['childProps'], {a: 1,b: 2}), key + \`__1\`, node, ctx);
return block1([], [b2]); return block1([], [b2]);
} }
}" }"
@@ -81,7 +81,7 @@ exports[`t-set slots with a t-set with a component in body 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = text(\`Child \`); const b2 = text(\`Child \`);
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -136,7 +136,7 @@ exports[`t-set slots with an t-set with a component in body 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = text(\`Blorg \`); const b2 = text(\`Blorg \`);
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
@@ -185,7 +185,7 @@ exports[`t-set slots with an unused t-set with a component in body 2`] = `
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {
const b2 = text(\`Child \`); const b2 = text(\`Child \`);
const b3 = callSlot(ctx, node, key, 'default', false, null); const b3 = callSlot(ctx, node, key, 'default', false, {});
return multi([b2, b3]); return multi([b2, b3]);
} }
}" }"
+22
View File
@@ -74,6 +74,28 @@ describe("slots", () => {
expect(fixture.innerHTML).toBe("<span>other text</span>"); expect(fixture.innerHTML).toBe("<span>other text</span>");
}); });
test("slot with slot scope and t-props", async () => {
class Child extends Component {
static template = xml`
<t t-slot="slotName" t-props="info"/>`;
info = { a: 1, b: 2 };
}
class Parent extends Component {
static template = xml`
<Child>
<t t-set-slot="slotName" t-slot-scope="info">
<p t-esc="info.a"/>
<p t-esc="info.b"/>
</t>
</Child>`;
static components = { Child };
}
await mount(Parent, fixture);
expect(fixture.innerHTML).toBe("<p>1</p><p>2</p>");
});
test("simple dynamic slot with slot scope", async () => { test("simple dynamic slot with slot scope", async () => {
let child: any; let child: any;
class Child extends Component { class Child extends Component {
+1 -1
View File
@@ -177,7 +177,7 @@ exports[`Portal Portal composed with t-slot 2`] = `
const Portal = app.Portal; const Portal = app.Portal;
function slot1(ctx, node, key = \\"\\") { function slot1(ctx, node, key = \\"\\") {
return callSlot(ctx, node, key, 'default', false, null); return callSlot(ctx, node, key, 'default', false, {});
} }
return function template(ctx, node, key = \\"\\") { return function template(ctx, node, key = \\"\\") {