Repository: svg/svgo
Pull request #546 (2016-05-12 12:16:04)

adds addAttributes plugin
Allows adding valueless attributes to the svg element.


Patch:
diff --git a/lib/svgo/js2svg.js b/lib/svgo/js2svg.js
index 040d5e6..b2e66e5 100644
--- a/lib/svgo/js2svg.js
+++ b/lib/svgo/js2svg.js
@@ -315,11 +315,18 @@ JS2SVG.prototype.createAttrs = function(elem) {
 
     elem.eachAttr(function(attr) {
 
-        attrs +=    ' ' +
-                    attr.name +
-                    this.config.attrStart +
-                    String(attr.value).replace(this.config.regValEntities, this.config.encodeEntity) +
-                    this.config.attrEnd;
+        if (attr.value !== undefined) {
+            attrs +=    ' ' +
+                        attr.name +
+                        this.config.attrStart +
+                        String(attr.value).replace(this.config.regValEntities, this.config.encodeEntity) +
+                        this.config.attrEnd;
+        }
+        else {
+            attrs +=    ' ' +
+                        attr.name;
+        }
+
 
     }, this);
 
diff --git a/lib/svgo/jsAPI.js b/lib/svgo/jsAPI.js
index 3c30941..1e2f55f 100644
--- a/lib/svgo/jsAPI.js
+++ b/lib/svgo/jsAPI.js
@@ -248,7 +248,6 @@ JSAPI.prototype.renameElem = function(name) {
     attr = attr || {};
 
     if (attr.name === undefined ||
-        attr.value === undefined ||
         attr.prefix === undefined ||
         attr.local === undefined
     ) return false;


Test patch:
diff --git a/plugins/addAttributesToSVGElement.js b/plugins/addAttributesToSVGElement.js
new file mode 100644
index 0000000..9b97c95
--- /dev/null
+++ b/plugins/addAttributesToSVGElement.js
@@ -0,0 +1,57 @@
+'use strict';
+
+exports.type = 'full';
+
+exports.active = false;
+
+exports.description = 'adds attributes to an outer <svg> element';
+
+var ENOCLS = 'Error in plugin "addAttributesToSVGElement": absent parameters.\n\
+It should have a list of classes in "attributes" or one "attribute".\n\
+Config example:\n\n\
+\
+plugins:\n\
+- addAttributesToSVGElement:\n\
+    attribute: "mySvg"\n\n\
+\
+plugins:\n\
+- addAttributesToSVGElement:\n\
+    attributes: ["mySvg", "size-big"]\n';
+
+/**
+ * Add attributes to an outer <svg> element. Example config:
+ *
+ * plugins:
+ * - addAttributesToSVGElement:
+ *     attribute: 'data-icon'
+ *
+ * plugins:
+ * - addAttributesToSVGElement:
+ *     attributes: ['data-icon', 'data-disabled']
+ *
+ * @author April Arcus
+ */
+exports.fn = function(data, params) {
+    if (!params || !(Array.isArray(params.attributes) && params.attributes.some(String) || params.attribute)) {
+        console.error(ENOCLS);
+        return data;
+    }
+
+    var attributes = params.attributes || [ params.attribute ],
+        svg = data.content[0];
+
+    if (svg.isElem('svg')) {
+        attributes.forEach(function (attribute) {
+            if (!svg.hasAttr(attribute)) {
+                svg.addAttr({
+                    name: attribute,
+                    prefix: '',
+                    local: attribute
+                });
+            }
+        });
+    }
+
+    return data;
+
+};
diff --git a/test/plugins/addAttributesToSVGElement.01.svg b/test/plugins/addAttributesToSVGElement.01.svg
new file mode 100644
index 0000000..d159af6
--- /dev/null
+++ b/test/plugins/addAttributesToSVGElement.01.svg
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+    test
+</svg>
+
+@@@
+
+<svg xmlns="http://www.w3.org/2000/svg" data-icon className={classes}>
+    test
+</svg>
+
+@@@
+
+{"attributes":["data-icon","className={classes}"]}
diff --git a/test/plugins/addAttributesToSVGElement.02.svg b/test/plugins/addAttributesToSVGElement.02.svg
new file mode 100644
index 0000000..79bc701
--- /dev/null
+++ b/test/plugins/addAttributesToSVGElement.02.svg
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+    test
+</svg>
+
+@@@
+
+<svg xmlns="http://www.w3.org/2000/svg" data-icon>
+    test
+</svg>
+
+@@@
+
+{"attribute":"data-icon"}