From 88adfb6744b6fb9629c0b3f48fa9887f1e74a9ac Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Tue, 10 Sep 2019 11:37:16 -0400
Subject: [PATCH] escape `@` sigils in dev tooling events (#3545)

---
 src/compiler/compile/render_dom/Block.ts                      | 4 ++--
 .../Widget.svelte                                             | 0
 .../_config.js                                                | 3 +++
 .../main.svelte                                               | 3 ++-
 4 files changed, 7 insertions(+), 3 deletions(-)
 rename test/runtime/samples/{sigil-component-attribute => sigil-component-prop}/Widget.svelte (100%)
 rename test/runtime/samples/{sigil-component-attribute => sigil-component-prop}/_config.js (69%)
 rename test/runtime/samples/{sigil-component-attribute => sigil-component-prop}/main.svelte (63%)

diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts
index 4f6a51e12014..71082cea71ff 100644
--- a/src/compiler/compile/render_dom/Block.ts
+++ b/src/compiler/compile/render_dom/Block.ts
@@ -2,7 +2,7 @@ import CodeBuilder from '../utils/CodeBuilder';
 import deindent from '../utils/deindent';
 import Renderer from './Renderer';
 import Wrapper from './wrappers/shared/Wrapper';
-import { escape } from '../utils/stringify';
+import { stringify, escape } from '../utils/stringify';
 
 export interface BlockOptions {
 	parent?: Block;
@@ -378,7 +378,7 @@ export default class Block {
 					const block = {
 						${properties}
 					};
-					@dispatch_dev("SvelteRegisterBlock", { block, id: ${this.name || 'create_fragment'}.name, type: "${this.type}", source: "${this.comment ? this.comment.replace(/"/g, '\\"') : ''}", ctx });
+					@dispatch_dev("SvelteRegisterBlock", { block, id: ${this.name || 'create_fragment'}.name, type: "${this.type}", source: ${stringify(this.comment || '', { only_escape_at_symbol: true })}, ctx });
 					return block;`
 				: deindent`
 					return {
diff --git a/test/runtime/samples/sigil-component-attribute/Widget.svelte b/test/runtime/samples/sigil-component-prop/Widget.svelte
similarity index 100%
rename from test/runtime/samples/sigil-component-attribute/Widget.svelte
rename to test/runtime/samples/sigil-component-prop/Widget.svelte
diff --git a/test/runtime/samples/sigil-component-attribute/_config.js b/test/runtime/samples/sigil-component-prop/_config.js
similarity index 69%
rename from test/runtime/samples/sigil-component-attribute/_config.js
rename to test/runtime/samples/sigil-component-prop/_config.js
index 066505cfa474..2f467bb9d4dd 100644
--- a/test/runtime/samples/sigil-component-attribute/_config.js
+++ b/test/runtime/samples/sigil-component-prop/_config.js
@@ -1,4 +1,7 @@
 export default {
+	compileOptions: {
+		dev: true
+	},
 	props: { foo: 'foo' },
 	html: `<div>foo @ foo # foo</div>`,
 };
diff --git a/test/runtime/samples/sigil-component-attribute/main.svelte b/test/runtime/samples/sigil-component-prop/main.svelte
similarity index 63%
rename from test/runtime/samples/sigil-component-attribute/main.svelte
rename to test/runtime/samples/sigil-component-prop/main.svelte
index 07c36d3a414d..28c66c5bd6e8 100644
--- a/test/runtime/samples/sigil-component-attribute/main.svelte
+++ b/test/runtime/samples/sigil-component-prop/main.svelte
@@ -3,4 +3,5 @@
 	export let foo;
 </script>
 
-<Widget value='foo @ {foo} # foo'/>
+<Widget value='foo @ {foo} # foo'>
+</Widget>
\ No newline at end of file