From a0bdac8cd71a727bf26cc9376558736530d427b7 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 13 May 2024 20:38:01 +0200
Subject: [PATCH] fix: correctly handle falsy values of style directives in SSR
 mode (#11583)

fixes #11044
---
 .changeset/good-roses-argue.md                        |  5 +++++
 packages/svelte/src/internal/server/index.js          |  2 +-
 .../inline-style-directive-falsy-value/_config.js     | 11 +++++++++++
 .../inline-style-directive-falsy-value/main.svelte    |  5 +++++
 4 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/good-roses-argue.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/main.svelte

diff --git a/.changeset/good-roses-argue.md b/.changeset/good-roses-argue.md
new file mode 100644
index 0000000000..2191aeb6ef
--- /dev/null
+++ b/.changeset/good-roses-argue.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: correctly handle falsy values of style directives in SSR mode
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 6c2a2b5791..a1eaab0f97 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -354,7 +354,7 @@ export function stringify(value) {
 /** @param {Record<string, string>} style_object */
 function style_object_to_string(style_object) {
 	return Object.keys(style_object)
-		.filter(/** @param {any} key */ (key) => style_object[key])
+		.filter(/** @param {any} key */ (key) => style_object[key] != null && style_object[key] !== '')
 		.map(/** @param {any} key */ (key) => `${key}: ${escape_html(style_object[key], true)};`)
 		.join(' ');
 }
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/_config.js
new file mode 100644
index 0000000000..bb7f4518d9
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/_config.js
@@ -0,0 +1,11 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<p style="--a: 0;"></p>
+		<p style="--b: false;"></p>
+		<p></p>
+		<p></p>
+		<p></p>
+	`
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/main.svelte b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/main.svelte
new file mode 100644
index 0000000000..bed3e7c0b5
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-falsy-value/main.svelte
@@ -0,0 +1,5 @@
+<p style:--a={0}></p>
+<p style:--b={false}></p>
+<p style:--c=""></p>
+<p style:--d={undefined}></p>
+<p style:--e={null}></p>