From 0fe04561b27e509bd0fa992dc3f70ab3caf2746a Mon Sep 17 00:00:00 2001
From: Rich Harris <richard.a.harris@gmail.com>
Date: Tue, 30 Jul 2019 14:32:53 -0400
Subject: [PATCH] quote props if necessary in SSR mode - fixes #3312

---
 .../compile/render_ssr/handlers/InlineComponent.ts   |  4 ++--
 test/runtime/samples/prop-quoted/Nested.svelte       |  1 +
 test/runtime/samples/prop-quoted/_config.js          | 12 ++++++++++++
 test/runtime/samples/prop-quoted/main.svelte         |  7 +++++++
 4 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 test/runtime/samples/prop-quoted/Nested.svelte
 create mode 100644 test/runtime/samples/prop-quoted/_config.js
 create mode 100644 test/runtime/samples/prop-quoted/main.svelte

diff --git a/src/compiler/compile/render_ssr/handlers/InlineComponent.ts b/src/compiler/compile/render_ssr/handlers/InlineComponent.ts
index 320bf5e6a0..74d990a3d8 100644
--- a/src/compiler/compile/render_ssr/handlers/InlineComponent.ts
+++ b/src/compiler/compile/render_ssr/handlers/InlineComponent.ts
@@ -58,7 +58,7 @@ export default function(node: InlineComponent, renderer: Renderer, options: Rend
 					if (attribute.is_spread) {
 						return snip(attribute.expression);
 					} else {
-						return `{ ${attribute.name}: ${get_attribute_value(attribute)} }`;
+						return `{ ${quote_name_if_necessary(attribute.name)}: ${get_attribute_value(attribute)} }`;
 					}
 				})
 				.concat(binding_props.map(p => `{ ${p} }`))
@@ -67,7 +67,7 @@ export default function(node: InlineComponent, renderer: Renderer, options: Rend
 	} else {
 		props = stringify_props(
 			node.attributes
-				.map(attribute => `${attribute.name}: ${get_attribute_value(attribute)}`)
+				.map(attribute => `${quote_name_if_necessary(attribute.name)}: ${get_attribute_value(attribute)}`)
 				.concat(binding_props)
 		);
 	}
diff --git a/test/runtime/samples/prop-quoted/Nested.svelte b/test/runtime/samples/prop-quoted/Nested.svelte
new file mode 100644
index 0000000000..681f7126b2
--- /dev/null
+++ b/test/runtime/samples/prop-quoted/Nested.svelte
@@ -0,0 +1 @@
+{$$props['x-y-z']}
\ No newline at end of file
diff --git a/test/runtime/samples/prop-quoted/_config.js b/test/runtime/samples/prop-quoted/_config.js
new file mode 100644
index 0000000000..d982bc87cc
--- /dev/null
+++ b/test/runtime/samples/prop-quoted/_config.js
@@ -0,0 +1,12 @@
+export default {
+	props: {
+		foo: 1
+	},
+
+	html: `1`,
+
+	async test({ assert, component, target }) {
+		component.foo = 2;
+		assert.htmlEqual(target.innerHTML, `2`);
+	}
+};
\ No newline at end of file
diff --git a/test/runtime/samples/prop-quoted/main.svelte b/test/runtime/samples/prop-quoted/main.svelte
new file mode 100644
index 0000000000..0249017762
--- /dev/null
+++ b/test/runtime/samples/prop-quoted/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	import Nested from './Nested.svelte';
+
+	export let foo;
+</script>
+
+<Nested x-y-z={foo}/>
\ No newline at end of file