fix: respect infastructureLogging.level for client.logging

lib/Server.js

@@ -126,12 +126,47 @@ class Server {
     return path.resolve(dir, "node_modules/.cache/webpack-dev-server");
   }
 
-  getCompilerConfigArray() {
-    const compilers = this.compiler.compilers
-      ? this.compiler.compilers
-      : [this.compiler];
+  getCompilerOptions() {
+    if (typeof this.compiler.compilers !== "undefined") {
+      if (this.compiler.compilers.length === 1) {
+        return this.compiler.compilers[0].options;
+      }
+
+      // Configuration with the `devServer` options
+      const compilerWithDevServer = this.compiler.compilers.find(
+        (config) => config.options.devServer
+      );
+
+      if (compilerWithDevServer) {
+        return compilerWithDevServer.options;
+      }
+
+      // Configuration with `web` preset
+      const compilerWithWebPreset = this.compiler.compilers.find(
+        (config) =>
+          (config.options.externalsPresets &&
+            config.options.externalsPresets.web) ||
+          [
+            "web",
+            "webworker",
+            "electron-preload",
+            "electron-renderer",
+            "node-webkit",
+            // eslint-disable-next-line no-undefined
+            undefined,
+            null,
+          ].includes(config.options.target)
+      );
+
+      if (compilerWithWebPreset) {
+        return compilerWithWebPreset.options;
+      }
+
+      // Fallback
+      return this.compiler.compilers[0].options;
+    }
 
-    return compilers.map((compiler) => compiler.options);
+    return this.compiler.options;
   }
 
   // eslint-disable-next-line class-methods-use-this
@@ -142,15 +177,9 @@ class Server {
       this.logger = this.compiler.getInfrastructureLogger("webpack-dev-server");
     }
 
-    // TODO: improve this to not use .find for compiler watchOptions
-    const configArray = this.getCompilerConfigArray();
-    const watchOptionsConfig = configArray.find(
-      (config) => config.watch !== false && config.watchOptions
-    );
-    const watchOptions = watchOptionsConfig
-      ? watchOptionsConfig.watchOptions
-      : {};
-
+    const compilerOptions = this.getCompilerOptions();
+    // TODO remove `{}` after drop webpack v4 support
+    const watchOptions = compilerOptions.watchOptions || {};
     const defaultOptionsForStatic = {
       directory: path.join(process.cwd(), "public"),
       staticOptions: {},
@@ -218,6 +247,13 @@ class Server {
           ...options.client.overlay,
         };
       }
+
+      // Respect infrastructureLogging.level
+      if (typeof options.client.logging === "undefined") {
+        options.client.logging = compilerOptions.infrastructureLogging
+          ? compilerOptions.infrastructureLogging.level
+          : "info";
+      }
     }
 
     if (typeof options.compress === "undefined") {
@@ -493,12 +529,11 @@ class Server {
               return level;
             };
 
-            const configWithDevServer =
-              configArray.find((config) => config.devServer) || configArray[0];
-
             if (typeof proxyOptions.logLevel === "undefined") {
               proxyOptions.logLevel = getLogLevelForProxy(
-                configWithDevServer.infrastructureLogging.level
+                compilerOptions.infrastructureLogging
+                  ? compilerOptions.infrastructureLogging.level
+                  : "info"
               );
             }
 
@@ -707,6 +742,17 @@ class Server {
     this.app = new express();
   }
 
+  getStats(statsObj) {
+    const stats = Server.DEFAULT_STATS;
+    const compilerOptions = this.getCompilerOptions();
+
+    if (compilerOptions.stats && compilerOptions.stats.warningsFilter) {
+      stats.warningsFilter = compilerOptions.stats.warningsFilter;
+    }
+
+    return statsObj.toJson(stats);
+  }
+
   setupHooks() {
     const addHooks = (compiler) => {
       compiler.hooks.invalid.tap("webpack-dev-server", () => {
@@ -1260,13 +1306,16 @@ class Server {
   logStatus() {
     const colorette = require("colorette");
 
-    const getColorsOption = (configArray) => {
-      const statsOption = this.getStatsOption(configArray);
+    const getColorsOption = (compilerOptions) => {
+      let colorsEnabled;
 
-      let colorsEnabled = false;
-
-      if (typeof statsOption === "object" && statsOption.colors) {
-        colorsEnabled = statsOption.colors;
+      if (
+        compilerOptions.stats &&
+        typeof compilerOptions.stats.colors !== "undefined"
+      ) {
+        colorsEnabled = compilerOptions.stats;
+      } else {
+        colorsEnabled = colorette.options.enabled;
       }
 
       return colorsEnabled;
@@ -1288,7 +1337,7 @@ class Server {
         return msg;
       },
     };
-    const useColor = getColorsOption(this.getCompilerConfigArray());
+    const useColor = getColorsOption(this.getCompilerOptions());
 
     if (this.options.ipc) {
       this.logger.info(`Project is running at: "${this.server.address()}"`);
@@ -1420,36 +1469,6 @@ class Server {
     }
   }
 
-  // eslint-disable-next-line class-methods-use-this
-  getStatsOption(configArray) {
-    const isEmptyObject = (val) =>
-      typeof val === "object" && Object.keys(val).length === 0;
-
-    // in webpack@4 stats will not be defined if not provided,
-    // but in webpack@5 it will be an empty object
-    const statsConfig = configArray.find(
-      (configuration) =>
-        typeof configuration === "object" &&
-        configuration.stats &&
-        !isEmptyObject(configuration.stats)
-    );
-
-    return statsConfig ? statsConfig.stats : {};
-  }
-
-  getStats(statsObj) {
-    const stats = Server.DEFAULT_STATS;
-
-    const configArray = this.getCompilerConfigArray();
-    const statsOption = this.getStatsOption(configArray);
-
-    if (typeof statsOption === "object" && statsOption.warningsFilter) {
-      stats.warningsFilter = statsOption.warningsFilter;
-    }
-
-    return statsObj.toJson(stats);
-  }
-
   setHeaders(req, res, next) {
     let { headers } = this.options;
 

test/fixtures/client-config/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 const HTMLContent = `
 <!doctype html>
 <html>
@@ -20,9 +24,16 @@ module.exports = {
   output: {
     path: "/",
   },
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
   plugins: [
     {
       apply(compiler) {

test/fixtures/multi-compiler-config/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = [
   {
     mode: "development",
@@ -10,8 +14,15 @@ module.exports = [
       path: "/",
     },
     node: false,
-    infrastructureLogging: {
-      level: "warn",
-    },
+    infrastructureLogging: isWebpack5
+      ? {
+          level: "info",
+          stream: {
+            write: () => {},
+          },
+        }
+      : {
+          level: "info",
+        },
   },
 ];

test/fixtures/overlay-config/foo.js

@@ -1,3 +0,0 @@
-"use strict";
-
-console.log("Hey.");

test/fixtures/overlay-config/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = {
   mode: "development",
   context: __dirname,
@@ -8,7 +12,14 @@ module.exports = {
   output: {
     path: "/",
   },
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
 };

test/fixtures/provide-plugin-custom/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = {
   mode: "development",
   context: __dirname,
@@ -9,7 +13,14 @@ module.exports = {
     path: "/",
   },
   node: false,
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
 };

test/fixtures/provide-plugin-default/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = {
   mode: "development",
   context: __dirname,
@@ -9,7 +13,14 @@ module.exports = {
     path: "/",
   },
   node: false,
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
 };

test/fixtures/provide-plugin-sockjs-config/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = {
   mode: "development",
   context: __dirname,
@@ -9,7 +13,14 @@ module.exports = {
     path: "/",
   },
   node: false,
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
 };

test/fixtures/provide-plugin-ws-config/webpack.config.js

@@ -1,5 +1,9 @@
 "use strict";
 
+const webpack = require("webpack");
+
+const isWebpack5 = webpack.version.startsWith("5");
+
 module.exports = {
   mode: "development",
   context: __dirname,
@@ -9,7 +13,14 @@ module.exports = {
     path: "/",
   },
   node: false,
-  infrastructureLogging: {
-    level: "warn",
-  },
+  infrastructureLogging: isWebpack5
+    ? {
+        level: "info",
+        stream: {
+          write: () => {},
+        },
+      }
+    : {
+        level: "info",
+      },
 };