test nested server-rendered styles

test/server-side-rendering/styles-nested/One.html

@@ -0,0 +1,16 @@
+<div>green: {{message}}</div>
+<Two message='{{message}}'/>
+
+<style>
+	div {
+		color: green;
+	}
+</style>
+
+<script>
+	import Two from './Two.html';
+
+	export default {
+		components: { Two }
+	};
+</script>

test/server-side-rendering/styles-nested/Two.html

@@ -0,0 +1,7 @@
+<div>blue: {{message}}</div>
+
+<style>
+	div {
+		color: blue;
+	}
+</style>

test/server-side-rendering/styles-nested/_actual.css

@@ -0,0 +1,14 @@
+                                                                 
+	div[svelte-4188175681], [svelte-4188175681] div {
+		color: red;
+	}
+
+                                                                   
+	div[svelte-146600313], [svelte-146600313] div {
+		color: green;
+	}
+
+                                     
+	div[svelte-1506185237], [svelte-1506185237] div {
+		color: blue;
+	}

test/server-side-rendering/styles-nested/_actual.html

@@ -0,0 +1,5 @@
+<div svelte-4188175681>red</div>
+	 <div svelte-146600313>green: foo</div>
+	 <div svelte-1506185237>blue: foo</div>
+	 <div svelte-146600313>green: bar</div>
+	 <div svelte-1506185237>blue: bar</div>

test/server-side-rendering/styles-nested/_expected.css

@@ -0,0 +1,11 @@
+div[svelte-4188175681], [svelte-4188175681] div {
+	color: red;
+}
+
+div[svelte-146600313], [svelte-146600313] div {
+	color: green;
+}
+
+div[svelte-1506185237], [svelte-1506185237] div {
+	color: blue;
+}

test/server-side-rendering/styles-nested/_expected.html

@@ -0,0 +1,5 @@
+<div svelte-4188175681>red</div>
+<div svelte-146600313>green: foo</div>
+<div svelte-1506185237>blue: foo</div>
+<div svelte-146600313>green: bar</div>
+<div svelte-1506185237>blue: bar</div>

test/server-side-rendering/styles-nested/main.html

@@ -0,0 +1,17 @@
+<div>red</div>
+<One message='foo'/>
+<One message='bar'/>
+
+<style>
+	div {
+		color: red;
+	}
+</style>
+
+<script>
+	import One from './One.html';
+
+	export default {
+		components: { One }
+	};
+</script>