diff --git a/.changeset/yellow-rockets-sit.md b/.changeset/yellow-rockets-sit.md new file mode 100644 index 0000000000..72ae77ab49 --- /dev/null +++ b/.changeset/yellow-rockets-sit.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: apply style directives to element with empty style attribute diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js index a6c41df5ce..2798817415 100644 --- a/packages/svelte/src/internal/server/index.js +++ b/packages/svelte/src/internal/server/index.js @@ -264,28 +264,28 @@ export function add_styles(style_object) { } /** - * @param {string} style_attribute - * @param {Record} style_directive + * @param {string} attribute + * @param {Record} styles */ -export function merge_styles(style_attribute, style_directive) { +export function merge_styles(attribute, styles) { /** @type {Record} */ - const style_object = {}; - for (const individual_style of style_attribute.split(';')) { - const colon_index = individual_style.indexOf(':'); - const name = individual_style.slice(0, colon_index).trim(); - const value = individual_style.slice(colon_index + 1).trim(); - if (!name) continue; - style_object[name] = value; - } - for (const name in style_directive) { - const value = style_directive[name]; - if (value) { - style_object[name] = value; - } else { - delete style_object[name]; + var merged = {}; + + if (attribute) { + for (var declaration of attribute.split(';')) { + var i = declaration.indexOf(':'); + var name = declaration.slice(0, i).trim(); + var value = declaration.slice(i + 1).trim(); + + if (name !== '') merged[name] = value; } } - return style_object; + + for (name in styles) { + merged[name] = styles[name]; + } + + return merged; } /** diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/_config.js new file mode 100644 index 0000000000..f83df4439f --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/_config.js @@ -0,0 +1,7 @@ +import { ok, test } from '../../test'; + +export default test({ + html: ` +

red

+ ` +}); diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/main.svelte b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/main.svelte new file mode 100644 index 0000000000..8a87a70706 --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/inline-style-directive-null-style/main.svelte @@ -0,0 +1 @@ +

red