fix: css experiment detection (#1067)

webpack-contrib · Jan 10, 2024 · 82f4a47 · 82f4a47
1 parent 98acf2b
commit 82f4a47
Show file tree

Hide file tree

Showing 20 changed files with 2,841 additions and 19,153 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -67,7 +67,7 @@
     "bootstrap": "^4.6.2",
     "cross-env": "^7.0.3",
     "cspell": "^6.31.1",
-    "css-loader": "^6.7.4",
+    "css-loader": "^6.9.0",
     "del": "^6.0.0",
     "del-cli": "^4.0.0",
     "es-check": "^7.1.0",

diff --git a/src/index.js b/src/index.js
@@ -301,7 +301,9 @@ class MiniCssExtractPlugin {
       updateHash(hash, context) {
         super.updateHash(hash, context);
 
-        hash.update(this.buildInfo.hash);
+        hash.update(
+          /** @type {NonNullable<Module["buildInfo"]>} */ (this.buildInfo).hash
+        );
       }
 
       /**
@@ -825,8 +827,11 @@ class MiniCssExtractPlugin {
           const {
             runtimeTemplate,
             outputOptions: { crossOriginLoading },
-          } = this.compilation;
-          const chunkMap = getCssChunkObject(chunk, this.compilation);
+          } = /** @type {Compilation} */ (this.compilation);
+          const chunkMap = getCssChunkObject(
+            /** @type {Chunk} */ (chunk),
+            /** @type {Compilation} */ (this.compilation)
+          );
 
           const withLoading =
             runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers) &&
@@ -953,7 +958,7 @@ class MiniCssExtractPlugin {
                   "var installedCssChunks = {",
                   Template.indent(
                     /** @type {string[]} */
-                    (chunk.ids)
+                    (/** @type {Chunk} */ (chunk).ids)
                       .map((id) => `${JSON.stringify(id)}: 0`)
                       .join(",\n")
                   ),
@@ -1162,7 +1167,10 @@ class MiniCssExtractPlugin {
           })
           // eslint-disable-next-line no-undefined
           .filter((item) => item.index !== undefined)
-          .sort((a, b) => b.index - a.index)
+          .sort(
+            (a, b) =>
+              /** @type {number} */ (b.index) - /** @type {number} */ (a.index)
+          )
           .map((item) => item.module);
 
         for (let i = 0; i < sortedModules.length; i++) {

diff --git a/src/loader.js b/src/loader.js
@@ -75,7 +75,10 @@ function pitch(request) {
     this._compiler.options.experiments &&
     this._compiler.options.experiments.css &&
     this._module &&
-    this._module.type === "css"
+    (this._module.type === "css" ||
+      this._module.type === "css/auto" ||
+      this._module.type === "css/global" ||
+      this._module.type === "css/module")
   ) {
     this.emitWarning(
       new Error(
@@ -373,6 +376,7 @@ function pitch(request) {
   const { NodeTemplatePlugin } = webpack.node;
   const { NodeTargetPlugin } = webpack.node;
 
+  // @ts-ignore
   new NodeTemplatePlugin(outputOptions).apply(childCompiler);
   new NodeTargetPlugin().apply(childCompiler);
 
@@ -517,7 +521,10 @@ function loader(content) {
     this._compiler.options.experiments &&
     this._compiler.options.experiments.css &&
     this._module &&
-    this._module.type === "css"
+    (this._module.type === "css" ||
+      this._module.type === "css/auto" ||
+      this._module.type === "css/global" ||
+      this._module.type === "css/module")
   ) {
     return content;
   }

diff --git a/test/TestCache.test.js b/test/TestCache.test.js
@@ -94,9 +94,6 @@ describe("TestCache", () => {
               "static/react.svg",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 
@@ -192,9 +189,6 @@ describe("TestCache", () => {
               "static/react.svg",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 
@@ -297,9 +291,6 @@ describe("TestCache", () => {
               "main.js",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 
@@ -402,9 +393,6 @@ describe("TestCache", () => {
               "main.js",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 
@@ -428,7 +416,7 @@ describe("TestCache", () => {
     );
     const fileSystemCacheDirectory = path.resolve(
       __dirname,
-      "./js/.cache/type-filesystem"
+      "./js/.cache/type-filesystem-asset-modules"
     );
 
     await del([outputPath, fileSystemCacheDirectory]);
@@ -513,9 +501,6 @@ describe("TestCache", () => {
               "static/react.svg",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 
@@ -539,7 +524,7 @@ describe("TestCache", () => {
     );
     const fileSystemCacheDirectory = path.resolve(
       __dirname,
-      "./js/.cache/type-filesystem"
+      "./js/.cache/type-filesystem-file-loader"
     );
 
     await del([outputPath, fileSystemCacheDirectory]);
@@ -624,9 +609,6 @@ describe("TestCache", () => {
               "static/react.svg",
             ]
           `);
-          expect(
-            Array.from(stats.compilation.emittedAssets).sort()
-          ).toMatchInlineSnapshot(`Array []`);
           expect(stats.compilation.warnings).toHaveLength(0);
           expect(stats.compilation.errors).toHaveLength(0);
 

diff --git a/test/cases/build-in-css-support/webpack.config.js b/test/cases/build-in-css-support/webpack.config.js
@@ -19,7 +19,7 @@ module.exports = {
   },
   plugins: [
     new Self({
-      filename: "[name].css",
+      filename: "[name].extract.css",
     }),
   ],
 };
diff --git a/...5-importModule/0.db7007e0f10c80a36b7a.css → ...5-importModule/0.55be87a9aa9996fc905c.css b/...5-importModule/0.db7007e0f10c80a36b7a.css → ...5-importModule/0.55be87a9aa9996fc905c.css
diff --git a/...k-5-importModule/db7007e0f10c80a36b7a.css → ...k-5-importModule/55be87a9aa9996fc905c.css b/...k-5-importModule/db7007e0f10c80a36b7a.css → ...k-5-importModule/55be87a9aa9996fc905c.css
diff --git a/test/cases/chunkFilename-fullhash/expected/webpack-5-importModule/main.js b/test/cases/chunkFilename-fullhash/expected/webpack-5-importModule/main.js
@@ -73,7 +73,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 	
 /******/ 	/* webpack/runtime/getFullHash */
 /******/ 	(() => {
-/******/ 		__webpack_require__.h = () => ("db7007e0f10c80a36b7a")
+/******/ 		__webpack_require__.h = () => ("55be87a9aa9996fc905c")
 /******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/global */
@@ -118,6 +118,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/...cted/webpack-5/0.106784193c04ad826b7a.css → ...cted/webpack-5/0.4a73d63c8c2357971fc6.css b/...cted/webpack-5/0.106784193c04ad826b7a.css → ...cted/webpack-5/0.4a73d63c8c2357971fc6.css
diff --git a/...pected/webpack-5/106784193c04ad826b7a.css → ...pected/webpack-5/4a73d63c8c2357971fc6.css b/...pected/webpack-5/106784193c04ad826b7a.css → ...pected/webpack-5/4a73d63c8c2357971fc6.css
diff --git a/test/cases/chunkFilename-fullhash/expected/webpack-5/main.js b/test/cases/chunkFilename-fullhash/expected/webpack-5/main.js
@@ -73,7 +73,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 	
 /******/ 	/* webpack/runtime/getFullHash */
 /******/ 	(() => {
-/******/ 		__webpack_require__.h = () => ("106784193c04ad826b7a")
+/******/ 		__webpack_require__.h = () => ("4a73d63c8c2357971fc6")
 /******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/global */
@@ -118,6 +118,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/hmr/expected/main.js b/test/cases/hmr/expected/main.js
@@ -487,6 +487,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/insert-function/expected/main.js b/test/cases/insert-function/expected/main.js
@@ -102,6 +102,7 @@
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/insert-string/expected/main.js b/test/cases/insert-string/expected/main.js
@@ -102,6 +102,7 @@
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/insert-undefined/expected/main.js b/test/cases/insert-undefined/expected/main.js
@@ -102,6 +102,7 @@
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/no-runtime/expected/main.js b/test/cases/no-runtime/expected/main.js
@@ -104,6 +104,7 @@ __webpack_require__.r(__webpack_exports__);
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];

diff --git a/test/cases/publicpath-function-2/expected/webpack-5/nested/again/style.css b/test/cases/publicpath-function-2/expected/webpack-5/nested/again/style.css
@@ -1,5 +1,5 @@
 body {
   background: green;
-  background-image: url(http://example.com/0ecdbda184223cdb3d36/c9e192c015437a21dea1.svg);
+  background-image: url(http://example.com/b284f5dc5823af841415/c9e192c015437a21dea1.svg);
 }
 
diff --git a/test/cases/publicpath-function-2/expected/webpack-5/nested/style.css b/test/cases/publicpath-function-2/expected/webpack-5/nested/style.css
@@ -1,5 +1,5 @@
 body {
   background: red;
-  background-image: url(http://example.com/398b3f33c59de2ae9221/c9e192c015437a21dea1.svg);
+  background-image: url(http://example.com/405f78bf9e607b76da4a/c9e192c015437a21dea1.svg);
 }
 
diff --git a/test/cases/runtime/expected/runtime~main.js b/test/cases/runtime/expected/runtime~main.js
@@ -177,6 +177,7 @@
 /******/ 					script.setAttribute("nonce", __webpack_require__.nc);
 /******/ 				}
 /******/ 		
+/******/ 		
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];