Merge pull request #16903 from janlent1/fixruntimeissue

Fix runtime generation bug

lib/dependencies/CssUrlDependency.js

@@ -108,7 +108,7 @@ CssUrlDependency.Template = class CssUrlDependencyTemplate extends (
 	apply(
 		dependency,
 		source,
-		{ runtime, moduleGraph, runtimeTemplate, codeGenerationResults }
+		{ moduleGraph, runtimeTemplate, codeGenerationResults }
 	) {
 		const dep = /** @type {CssUrlDependency} */ (dependency);
 
@@ -119,7 +119,6 @@ CssUrlDependency.Template = class CssUrlDependencyTemplate extends (
 				newValue = cssEscapeString(
 					runtimeTemplate.assetUrl({
 						publicPath: "",
-						runtime,
 						module: moduleGraph.getModule(dep),
 						codeGenerationResults
 					})
@@ -129,7 +128,6 @@ CssUrlDependency.Template = class CssUrlDependencyTemplate extends (
 				newValue = `url(${cssEscapeString(
 					runtimeTemplate.assetUrl({
 						publicPath: "",
-						runtime,
 						module: moduleGraph.getModule(dep),
 						codeGenerationResults
 					})

test/configCases/css/runtimeissue/asyncChunk.js

@@ -0,0 +1,2 @@
+import * as style from "./styles.js";
+export default style;

test/configCases/css/runtimeissue/asyncChunk2.js

@@ -0,0 +1,2 @@
+import * as style from "./styles.js";
+export default style;

test/configCases/css/runtimeissue/entry1.js

@@ -0,0 +1,14 @@
+const img = new URL("./img.png", import.meta.url);
+
+it("should allow to create css modules", done => {
+	import("./asyncChunk").then(({ default: x }) => {
+		try {
+			expect(img.toString()).toBe("https://test.cases/path/img.png");
+			expect(x.default.class).toEqual("./test.module.css-class");
+		} catch (e) {
+			return done(e);
+		}
+
+		done();
+	}, done);
+});

test/configCases/css/runtimeissue/entry2.js

@@ -0,0 +1,14 @@
+const img = new URL("./img.png", import.meta.url);
+
+it("should allow to create css modules", done => {
+	import("./asyncChunk2").then(({ default: x }) => {
+		try {
+			expect(img.toString()).toBe("https://test.cases/path/img.png");
+			expect(x.default.class).toEqual("./test.module.css-class");
+		} catch (e) {
+			return done(e);
+		}
+
+		done();
+	}, done);
+});

test/configCases/css/runtimeissue/styles.js

@@ -0,0 +1,2 @@
+import * as style from "./test.module.css";
+export default style;

test/configCases/css/runtimeissue/test.config.js

@@ -0,0 +1,21 @@
+module.exports = {
+	moduleScope(scope) {
+		const link1 = scope.window.document.createElement("link");
+		link1.rel = "stylesheet";
+		link1.href = "asyncChunk_js.css";
+		scope.window.document.head.appendChild(link1);
+		const link2 = scope.window.document.createElement("link");
+		link2.rel = "stylesheet";
+		link2.href = "asyncChunk_js2.css";
+		scope.window.document.head.appendChild(link2);
+	},
+	findBundle: function (i, options) {
+		return [
+			"./common-share_js-img_png.js",
+			"./asyncChunk_js.js",
+			"./main.js",
+			"./secondMain.js",
+			"./asyncChunk2_js.js"
+		];
+	}
+};

test/configCases/css/runtimeissue/test.module.css

@@ -0,0 +1,3 @@
+.class {
+	background-image: url('./img.png');
+}

test/configCases/css/runtimeissue/webpack.config.js

@@ -0,0 +1,34 @@
+/** @type {import("../../../../").Configuration} */
+module.exports = {
+	target: "web",
+	mode: "development",
+	experiments: {
+		css: true
+	},
+	entry: {
+		main: {
+			import: ["./share.js", "./entry1.js"]
+		},
+		secondMain: {
+			import: ["./share.js", "./entry2.js"]
+		}
+	},
+	optimization: {
+		splitChunks: {
+			chunks: "all",
+			cacheGroups: {
+				common: {
+					name: false,
+					chunks: "all",
+					test() {
+						return true;
+					}
+				}
+			}
+		}
+	},
+	output: {
+		filename: "[name].js",
+		assetModuleFilename: "[name][ext]"
+	}
+};