diff --git a/plugins/addClassesToSVGElement.js b/plugins/addClassesToSVGElement.js
index 7f38dd0d..140223be 100644
--- a/plugins/addClassesToSVGElement.js
+++ b/plugins/addClassesToSVGElement.js
@@ -69,8 +69,17 @@ exports.fn = (root, params) => {
element: {
enter: (node, parentNode) => {
if (node.name === 'svg' && parentNode.type === 'root') {
- // @ts-ignore class attribute will be just a string eventually
- node.class.add(...classNames);
+ const classList = new Set(
+ node.attributes.class == null
+ ? null
+ : node.attributes.class.split(' ')
+ );
+ for (const className of classNames) {
+ if (className != null) {
+ classList.add(className);
+ }
+ }
+ node.attributes.class = Array.from(classList).join(' ');
}
},
},
diff --git a/plugins/inlineStyles.js b/plugins/inlineStyles.js
index 1d9d3de3..7e2c755d 100644
--- a/plugins/inlineStyles.js
+++ b/plugins/inlineStyles.js
@@ -207,13 +207,19 @@ exports.fn = function (root, opts) {
for (selectedEl of selector.selectedEls) {
// class
- var firstSubSelector = selector.item.data.children.first();
+ const classList = new Set(
+ selectedEl.attributes.class == null
+ ? null
+ : selectedEl.attributes.class.split(' ')
+ );
+ const firstSubSelector = selector.item.data.children.first();
if (firstSubSelector.type === 'ClassSelector') {
- selectedEl.class.remove(firstSubSelector.name);
+ classList.delete(firstSubSelector.name);
}
- // clean up now empty class attributes
- if (typeof selectedEl.class.item(0) === 'undefined') {
+ if (classList.size === 0) {
delete selectedEl.attributes.class;
+ } else {
+ selectedEl.attributes.class = Array.from(classList).join(' ');
}
// ID
diff --git a/plugins/reusePaths.js b/plugins/reusePaths.js
index 0d9c1fa7..43b7f069 100644
--- a/plugins/reusePaths.js
+++ b/plugins/reusePaths.js
@@ -62,16 +62,7 @@ exports.fn = function (root) {
);
root.children[0].spliceContent(0, 0, defsTag);
for (let def of defs) {
- // Remove class and style before copying to avoid circular refs in
- // JSON.stringify. This is fine because we don't actually want class or
- // style information to be copied.
- const style = def.style;
- const defClass = def.class;
- delete def.style;
- delete def.class;
const defClone = def.clone();
- def.style = style;
- def.class = defClass;
delete defClone.attributes.transform;
defsTag.spliceContent(0, 0, defClone);
// Convert the original def to a use so the first usage isn't duplicated.
diff --git a/test/plugins/addClassesToSVGElement.03.svg b/test/plugins/addClassesToSVGElement.03.svg
new file mode 100644
index 00000000..a9ba2cea
--- /dev/null
+++ b/test/plugins/addClassesToSVGElement.03.svg
@@ -0,0 +1,17 @@
+Should avoid adding existing classes
+
+===
+
+
+
+@@@
+
+
+
+@@@
+
+{"classNames":["mySvg","size-big"]}