diff --git a/src/compiler/code_generator.ts b/src/compiler/code_generator.ts
index b3aa587d..ca341a15 100644
--- a/src/compiler/code_generator.ts
+++ b/src/compiler/code_generator.ts
@@ -1234,7 +1234,7 @@ export class CodeGenerator {
if (dynamic) {
let name = this.generateId("slot");
this.define(name, slotName);
- blockString = `toggler(${name}, callSlot(ctx, node, key, ${name}), ${dynamic}, ${scope})`;
+ blockString = `toggler(${name}, callSlot(ctx, node, key, ${name}, ${dynamic}, ${scope}))`;
} else {
blockString = `callSlot(ctx, node, key, ${slotName}, ${dynamic}, ${scope})`;
}
diff --git a/tests/components/__snapshots__/slots.test.ts.snap b/tests/components/__snapshots__/slots.test.ts.snap
index c58a6727..d00d8521 100644
--- a/tests/components/__snapshots__/slots.test.ts.snap
+++ b/tests/components/__snapshots__/slots.test.ts.snap
@@ -626,7 +626,7 @@ exports[`slots dynamic t-slot call 2`] = `
return function template(ctx, node, key = \\"\\") {
let hdlr1 = [ctx['toggle'], ctx];
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, null));
return block1([hdlr1], [b2]);
}
}"
@@ -1444,6 +1444,45 @@ exports[`slots simple default slot, variation 2`] = `
}"
`;
+exports[`slots simple dynamic slot with slot scope 1`] = `
+"function anonymous(bdom, helpers
+) {
+ let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+ let { capture, markRaw } = helpers;
+
+ function slot1(ctx, node, key = \\"\\") {
+ let b2,b3;
+ if (ctx['slotScope'].bool) {
+ b2 = text(\`some text\`);
+ } else {
+ b3 = text(\`other text\`);
+ }
+ 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: \\"slotScope\\"}})}, key + \`__1\`, node, ctx);
+ }
+}"
+`;
+
+exports[`slots simple dynamic slot with slot scope 2`] = `
+"function anonymous(bdom, helpers
+) {
+ let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+ let { callSlot } = helpers;
+
+ let block1 = createBlock(\`\`);
+
+ return function template(ctx, node, key = \\"\\") {
+ const slot1 = ('slotName');
+ const b2 = toggler(slot1, callSlot(ctx, node, key, slot1, true, {bool: ctx['state'].bool}));
+ return block1([], [b2]);
+ }
+}"
+`;
+
exports[`slots simple named and empty slot -- 2 1`] = `
"function anonymous(bdom, helpers
) {
@@ -1754,7 +1793,7 @@ exports[`slots slot content has different key from other content -- dynamic slot
return function template(ctx, node, key = \\"\\") {
const b2 = component(\`Child\`, {parent: 'SlotDisplay'}, key + \`__1\`, node, ctx);
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, null));
return multi([b2, b3]);
}
}"
diff --git a/tests/components/slots.test.ts b/tests/components/slots.test.ts
index 9cbf325b..26e20600 100644
--- a/tests/components/slots.test.ts
+++ b/tests/components/slots.test.ts
@@ -74,6 +74,35 @@ describe("slots", () => {
expect(fixture.innerHTML).toBe("other text");
});
+ test("simple dynamic slot with slot scope", async () => {
+ let child: any;
+ class Child extends Component {
+ static template = xml``;
+ state = useState({ bool: true });
+ setup() {
+ child = this;
+ }
+ }
+
+ class Parent extends Component {
+ static template = xml`
+
+
+ some text
+ other text
+
+ `;
+ static components = { Child };
+ }
+
+ await mount(Parent, fixture);
+ expect(fixture.innerHTML).toBe("some text");
+
+ child.state.bool = false;
+ await nextTick();
+ expect(fixture.innerHTML).toBe("other text");
+ });
+
test("simple named and empty slot", async () => {
class Child extends Component {
static template = xml``;