diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 9e267b9ad0..d5e5b2d634 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -610,12 +610,14 @@ export default class ElementWrapper extends Wrapper {
}
`);
+ const fn = this.node.namespace === namespaces.svg ? `set_svg_attributes` : `set_attributes`;
+
block.builders.hydrate.add_line(
- `@set_attributes(${this.var}, ${data});`
+ `@${fn}(${this.var}, ${data});`
);
block.builders.update.add_block(deindent`
- @set_attributes(${this.var}, @get_spread_update(${levels}, [
+ @${fn}(${this.var}, @get_spread_update(${levels}, [
${updates.join(',\n')}
]));
`);
diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index 91425fbf85..29b7926715 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -101,6 +101,12 @@ export function set_attributes(node: Element & ElementCSSInlineStyle, attributes
}
}
+export function set_svg_attributes(node: Element & ElementCSSInlineStyle, attributes: { [x: string]: string }) {
+ for (const key in attributes) {
+ attr(node, key, attributes[key]);
+ }
+}
+
export function set_custom_element_data(node, prop, value) {
if (prop in node) {
node[prop] = value;
diff --git a/test/runtime/samples/svg-spread/_config.js b/test/runtime/samples/svg-spread/_config.js
new file mode 100644
index 0000000000..a198120a08
--- /dev/null
+++ b/test/runtime/samples/svg-spread/_config.js
@@ -0,0 +1,7 @@
+export default {
+ html: `
+
+ `
+};
diff --git a/test/runtime/samples/svg-spread/main.svelte b/test/runtime/samples/svg-spread/main.svelte
new file mode 100644
index 0000000000..a7a143814b
--- /dev/null
+++ b/test/runtime/samples/svg-spread/main.svelte
@@ -0,0 +1,7 @@
+
+
+