fix: ensure undefined attributes are removed during hydration (#16178)

* fix: ensure undefined attributes are removed during hydration

Attributes that are `undefined` on the client should be removed during hydration,
even if their value hasn't changed compared to `prev_value`.

* Create plenty-wasps-sleep.md

* added test

* Update .changeset/plenty-wasps-sleep.md

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>

Author: floriskn

.changeset/plenty-wasps-sleep.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove undefined attributes on hydration

packages/svelte/src/internal/client/dom/elements/attributes.js

@@ -345,7 +345,11 @@ export function set_attributes(element, prev, next, css_hash, skip_warning = fal
 		}
 
 		var prev_value = current[key];
-		if (value === prev_value) continue;
+
+		// Skip if value is unchanged, unless it's `undefined` and the element still has the attribute
+		if (value === prev_value && !(value === undefined && element.hasAttribute(key))) {
+			continue;
+		}
 
 		current[key] = value;
 

packages/svelte/tests/hydration/samples/removes-undefined-attributes/_config.js

@@ -0,0 +1,11 @@
+import { test } from '../../test';
+
+export default test({
+	server_props: {
+		browser: false
+	},
+
+	props: {
+		browser: true
+	}
+});

packages/svelte/tests/hydration/samples/removes-undefined-attributes/_expected.html

@@ -0,0 +1 @@
+<!--[--><div></div><!--]-->

packages/svelte/tests/hydration/samples/removes-undefined-attributes/main.svelte

@@ -0,0 +1,9 @@
+<script>
+	const { browser } = $props();
+
+	const attributes = {
+		"data-test": browser ? undefined : ""
+	};
+</script>
+
+<div {...attributes}></div>