Fix Polymer#5693: CSS url parameter issue when it includes quotes

Author: jpradelle

lib/utils/resolve-url.js

@@ -77,6 +77,10 @@ export function resolveUrl(url, baseURI) {
  */
 export function resolveCss(cssText, baseURI) {
   return cssText.replace(CSS_URL_RX, function(m, pre, url, post) {
+    // No resolution for data: urls
+    if (url.match(/^["']?data:/)) {
+      return pre + url + post;
+    }
     return pre + '\'' +
       resolveUrl(url.replace(/["']/g, ''), baseURI) +
       '\'' + post;

test/unit/resolveurl.html

@@ -30,6 +30,9 @@
         :host {
           background: url('foo.png');
         }
+        .inline-svg {
+          background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10'><circle cx='5' cy='5' r='4'/></svg>");
+        }
       </style>
       <img id="root" src$="[[rootPath]]foo.png">
       <img id="import" src$="[[importPath]]foo.png">
@@ -125,6 +128,7 @@
     var matchImport = /defineImport\//i;
     var style = el.shadowRoot.querySelector('style') || document.querySelector('style[scope=x-late]');
     assert.match(style.textContent, matchImport);
+    assert.match(style.textContent, /url\("data:image\/svg\+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' width='10' height='10'><circle cx='5' cy='5' r='4'\/><\/svg>"\)/);
     assert.match(el.$.import.getAttribute('src'), matchImport);
     assert.match(el.$.root.getAttribute('src'), matchRoot);
     document.body.removeChild(el);