diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index 9e4f0689fa..06d8d5593f 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -444,14 +444,26 @@ export default class EachBlockWrapper extends Wrapper { ${iterations}[#i].m(${update_mount_node}, ${anchor}); } ` - : deindent` - ${iterations}[#i] = ${create_each_block}(child_ctx); - ${iterations}[#i].c(); - ${has_transitions && `@transition_in(${this.vars.iterations}[#i], 1);`} - ${iterations}[#i].m(${update_mount_node}, ${anchor}); - `; + : has_transitions + ? deindent` + if (${iterations}[#i]) { + @transition_in(${this.vars.iterations}[#i], 1); + } else { + ${iterations}[#i] = ${create_each_block}(child_ctx); + ${iterations}[#i].c(); + @transition_in(${this.vars.iterations}[#i], 1); + ${iterations}[#i].m(${update_mount_node}, ${anchor}); + } + ` + : deindent` + if (!${iterations}[#i]) { + ${iterations}[#i] = ${create_each_block}(child_ctx); + ${iterations}[#i].c(); + ${iterations}[#i].m(${update_mount_node}, ${anchor}); + } + `; - const start = this.block.has_update_method ? '0' : `${view_length}`; + const start = this.block.has_update_method ? '0' : `#old_length`; let remove_old_blocks; @@ -465,12 +477,12 @@ export default class EachBlockWrapper extends Wrapper { `); remove_old_blocks = deindent` @group_outros(); - for (; #i < ${view_length}; #i += 1) ${out}(#i); + for (#i = ${this.vars.each_block_value}.${length}; #i < ${view_length}; #i += 1) ${out}(#i); @check_outros(); `; } else { remove_old_blocks = deindent` - for (${this.block.has_update_method ? `` : `#i = ${this.vars.each_block_value}.${length}`}; #i < ${view_length}; #i += 1) { + for (${this.block.has_update_method ? `` : `#i = ${this.vars.each_block_value}.${length}`}; #i < ${this.block.has_update_method ? view_length : '#old_length'}; #i += 1) { ${iterations}[#i].d(1); } ${!fixed_length && `${view_length} = ${this.vars.each_block_value}.${length};`} @@ -478,6 +490,7 @@ export default class EachBlockWrapper extends Wrapper { } const update = deindent` + ${!this.block.has_update_method && `const #old_length = ${this.vars.each_block_value}.length;`} ${this.vars.each_block_value} = ${snippet}; for (var #i = ${start}; #i < ${this.vars.each_block_value}.${length}; #i += 1) { diff --git a/test/runtime/samples/each-block-component-no-props/Child.svelte b/test/runtime/samples/each-block-component-no-props/Child.svelte new file mode 100644 index 0000000000..86ef4f3319 --- /dev/null +++ b/test/runtime/samples/each-block-component-no-props/Child.svelte @@ -0,0 +1 @@ +
hello
\ No newline at end of file diff --git a/test/runtime/samples/each-block-component-no-props/_config.js b/test/runtime/samples/each-block-component-no-props/_config.js new file mode 100644 index 0000000000..e8344496ca --- /dev/null +++ b/test/runtime/samples/each-block-component-no-props/_config.js @@ -0,0 +1,16 @@ +export default { + html: ` +hello
+ `, + + async test({ assert, component, target }) { + await component.remove(); + assert.htmlEqual(target.innerHTML, ``); + + await component.add(); + assert.htmlEqual(target.innerHTML, `hello
`); + + await component.remove(); + assert.htmlEqual(target.innerHTML, ``); + } +}; diff --git a/test/runtime/samples/each-block-component-no-props/main.svelte b/test/runtime/samples/each-block-component-no-props/main.svelte new file mode 100644 index 0000000000..01299fe314 --- /dev/null +++ b/test/runtime/samples/each-block-component-no-props/main.svelte @@ -0,0 +1,17 @@ + + +{#each items as item} +