public / html-minifier.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e9697c3)
minify URLs within CSS
authoralexlamsl <alexlamsl@gmail.com>
Thu, 14 Apr 2016 15:35:53 +0000 (23:35 +0800)
committeralexlamsl <alexlamsl@gmail.com>
Thu, 14 Apr 2016 15:42:35 +0000 (23:42 +0800)
fixes #535

src/htmlminifier.js patch | blob | history
tests/minifier.js patch | blob | history

diff --git a/src/htmlminifier.js b/src/htmlminifier.js
index b8a9ec8..1c16cd2 100644 (file)
--- a/src/htmlminifier.js
+++ b/src/htmlminifier.js
@@ -295,7 +295,7 @@ function cleanAttributeValue(tag, attrName, attrValue, options, attrs) {
       attrValue = attrValue.replace(/\s*;$/, '');
     }
     if (options.minifyCSS) {
-      return minifyCSS(attrValue, options.minifyCSS, true);
+      return minifyStyles(attrValue, options, true);
     }
     return attrValue;
   }
@@ -663,6 +663,15 @@ function minifyCSS(text, options, inline) {
   }
 }
 
+function minifyStyles(text, options, inline) {
+  if (options.minifyURLs) {
+    text = text.replace(/(url\s*\(\s*)("|'|)(.*?)\2(\s*\))/ig, function(match, prefix, quote, url, suffix) {
+      return prefix + quote + minifyURLs(url, options.minifyURLs) + quote + suffix;
+    });
+  }
+  return minifyCSS(text, options.minifyCSS, inline);
+}
+
 function uniqueId(value) {
   var id;
   do {
@@ -1077,7 +1086,7 @@ function minify(value, options, partialMarkup) {
         }
       }
       if (options.minifyCSS && isStyleSheet(currentTag, currentAttrs)) {
-        text = minifyCSS(text, options.minifyCSS);
+        text = minifyStyles(text, options);
       }
       if (options.removeOptionalTags && text) {
         // <html> may be omitted if first thing inside is not comment
diff --git a/tests/minifier.js b/tests/minifier.js
index a052d91..9ec6310 100644 (file)
--- a/tests/minifier.js
+++ b/tests/minifier.js
@@ -535,34 +535,34 @@ test('remove CDATA sections from scripts/styles', function() {
   output = '<script>alert(11)</script>';
   equal(minify(input, { minifyJS: true }), output);
 
-  input = '<style><![CDATA[\np.a{backgourd:red}\n]]></style>';
+  input = '<style><![CDATA[\np.a{background:red}\n]]></style>';
   equal(minify(input), input);
-  output = '<style><![CDATA[ p.a{backgourd:red}\n]]></style>';
+  output = '<style><![CDATA[ p.a{background:red}\n]]></style>';
   equal(minify(input, { minifyCSS: true }), output);
 
-  input = '<style><![CDATA[p.b{backgourd:red}]]></style>';
+  input = '<style><![CDATA[p.b{background:red}]]></style>';
   equal(minify(input), input);
-  output = '<style><![CDATA[p.b{backgourd:red}]]></style>';
+  output = '<style><![CDATA[p.b{background:red}]]></style>';
   equal(minify(input, { minifyCSS: true }), output);
 
-  input = '<style><![CDATA[p.c{backgourd:red}\n]]></style>';
+  input = '<style><![CDATA[p.c{background:red}\n]]></style>';
   equal(minify(input), input);
-  output = '<style><![CDATA[p.c{backgourd:red}\n]]></style>';
+  output = '<style><![CDATA[p.c{background:red}\n]]></style>';
   equal(minify(input, { minifyCSS: true }), output);
 
-  input = '<style><![CDATA[\np.d{backgourd:red}]]></style>';
+  input = '<style><![CDATA[\np.d{background:red}]]></style>';
   equal(minify(input), input);
-  output = '<style><![CDATA[ p.d{backgourd:red}]]></style>';
+  output = '<style><![CDATA[ p.d{background:red}]]></style>';
   equal(minify(input, { minifyCSS: true }), output);
 
-  input = '<style><![CDATA[p.e{backgourd:red}\np.f{backgourd:red}\np.g{backgourd:red}]]></style>';
+  input = '<style><![CDATA[p.e{background:red}\np.f{background:red}\np.g{background:red}]]></style>';
   equal(minify(input), input);
-  output = '<style><![CDATA[p.e{backgourd:red}p.f{backgourd:red}p.g{backgourd:red}]]></style>';
+  output = '<style><![CDATA[p.e{background:red}p.f{background:red}p.g{background:red}]]></style>';
   equal(minify(input, { minifyCSS: true }), output);
 
-  input = '<style>p.h{backgourd:red}<![CDATA[\np.i{backgourd:red}\n]]>p.j{backgourd:red}</style>';
+  input = '<style>p.h{background:red}<![CDATA[\np.i{background:red}\n]]>p.j{background:red}</style>';
   equal(minify(input), input);
-  output = '<style>p.h{backgourd:red}<![CDATA[ p.i{backgourd:red}]]>p.j{backgourd:red}</style>';
+  output = '<style>p.h{background:red}<![CDATA[ p.i{background:red}]]>p.j{background:red}</style>';
   equal(minify(input, { minifyCSS: true }), output);
 
   input = '<style>/* <![CDATA[ */p { color: red } // ]]></style>';
@@ -1761,12 +1761,30 @@ test('style attribute minification', function() {
 test('url attribute minification', function() {
   input = '<link rel="stylesheet" href="http://website.com/style.css"><form action="http://website.com/folder/folder2/index.html"><a href="http://website.com/folder/file.html">link</a></form>';
   output = '<link rel="stylesheet" href="/style.css"><form action="folder2/"><a href="file.html">link</a></form>';
-
   equal(minify(input, { minifyURLs: { site: 'http://website.com/folder/' } }), output);
 
   input = '<link rel="canonical" href="http://website.com/">';
+  equal(minify(input, { minifyURLs: { site: 'http://website.com/' } }), input);
 
+  input = '<style>body { background: url(\'http://website.com/bg.png\') }</style>';
   equal(minify(input, { minifyURLs: { site: 'http://website.com/' } }), input);
+  output = '<style>body{background:url(http://website.com/bg.png)}</style>';
+  equal(minify(input, { minifyCSS: true }), output);
+  output = '<style>body{background:url(bg.png)}</style>';
+  equal(minify(input, {
+    minifyCSS: true,
+    minifyURLs: { site: 'http://website.com/' }
+  }), output);
+
+  input = '<style>body { background: url("http://website.com/foo bar/bg.png") }</style>';
+  equal(minify(input, { minifyURLs: { site: 'http://website.com/foo bar/' } }), input);
+  output = '<style>body{background:url("http://website.com/foo bar/bg.png")}</style>';
+  equal(minify(input, { minifyCSS: true }), output);
+  output = '<style>body{background:url(bg.png)}</style>';
+  equal(minify(input, {
+    minifyCSS: true,
+    minifyURLs: { site: 'http://website.com/foo bar/' }
+  }), output);
 });
 
 test('valueless attributes', function() {
@@ -1938,7 +1956,7 @@ test('ignore', function() {
           '<div class="blah" style="color: red">\n   test   <span> <input disabled/>  foo </span>\n\n   </div>';
 
   output = '<div class="blah" style="color: red">\n   test   <span> <input disabled/>  foo </span>\n\n   </div>' +
-          '<div class="blah" style="color: red">test <span><input disabled="disabled"> foo</span></div>';
+           '<div class="blah" style="color: red">test <span><input disabled="disabled"> foo</span></div>';
 
   equal(minify(input, { collapseWhitespace: true }), output);
 
Highly configurable, well-tested, JavaScript-based HTML minifier (uses NDCODE dependencies).