fix: don't handle empty @import and url() (#513)

webpack-contrib · Apr 26, 2017 · 868fc94 · 868fc94
1 parent 06d27a1
commit 868fc94
Show file tree

Hide file tree

Showing 3 changed files with 81 additions and 9 deletions.
diff --git a/lib/processCss.js b/lib/processCss.js
@@ -49,6 +49,9 @@ var parserPlugin = postcss.plugin("css-loader-parser", function(options) {
 				} else if(url.type === "string") {
 					url = url.value;
 				} else throw rule.error("Unexpected format" + rule.params);
+				if (!url.replace(/\s/g, '').length) {
+					return;
+				}
 				values.nodes[0].nodes.shift();
 				var mediaQuery = Tokenizer.stringifyValues(values);
 				if(loaderUtils.isUrlRequest(url, options.root) && options.mode === "global") {
@@ -101,7 +104,7 @@ var parserPlugin = postcss.plugin("css-loader-parser", function(options) {
 					}
 					break;
 				case "url":
-					if (options.url && !/^#/.test(item.url) && loaderUtils.isUrlRequest(item.url, options.root)) {
+					if (options.url && item.url.replace(/\s/g, '').length && !/^#/.test(item.url) && loaderUtils.isUrlRequest(item.url, options.root)) {
 						// Don't remove quotes around url when contain space
 						if (item.url.indexOf(" ") === -1) {
 							item.stringType = "";
@@ -160,9 +163,9 @@ module.exports = function processCss(inputSource, inputMap, options, callback) {
 			mode: options.mode,
 			rewriteUrl: function(global, url) {
 				if(parserOptions.url){
-					url = url.trim(" ");
+                    url = url.trim();
 
-					if(!loaderUtils.isUrlRequest(url, root)) {
+					if(!url.replace(/\s/g, '').length || !loaderUtils.isUrlRequest(url, root)) {
 						return url;
 					}
 					if(global) {

diff --git a/test/importTest.js b/test/importTest.js
@@ -15,12 +15,33 @@ describe("import", function() {
 	], "", {
 		"./test.css": [[2, ".test{a: b}", ""]]
 	});
+    test("import empty url", "@import url();\n.class { a: b c d; }", [
+        [1, "@import url();\n.class { a: b c d; }", ""]
+    ], "");
+    test("import empty url with quotes", "@import url('');\n.class { a: b c d; }", [
+        [1, "@import url('');\n.class { a: b c d; }", ""]
+    ], "");
 	test("import with string", "@import \"test.css\";\n.class { a: b c d; }", [
 		[2, ".test{a: b}", ""],
 		[1, ".class { a: b c d; }", ""]
 	], "", {
 		"./test.css": [[2, ".test{a: b}", ""]]
 	});
+	test("import with empty string", "@import \"\";\n.class { a: b c d; }", [
+		[1, "@import \"\";\n.class { a: b c d; }", ""]
+	], "");
+	test("import with string contain spaces", "@import \"   \";\n.class { a: b c d; }", [
+		[1, "@import \"   \";\n.class { a: b c d; }", ""]
+	], "");
+	test("import with string contain newline", "@import \"\n\";\n.class { a: b c d; }", [
+		[1, "@import \"\n\";\n.class { a: b c d; }", ""]
+	], "");
+	test("import with string contain CRLF", "@import \"\r\n\";\r\n.class { a: b c d; }", [
+		[1, "@import \"\r\n\";\r\n.class { a: b c d; }", ""]
+	], "");
+	test("import with string contain tab", "@import \"\t\";\n.class { a: b c d; }", [
+		[1, "@import \"\t\";\n.class { a: b c d; }", ""]
+	], "");
 	test("import 2", "@import url('test.css');\n.class { a: b c d; }", [
 		[2, ".test{a: b}", "screen"],
 		[1, ".class { a: b c d; }", ""]

diff --git a/test/urlTest.js b/test/urlTest.js
@@ -15,12 +15,12 @@ describe("url", function() {
 	test("background img 4", ".class { background: green url( img.png ) xyz }", [
 		[1, ".class { background: green url({./img.png}) xyz }", ""]
 	]);
-    test("background img contain space in name", ".class { background: green url( \"img img.png\" ) xyz }", [
-        [1, ".class { background: green url(\"{./img img.png}\") xyz }", ""]
-    ]);
-    test("background 2 img contain space in name", ".class { background: green url( 'img img.png' ) xyz }", [
-        [1, ".class { background: green url('{./img img.png}') xyz }", ""]
-    ]);
+	test("background img contain space in name", ".class { background: green url( \"img img.png\" ) xyz }", [
+		[1, ".class { background: green url(\"{./img img.png}\") xyz }", ""]
+	]);
+	test("background 2 img contain space in name", ".class { background: green url( 'img img.png' ) xyz }", [
+		[1, ".class { background: green url('{./img img.png}') xyz }", ""]
+	]);
 	test("background img absolute", ".class { background: green url(/img.png) xyz }", [
 		[1, ".class { background: green url(/img.png) xyz }", ""]
 	]);
@@ -79,6 +79,30 @@ describe("url", function() {
 	test("-webkit-image-set", ".a { background-image: -webkit-image-set(url('url1x.png') 1x, url('url2x.png') 2x) }", [
 		[1, ".a { background-image: -webkit-image-set(url({./url1x.png}) 1x, url({./url2x.png}) 2x) }", ""]
 	]);
+	test("empty url", ".class { background: green url() xyz }", [
+		[1, ".class { background: green url() xyz }", ""]
+	]);
+	test("empty url with quotes", ".class { background: green url('') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	]);
+	test("empty url with spaces and quotes", ".class { background: green url('   ') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	]);
+	test("empty url with newline and quotes", ".class { background: green url('\n') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	]);
+	test("empty url with CRLF and quotes", ".class { background: green url('\r\n') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	]);
+	test("empty url with tab and quotes", ".class { background: green url('\t') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	]);
+	test("external absolute url", ".class { background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", [
+		[1, ".class { background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", ""]
+	]);
+	test("external schema-less url", ".class { background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", [
+		[1, ".class { background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", ""]
+	]);
 
 	test("background img with url", ".class { background: green url( \"img.png\" ) xyz }", [
 		[1, ".class { background: green url( \"img.png\" ) xyz }", ""]
@@ -141,4 +165,28 @@ describe("url", function() {
 	test("keyframe background img with url", "@keyframes anim { background: green url('img.png') xyz }", [
 		[1, "@keyframes anim { background: green url('img.png') xyz }", ""]
 	], "?-url");
+	test("empty url", ".class { background: green url() xyz }", [
+		[1, ".class { background: green url() xyz }", ""]
+	], "?-url");
+	test("empty url with quotes", ".class { background: green url('') xyz }", [
+		[1, ".class { background: green url('') xyz }", ""]
+	], "?-url");
+	test("empty url with spaces and quotes", ".class { background: green url('   ') xyz }", [
+		[1, ".class { background: green url('   ') xyz }", ""]
+	], "?-url");
+	test("empty url with newline and quotes", ".class { background: green url('\n') xyz }", [
+		[1, ".class { background: green url('\n') xyz }", ""]
+	], "?-url");
+	test("empty url with CRLF and quotes", ".class { background: green url('\r\n') xyz }", [
+		[1, ".class { background: green url('\r\n') xyz }", ""]
+	], "?-url");
+	test("empty url with tab and quotes", ".class { background: green url('\t') xyz }", [
+		[1, ".class { background: green url('\t') xyz }", ""]
+	], "?-url");
+	test("external absolute url", ".class { background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", [
+		[1, ".class { background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", ""]
+	], "?-url");
+	test("external schema-less url", ".class { background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", [
+		[1, ".class { background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz }", ""]
+	], "?-url");
 });