diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 382bdfaec10c..eed7c6f4eeee 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -1048,7 +1048,7 @@ export default class ElementWrapper extends Wrapper {
 
 			block.chunks.hydrate.push(updater);
 
-			if (has_spread) {
+			if (has_spread || this.node.is_dynamic_element) {
 				block.chunks.update.push(updater);
 			} else if ((dependencies && dependencies.size > 0) || this.class_dependencies.length) {
 				const all_dependencies = this.class_dependencies.concat(...dependencies);
diff --git a/test/runtime/samples/dynamic-element-class-directive/Link.svelte b/test/runtime/samples/dynamic-element-class-directive/Link.svelte
new file mode 100644
index 000000000000..c58b3d1dc5c3
--- /dev/null
+++ b/test/runtime/samples/dynamic-element-class-directive/Link.svelte
@@ -0,0 +1,13 @@
+<script>
+	export let item;
+</script>
+
+<svelte:element this="div" class:active={true}>
+	{item.text}
+</svelte:element>
+
+<style>
+	.active {
+		color: red;
+	}
+</style>
diff --git a/test/runtime/samples/dynamic-element-class-directive/_config.js b/test/runtime/samples/dynamic-element-class-directive/_config.js
new file mode 100644
index 000000000000..1106467919af
--- /dev/null
+++ b/test/runtime/samples/dynamic-element-class-directive/_config.js
@@ -0,0 +1,11 @@
+export default {
+	html: `
+		<div class="svelte-1vsuzn0 active">foo</div>
+		<div class="svelte-1vsuzn0 active">foo0</div>
+		<div class="svelte-1vsuzn0 active">foo0</div>
+		<div class="svelte-1vsuzn0 active">foo0</div>
+		<div class="svelte-1vsuzn0 active">foo1</div>
+		<div class="svelte-1vsuzn0 active">foo2</div>
+		<div class="svelte-1vsuzn0 active">foo3</div>
+	`
+};
diff --git a/test/runtime/samples/dynamic-element-class-directive/main.svelte b/test/runtime/samples/dynamic-element-class-directive/main.svelte
new file mode 100644
index 000000000000..58e9303100b6
--- /dev/null
+++ b/test/runtime/samples/dynamic-element-class-directive/main.svelte
@@ -0,0 +1,16 @@
+<script>
+	import Link from "./Link.svelte";
+	let foo = [
+		{ text: "foo0" },
+		{ text: "foo1" },
+		{ text: "foo2" },
+		{ text: "foo3" },
+	];
+</script>
+
+<Link item={{ text: "foo" }} />
+<Link item={foo[0]} />
+<Link bind:item={foo[0]} />
+{#each foo as item}
+	<Link bind:item />
+{/each}