diff --git a/.changeset/long-owls-eat.md b/.changeset/long-owls-eat.md new file mode 100644 index 000000000000..2855a756c85e --- /dev/null +++ b/.changeset/long-owls-eat.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: correctly handle falsy values of style directives in SSR mode diff --git a/packages/svelte/src/runtime/internal/ssr.js b/packages/svelte/src/runtime/internal/ssr.js index 85d6f443df44..1917f0cfbc69 100644 --- a/packages/svelte/src/runtime/internal/ssr.js +++ b/packages/svelte/src/runtime/internal/ssr.js @@ -193,7 +193,7 @@ export function add_classes(classes) { /** @returns {string} */ function style_object_to_string(style_object) { return Object.keys(style_object) - .filter((key) => style_object[key]) + .filter((key) => style_object[key] != null && style_object[key] !== '') .map((key) => `${key}: ${escape_attribute_value(style_object[key])};`) .join(' '); } diff --git a/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/_config.js b/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/_config.js new file mode 100644 index 000000000000..695b63f584ed --- /dev/null +++ b/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/_config.js @@ -0,0 +1,9 @@ +export default { + html: ` +

+

+

+

+

+ ` +}; diff --git a/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/main.svelte b/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/main.svelte new file mode 100644 index 000000000000..bed3e7c0b5a5 --- /dev/null +++ b/packages/svelte/test/runtime/samples/inline-style-directive-falsy-value/main.svelte @@ -0,0 +1,5 @@ +

+

+

+

+