rebase and test

test/__snapshots__/ConfigCacheTestCases.longtest.js.snap

@@ -4184,7 +4184,7 @@ Object {
 }
 `;
 
-exports[`ConfigCacheTestCases css urls-css-filename exported tests should be able to handle styles in div.css 1`] = `
+exports[`ConfigCacheTestCases css urls exported tests should be able to handle styles in div.css 2`] = `
 Object {
   "--foo": " url(../../asset/img.09a1a1112c577c279435.png)",
   "--foo-bar": " \\"http://www.example.com/pinkish.gif\\"",

test/configCases/css/urls-css-filename/index.css

@@ -0,0 +1,7 @@
+@import "./nested/index.css";
+
+h1 {
+  same-dir: url('./img1.png');
+  nested-dir: url('./nested/img2.png');
+  nested-nested-dir: url('./nested/nested/img3.png');
+}

test/configCases/css/urls-css-filename/index.js

@@ -1,18 +1,22 @@
-const testCase = (tagName, impFn) => {
-	it(`should be able to handle styles in ${tagName}.css`, done => {
-		const element = document.createElement(tagName);
-		document.body.appendChild(element);
-		impFn().then(x => {
-			try {
-				expect(x).toEqual(nsObj({}));
-				const style = getComputedStyle(element);
-				expect(style).toMatchSnapshot();
-				done();
-			} catch (e) {
-				done(e);
-			}
-		}, done);
-	});
-};
-
-testCase("div", () => import("./spacing.css"));
+it(`should generate correct url public path with css filename`, done => {
+	const h1 = document.createElement('h1');
+	document.body.appendChild(h1);
+	const h2 = document.createElement('h2');
+	document.body.appendChild(h1);
+	const h3 = document.createElement('h3');
+	document.body.appendChild(h1);
+	import("./index.css").then(x => {
+		try {
+			expect(x).toEqual(nsObj({}));
+			const style1 = getComputedStyle(h1);
+			expect(style1).toMatchSnapshot();
+			const style2 = getComputedStyle(h2);
+			expect(style2).toMatchSnapshot();
+			const style3 = getComputedStyle(h3);
+			expect(style3).toMatchSnapshot();
+			done();
+		} catch (e) {
+			done(e);
+		}
+	}, done);
+});

test/configCases/css/urls-css-filename/nested.css

@@ -1,5 +0,0 @@
-@import url("#test");
-
-.nested {
-	background: url('./img.png');
-}

test/configCases/css/urls-css-filename/nested/index.css

@@ -0,0 +1,7 @@
+@import "./nested/index.css";
+
+h2 {
+  same-dir: url('./img2.png');
+  nested-dir: url('./nested/img3.png');
+  outer-dir: url('../img1.png');
+}

test/configCases/css/urls-css-filename/nested/nested/index.css

@@ -0,0 +1,5 @@
+h3 {
+  same-dir: url('./img3.png');
+  outer-dir: url('../img2.png');
+  outer-outer-dir: url('../../img1.png');
+}

test/configCases/css/urls-css-filename/node_modules/package/package.json

@@ -1,4 +0,0 @@
-{
-  "name": "package",
-  "version": "1.0.0"
-}

test/configCases/css/urls-css-filename/webpack.config.js

@@ -1,16 +1,11 @@
 /** @type {import("../../../../").Configuration} */
-module.exports = {
+const common = {
 	target: "web",
 	mode: "development",
 	devtool: false,
 	experiments: {
 		css: true
 	},
-	output: {
-		cssFilename: "css/[name].css",
-		cssChunkFilename: "css/async/[name].css",
-		assetModuleFilename: "asset/[name].[hash][ext][query][fragment]"
-	},
 	optimization: {
 		splitChunks: {
 			cacheGroups: {
@@ -30,3 +25,23 @@ module.exports = {
 		}
 	}
 };
+
+/** @type {import("../../../../").Configuration} */
+module.exports = [
+	{
+		...common,
+		output: {
+			publicPath: "auto",
+			cssFilename: "bundle0/css/[name].css",
+			assetModuleFilename: "bundle0/asset/[name][ext]"
+		}
+	},
+	{
+		...common,
+		output: {
+			publicPath: "https://test.cases/path/",
+			cssFilename: "bundle1/css/[name].css",
+			assetModuleFilename: "bundle1/asset/[name][ext]"
+		}
+	}
+];