grunt-svgstore - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

Gruntfile.js

@@ -70,2 +70,9 @@ /*
         },
+      },
+
+      withurlref: {
+        options:{},
+        files: {
+          'tmp/withurlref.svg': ['test/fixtures/element.svg']
+        }
       }
@@ -72,0 +79,0 @@ },

package.json

 {
   "name": "grunt-svgstore",
   "description": "Merge SVGs from a folder.",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "homepage": "https://github.com/FWeinb/grunt-svgstore",
@@ -6,0 +6,0 @@ "author": {

README.md

@@ -1,2 +0,2 @@
-# grunt-svgstore
+# grunt-svgstore [![NPM version](https://badge.fury.io/js/grunt-svgstore.svg)](http://badge.fury.io/js/grunt-svgstore) [![Build Status](https://travis-ci.org/FWeinb/grunt-svgstore.svg?branch=master)](https://travis-ci.org/FWeinb/grunt-svgstore)
 
@@ -117,4 +117,5 @@ > Merge SVGs from a folder.
 
+  * 0.0.4 Fixed issue with referencing ids with `url()` (fix [#12](https://github.com/FWeinb/grunt-svgstore/issues/12))
   * 0.0.3 Added `options.formatting` to format svg via [js-beautify](https://github.com/einars/js-beautify)
   * 0.0.2 Fixed npm dependencys
   * 0.0.1 Inital release

tasks/svgstore.js

@@ -23,2 +23,5 @@ /*
 
+  // Matching an url() reference. To correct references broken by making ids unquie to the source svg
+  var urlPattern = /url\(\s*#([^ ]+?)\s*\)/g;
+
   // Please see the Grunt documentation for more information regarding task
@@ -57,8 +60,31 @@ // creation: http://gruntjs.com/creating-tasks
 
+        // Map to store references from id to uniqueId + id;
+        var mappedIds = {};
+
         // Make IDs unique
         $('[id]').each(function(){
           var $elem = $(this);
-          $elem.attr('id', uniqueId + $elem.attr('id'));
+          var id = $elem.attr('id');
+          var newId = uniqueId + id;
+          mappedIds[id] = newId;
+          $elem.attr('id', newId);
         });
 
+        // Search for an url() reference in every attribute of every tag
+        // replace the id with the unique one.
+        $('*').each(function(){
+          for ( var attr in this[0].attribs){
+            var value = this[0].attribs[attr];
+            var match;
+            while ( ( match = urlPattern.exec(value)) !== null){
+              if ( mappedIds[match[1]] !== undefined) {
+                value = value.replace(match[0], 'url(#' + mappedIds[match[1]] + ')');
+              } else {
+                grunt.log.warn('Can\'t reference to id "' + match[1] + '" from attribute "' + attr + '" in "' + this[0].name + '" because it is not defined.');
+              }
+            }
+            this[0].attribs[attr] = value;
+          }
+        });
+
         var filename  = path.basename(filepath, '.svg'),
@@ -74,3 +100,2 @@ $svg      = $('svg'),
          resultStr =  $svg.html();
-
         } else { // Wrap the SVG in a <g>-Tag
@@ -86,3 +111,3 @@ resultStr =  '<g>' + $svg.html() + '</g>';
 
-        // Insert in resulting SVG
+        // Append to resulting SVG
         $resultDefs.append( $res.html() );
@@ -89,0 +114,0 @@

test/svgstore_test.js

@@ -70,3 +70,13 @@ 'use strict';
     test.done();
+  },
+
+  with_url_ref: function(test){
+    test.expect(1);
+
+    var actual = grunt.file.read('tmp/withurlref.svg');
+    var expected = grunt.file.read('test/expected/withurlref');
+    test.equal(actual, expected, 'should keep links between id and url() intact');
+
+    test.done();
   }
 };

No alert changes

Improved metrics

Total package byte prevSize

47398

increased by6.85%

Number of package files

27

increased by12.5%

Lines of code

243

increased by17.39%

Number of lines in readme file

121

increased by0.83%

No dependency changes