fix: css classes for dynamic elements

src/compiler/compile/nodes/DynamicElement.ts

@@ -99,6 +99,10 @@ export default class DynamicElement extends Node {
 		this.children = map_children(component, this, this.scope, info.children);
 
 		this.validate();
+
+		// TODO create BaseElement class or an interface which both DynamicElement and Element use
+		// to resolve the hacky cast
+		component.apply_stylesheet(this as any);
 	}
 
 	validate() {

test/css/samples/dynamic-element/_config.js

@@ -0,0 +1,20 @@
+export default {
+	warnings: [
+		{
+			code: "css-unused-selector",
+			end: {
+				character: 86,
+				column: 8,
+				line: 7,
+			},
+			frame: " 5:     color: red;\n 6:   }\n 7:   .unused {\n      ^\n 8:     font-style: italic;\n 9:   }",
+			message: 'Unused CSS selector ".unused"',
+			pos: 79,
+			start: {
+				character: 79,
+				column: 1,
+				line: 7,
+			}
+		}
+	]
+};

test/css/samples/dynamic-element/expected.css

@@ -0,0 +1 @@
+.used.svelte-xyz{color:red}

test/css/samples/dynamic-element/expected.html

@@ -0,0 +1 @@
+<div class="used svelte-xyz"></div>

test/css/samples/dynamic-element/input.svelte

@@ -0,0 +1,10 @@
+<svelte:element this="div" class="used" />
+
+<style>
+	.used {
+		color: red;
+	}
+	.unused {
+		font-style: italic;
+	}
+</style>