Fixes #692 - edge case in URL quoting.

When a SVG contains brackets it should always be quoted.

diff --git a/History.md b/History.md
index fe9ac29..23c0db2 100644 (file)
--- a/History.md
+++ b/History.md
@@ -6,6 +6,7 @@
 [3.4.7 / 2015-xx-xx](https://github.com/jakubpawlowicz/clean-css/compare/v3.4.6...3.4)
 ==================
 
+* Fixed issue [#692](https://github.com/jakubpawlowicz/clean-css/issues/692) - edge case in URL quoting.
 * Fixed issue [#695](https://github.com/jakubpawlowicz/clean-css/issues/695) - shorthand overriding edge case.
 * Fixed issue [#699](https://github.com/jakubpawlowicz/clean-css/issues/699) - IE9 transparent hack.
 

diff --git a/lib/urls/rewrite.js b/lib/urls/rewrite.js
index a469473..0f5552b 100644 (file)
--- a/lib/urls/rewrite.js
+++ b/lib/urls/rewrite.js
@@ -84,7 +84,7 @@ function quoteFor(url) {
     return '"';
   else if (url.indexOf('"') > -1)
     return '\'';
-  else if (/\s/.test(url))
+  else if (/\s/.test(url) || /[\(\)]/.test(url))
     return '\'';
   else
     return '';

diff --git a/test/binary-test.js b/test/binary-test.js
index b743354..9b68076 100644 (file)
--- a/test/binary-test.js
+++ b/test/binary-test.js
@@ -272,6 +272,14 @@ vows.describe('./bin/cleancss')
       })
     }
   })
+  .addBatch({
+    'import rebasing': binaryContext('test/fixtures/partials/quoted-svg.css', {
+      'should keep quoting intact': function (error, stdout) {
+        assert.include(stdout, 'div{background:url(\'data:image');
+        assert.include(stdout, 'svg%3E\')}');
+      }
+    })
+  })
   .addBatch({
     'complex import and url rebasing': {
       'absolute': binaryContext('-r ./test/fixtures/129-assets ./test/fixtures/129-assets/assets/ui.css', {

diff --git a/test/fixtures/partials/quoted-svg.css b/test/fixtures/partials/quoted-svg.css
new file mode 100644 (file)
index 0000000..85ac44b
--- /dev/null
+++ b/test/fixtures/partials/quoted-svg.css
@@ -0,0 +1,3 @@
+div {
+  background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmD%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%20overflow%3D%22visible%22%3E%3Cdefs%3E%3Cellipse%20id%3D%22a%22%20cx%3D%2250%22%20cy%3D%2250%22%20rx%3D%2250%22%20ry%3D%2250%22%2F%3E%3C%2Fdefs%3E%3Cuse%20xlink%3Ahref%3D%22%23a%22%20overflow%3D%22visible%22%20fill%3D%22%2300f%22%2F%3E%3CclipPath%20id%3D%22b%22%3E%3Cuse%20xlink%3Ahref%3D%22%23a%22%20overflow%3D%22visible%22%2F%3E%3C%2FclipPath%3E%3Cg%20clip-path%3D%22url(%23b)%22%3E%3Cpath%20d%3D%22M0%20100h50V50H0z%22%20fill%3D%22%230f0%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
+}

diff --git a/test/integration-test.js b/test/integration-test.js
index 8897ffb..ed02c42 100644 (file)
--- a/test/integration-test.js
+++ b/test/integration-test.js
@@ -1359,13 +1359,13 @@ vows.describe('integration tests')
         '@font-face{src:url("/Helvetica Neue.eot")}',
         '@font-face{src:url(\'/Helvetica Neue.eot\')}'
       ],
-      'keep SVG data URI unchanged for background-uri': [
-        'div{background-image:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20transform%3D%22translate(2%202)%22%2F%3E%3C%2Fsvg%3E)}',
-        'div{background-image:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20transform%3D%22translate(2%202)%22%2F%3E%3C%2Fsvg%3E)}'
+      'keep SVG data URI unchanged': [
+        'div{background:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%2Fsvg%3E)}',
+        'div{background:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%2Fsvg%3E)}'
       ],
-      'keep SVG data URI unchanged1 for background': [
+      'quotes SVG data URI if with parentheses': [
         'div{background:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20transform%3D%22translate(2%202)%22%2F%3E%3C%2Fsvg%3E) bottom left}',
-        'div{background:url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20transform%3D%22translate(2%202)%22%2F%3E%3C%2Fsvg%3E) bottom left}'
+        'div{background:url(\'data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20transform%3D%22translate(2%202)%22%2F%3E%3C%2Fsvg%3E\') bottom left}'
       ]
     }, { root: process.cwd(), relativeTo: process.cwd() })
   )