diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index 59beae1a39..c1dfb31c4a 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -10,7 +10,7 @@ export interface BlockOptions { renderer?: Renderer; comment?: string; key?: string; - bindings?: Map; + bindings?: Map; dependencies?: Set; } @@ -27,7 +27,7 @@ export default class Block { dependencies: Set; - bindings: Map; + bindings: Map; builders: { init: CodeBuilder; diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index ecd55c9b1d..a0a08fca0c 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -121,11 +121,19 @@ export default class EachBlockWrapper extends Wrapper { view_length: fixed_length === null ? `${iterations}.[✂${c}-${c+4}✂]` : fixed_length }; + const store = + node.expression.node.type === 'Identifier' && + node.expression.node.name[0] === '$' + ? node.expression.node.name.slice(1) + : null; + node.contexts.forEach(prop => { this.block.bindings.set(prop.key.name, { object: this.vars.each_block_value, property: this.index_name, - snippet: attach_head(`${this.vars.each_block_value}[${this.index_name}]`, prop.tail) + snippet: attach_head(`${this.vars.each_block_value}[${this.index_name}]`, prop.tail), + store, + tail: attach_head(`[${this.index_name}]`, prop.tail) }); }); diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts index 44372f8793..6eb0697c3c 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts @@ -249,7 +249,7 @@ function get_event_handler( snippet?: string; } { const value = get_value_from_dom(renderer, binding.parent, binding); - const store = binding.object[0] === '$' ? binding.object.slice(1) : null; + let store = binding.object[0] === '$' ? binding.object.slice(1) : null; let tail = ''; if (binding.node.expression.node.type === 'MemberExpression') { @@ -258,7 +258,13 @@ function get_event_handler( } if (binding.node.is_contextual) { - const { object, property, snippet } = block.bindings.get(name); + const binding = block.bindings.get(name); + const { object, property, snippet } = binding; + + if (binding.store) { + store = binding.store; + tail = `${binding.tail}${tail}`; + } return { uses_context: true, diff --git a/test/runtime/samples/store-each-binding-destructuring/_config.js b/test/runtime/samples/store-each-binding-destructuring/_config.js new file mode 100644 index 0000000000..70776940dd --- /dev/null +++ b/test/runtime/samples/store-each-binding-destructuring/_config.js @@ -0,0 +1,14 @@ +export default { + async test({ assert, target, window }) { + const input = target.querySelector('input'); + + const event = new window.Event('input'); + input.value = 'changed'; + await input.dispatchEvent(event); + + assert.htmlEqual(target.innerHTML, ` + +

changed

+ `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/store-each-binding-destructuring/main.svelte b/test/runtime/samples/store-each-binding-destructuring/main.svelte new file mode 100644 index 0000000000..0b68038e73 --- /dev/null +++ b/test/runtime/samples/store-each-binding-destructuring/main.svelte @@ -0,0 +1,13 @@ + + +{#each $items as { text }} + +{/each} + +

{$items[0].text}

\ No newline at end of file diff --git a/test/runtime/samples/store-each-binding/_config.js b/test/runtime/samples/store-each-binding/_config.js new file mode 100644 index 0000000000..70776940dd --- /dev/null +++ b/test/runtime/samples/store-each-binding/_config.js @@ -0,0 +1,14 @@ +export default { + async test({ assert, target, window }) { + const input = target.querySelector('input'); + + const event = new window.Event('input'); + input.value = 'changed'; + await input.dispatchEvent(event); + + assert.htmlEqual(target.innerHTML, ` + +

changed

+ `); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/store-each-binding/main.svelte b/test/runtime/samples/store-each-binding/main.svelte new file mode 100644 index 0000000000..917d5c2001 --- /dev/null +++ b/test/runtime/samples/store-each-binding/main.svelte @@ -0,0 +1,13 @@ + + +{#each $items as item} + +{/each} + +

{$items[0].text}

\ No newline at end of file