Merge pull request #3294 from sveltejs/gh-3289

reuse unchanged spread levels

src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts

@@ -185,7 +185,7 @@ export default class InlineComponentWrapper extends Wrapper {
 					add_to_set(all_dependencies, attr.dependencies);
 				});
 
-				this.node.attributes.forEach(attr => {
+				this.node.attributes.forEach((attr, i) => {
 					const { name, dependencies } = attr;
 
 					const condition = dependencies.size > 0 && (dependencies.size !== all_dependencies.size)
@@ -201,7 +201,7 @@ export default class InlineComponentWrapper extends Wrapper {
 						const obj = `{ ${quote_name_if_necessary(name)}: ${attr.get_value(block)} }`;
 						initial_props.push(obj);
 
-						changes.push(condition ? `${condition} && ${obj}` : obj);
+						changes.push(condition ? `${condition} && ${obj}` : `${levels}[${i}]`);
 					}
 				});
 

test/runtime/samples/spread-reuse-levels/Nested.svelte

@@ -0,0 +1,21 @@
+<script>
+	import { beforeUpdate } from 'svelte';
+
+	export let a, b, c;
+
+	let changed = {};
+	let previous = {};
+
+	beforeUpdate(() => {
+		changed.a = a !== previous.a;
+		changed.b = b !== previous.b;
+		changed.c = c !== previous.c;
+
+		previous.a = a;
+		previous.b = b;
+		previous.c = c;
+	});
+</script>
+
+<pre>{JSON.stringify({ a, b, c })}</pre>
+<pre>{JSON.stringify(changed)}</pre>

test/runtime/samples/spread-reuse-levels/_config.js

@@ -0,0 +1,20 @@
+export default {
+	html: `
+		<pre>{"a":1,"b":[1],"c":42}</pre>
+		<pre>{"a":false,"b":false,"c":false}</pre>
+	`,
+
+	ssrHtml: `
+		<pre>{"a":1,"b":[1],"c":42}</pre>
+		<pre>{}</pre>
+	`,
+
+	test({ assert, component, target }) {
+		component.a = 2;
+
+		assert.htmlEqual(target.innerHTML, `
+			<pre>{"a":2,"b":[1],"c":42}</pre>
+			<pre>{"a":true,"b":false,"c":false}</pre>
+		`);
+	}
+};

test/runtime/samples/spread-reuse-levels/main.svelte

@@ -0,0 +1,8 @@
+<script>
+	import Nested from './Nested.svelte';
+
+	export let a = 1;
+	let x = {};
+</script>
+
+<Nested {...x} {a} b={[1]} c={42}/>