diff --git a/src/compile/render-dom/wrappers/Slot.ts b/src/compile/render-dom/wrappers/Slot.ts index e21baaa717..3760e73ce0 100644 --- a/src/compile/render-dom/wrappers/Slot.ts +++ b/src/compile/render-dom/wrappers/Slot.ts @@ -42,6 +42,10 @@ export default class SlotWrapper extends Wrapper { }); block.add_dependencies(this.dependencies); + + // we have to do this, just in case + block.add_intro(); + block.add_outro(); } render( @@ -137,6 +141,14 @@ export default class SlotWrapper extends Wrapper { } `); + block.builders.intro.add_line( + `if (${slot} && ${slot}.i) ${slot}.i(#local);` + ); + + block.builders.outro.add_line( + `if (${slot} && ${slot}.o) ${slot}.o(#local);` + ); + let update_conditions = [...this.dependencies].map(name => `changed.${name}`).join(' || '); if (this.dependencies.size > 1) update_conditions = `(${update_conditions})`; diff --git a/test/runtime/samples/transition-js-slot/Nested.svelte b/test/runtime/samples/transition-js-slot/Nested.svelte new file mode 100644 index 0000000000..bc67b3c221 --- /dev/null +++ b/test/runtime/samples/transition-js-slot/Nested.svelte @@ -0,0 +1,9 @@ + + +
+ {#if visible} + + {/if} +
\ No newline at end of file diff --git a/test/runtime/samples/transition-js-slot/_config.js b/test/runtime/samples/transition-js-slot/_config.js new file mode 100644 index 0000000000..a32e4bda72 --- /dev/null +++ b/test/runtime/samples/transition-js-slot/_config.js @@ -0,0 +1,26 @@ +export default { + props: { + visible: false + }, + + html: ` +
+ `, + + test({ assert, component, target, window, raf }) { + component.visible = true; + const p = target.querySelector('p'); + assert.equal(p.foo, 0); + + raf.tick(50); + assert.equal(p.foo, 0.5); + + component.visible = false; + + raf.tick(75); + assert.equal(p.foo, 0.25); + + raf.tick(100); + assert.equal(p.foo, 0); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/transition-js-slot/main.svelte b/test/runtime/samples/transition-js-slot/main.svelte new file mode 100644 index 0000000000..afbcd68167 --- /dev/null +++ b/test/runtime/samples/transition-js-slot/main.svelte @@ -0,0 +1,18 @@ + + + +

slotted

+
\ No newline at end of file