Merge pull request #869 from sveltejs/gh-868

Escape sigils in .textContent and .innerHTML

src/generators/dom/visitors/Element/Element.ts

@@ -16,6 +16,7 @@ import Block from '../../Block';
 import { Node } from '../../../../interfaces';
 import { State } from '../../interfaces';
 import reservedNames from '../../../../utils/reservedNames';
+import { stringify } from '../../../../utils/stringify';
 
 const meta = {
 	':Window': visitWindow,
@@ -205,11 +206,11 @@ export default function visitElement(
 	if (!childState.namespace && node.canUseInnerHTML && node.children.length > 0) {
 		if (node.children.length === 1 && node.children[0].type === 'Text') {
 			block.builders.create.addLine(
-				`${name}.textContent = ${JSON.stringify(node.children[0].data)};`
+				`${name}.textContent = ${stringify(node.children[0].data)};`
 			);
 		} else {
 			block.builders.create.addLine(
-				`${name}.innerHTML = ${JSON.stringify(node.children.map(toHTML).join(''))};`
+				`${name}.innerHTML = ${stringify(node.children.map(toHTML).join(''))};`
 			);
 		}
 	} else {

test/runtime/samples/escaped-text/_config.js

@@ -1,7 +1,29 @@
 export default {
 	html: `
+		@x
 		@@x
+		#foo
+		##foo
 		%1
 		%%2
+
+		<div>
+			@x
+			@@x
+			#foo
+			##foo
+			%1
+			%%2
+		</div>
+
+		<div>
+			@x
+			@@x
+			#foo
+			##foo
+			%1
+			%%2
+			<span>inner</span>
+		</div>
 	`
 };

test/runtime/samples/escaped-text/main.html

@@ -1,3 +1,25 @@
+@x
 @@x
+#foo
+##foo
 %1
 %%2
+
+<div>
+	@x
+	@@x
+	#foo
+	##foo
+	%1
+	%%2
+</div>
+
+<div>
+	@x
+	@@x
+	#foo
+	##foo
+	%1
+	%%2
+	<span>inner</span>
+</div>