diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts index fa8665ffde..423186e4f3 100644 --- a/src/compiler/compile/Component.ts +++ b/src/compiler/compile/Component.ts @@ -1265,10 +1265,16 @@ export default class Component { } if (node.type === 'AssignmentExpression') { - extract_identifiers(get_object(node.left)).forEach(node => { + const left = get_object(node.left); + + extract_identifiers(left).forEach(node => { assignee_nodes.add(node); assignees.add(node.name); }); + + if (node.operator !== '=') { + dependencies.add(left.name); + } } else if (node.type === 'UpdateExpression') { const identifier = get_object(node.argument); assignees.add(identifier.name); diff --git a/test/runtime/samples/reactive-compound-operator/_config.js b/test/runtime/samples/reactive-compound-operator/_config.js new file mode 100644 index 0000000000..dd59fbbf0a --- /dev/null +++ b/test/runtime/samples/reactive-compound-operator/_config.js @@ -0,0 +1,27 @@ +export default { + html: ` + +
count: 0
+ `, + + async test({ assert, component, target, window }) { + const click = new window.MouseEvent('click'); + const button = target.querySelector('button'); + + await button.dispatchEvent(click); + + assert.equal(component.x, 2); + assert.htmlEqual(target.innerHTML, ` + +count: 2
+ `); + + await button.dispatchEvent(click); + + assert.equal(component.x, 6); + assert.htmlEqual(target.innerHTML, ` + +count: 6
+ `); + } +}; diff --git a/test/runtime/samples/reactive-compound-operator/main.svelte b/test/runtime/samples/reactive-compound-operator/main.svelte new file mode 100644 index 0000000000..52654aed59 --- /dev/null +++ b/test/runtime/samples/reactive-compound-operator/main.svelte @@ -0,0 +1,8 @@ + + + +count: {x}
diff --git a/test/runtime/samples/reactive-update-expression/_config.js b/test/runtime/samples/reactive-update-expression/_config.js new file mode 100644 index 0000000000..111460f7dd --- /dev/null +++ b/test/runtime/samples/reactive-update-expression/_config.js @@ -0,0 +1,29 @@ +export default { + html: ` + +count: 1
+ `, + + async test({ assert, component, target, window }) { + const click = new window.MouseEvent('click'); + const button = target.querySelector('button'); + + assert.equal(component.x, 1); + + await button.dispatchEvent(click); + + assert.equal(component.x, 3); + assert.htmlEqual(target.innerHTML, ` + +count: 3
+ `); + + await button.dispatchEvent(click); + + assert.equal(component.x, 5); + assert.htmlEqual(target.innerHTML, ` + +count: 5
+ `); + } +}; diff --git a/test/runtime/samples/reactive-update-expression/main.svelte b/test/runtime/samples/reactive-update-expression/main.svelte new file mode 100644 index 0000000000..0e0b45ddd6 --- /dev/null +++ b/test/runtime/samples/reactive-update-expression/main.svelte @@ -0,0 +1,12 @@ + + + +count: {x}