refactor: code

Author: alexander-akait

lib/Server.js

@@ -126,31 +126,60 @@ 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)
+      );
 
-    return compilers.map((compiler) => compiler.options);
+      if (compilerWithWebPreset) {
+        return compilerWithWebPreset.options;
+      }
+
+      // Fallback
+      return this.compiler.compilers[0].options;
+    }
+
+    return this.compiler.options;
   }
 
   // eslint-disable-next-line class-methods-use-this
-  async normalizeOptions() {
+  normalizeOptions() {
     const { options } = this;
 
     if (!this.logger) {
       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: {},
@@ -221,14 +250,9 @@ class Server {
 
       // Respect infrastructureLogging.level
       if (typeof options.client.logging === "undefined") {
-        const configWithInfrastructureLogging =
-          configArray.find(
-            (config) =>
-              config.infrastructureLogging && config.infrastructureLogging.level
-          ) || configArray[0];
-
-        options.client.logging =
-          configWithInfrastructureLogging.infrastructureLogging.level;
+        options.client.logging = compilerOptions.infrastructureLogging
+          ? compilerOptions.infrastructureLogging.level
+          : "info";
       }
     }
 
@@ -504,13 +528,12 @@ 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"
               );
             }
 
@@ -1272,13 +1295,13 @@ 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 (typeof compilerOptions.stats.colors !== "undefined") {
+        colorsEnabled = compilerOptions.stats;
+      } else {
+        colorsEnabled = colorette.options.enabled;
       }
 
       return colorsEnabled;
@@ -1300,7 +1323,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()}"`);
@@ -1432,31 +1455,160 @@ 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)
+  listen(port, hostname, fn) {
+    this.logger = this.compiler.getInfrastructureLogger("webpack-dev-server");
+    this.normalizeOptions(this.options);
+
+    if (typeof port === "function") {
+      fn = port;
+    }
+
+    if (
+      typeof port !== "undefined" &&
+      typeof this.options.port !== "undefined" &&
+      port !== this.options.port
+    ) {
+      this.options.port = port;
+
+      this.logger.warn(
+        'The "port" specified in options is different from the port passed as an argument. Will be used from arguments.'
+      );
+    }
+
+    if (!this.options.port) {
+      this.options.port = port;
+    }
+
+    if (
+      typeof hostname !== "undefined" &&
+      typeof this.options.host !== "undefined" &&
+      hostname !== this.options.host
+    ) {
+      this.options.host = hostname;
+
+      this.logger.warn(
+        'The "host" specified in options is different from the host passed as an argument. Will be used from arguments.'
+      );
+    }
+
+    if (!this.options.host) {
+      this.options.host = hostname;
+    }
+
+    this.options.host = Server.getHostname(this.options.host);
+
+    const resolveFreePortOrIPC = () => {
+      if (this.options.ipc) {
+        return new Promise((resolve, reject) => {
+          const net = require("net");
+          const socket = new net.Socket();
+
+          socket.on("error", (error) => {
+            if (error.code === "ECONNREFUSED") {
+              fs.unlinkSync(this.options.ipc);
+
+              resolve(this.options.ipc);
+
+              return;
+            } else if (error.code === "ENOENT") {
+              resolve(this.options.ipc);
+
+              return;
+            }
+
+            reject(error);
+          });
+
+          socket.connect({ path: this.options.ipc }, () => {
+            throw new Error(`IPC "${this.options.ipc}" is already used`);
+          });
+        });
+      }
+
+      return Server.getFreePort(this.options.port).then((foundPort) => {
+        this.options.port = foundPort;
+      });
+    };
+
+    return resolveFreePortOrIPC()
+      .then(() => {
+        this.initialize();
+
+        const listenOptions = this.options.ipc
+          ? { path: this.options.ipc }
+          : {
+              host: this.options.host,
+              port: this.options.port,
+            };
+
+        return this.server.listen(listenOptions, (error) => {
+          if (this.options.ipc) {
+            // chmod 666 (rw rw rw)
+            const READ_WRITE = 438;
+
+            fs.chmodSync(this.options.ipc, READ_WRITE);
+          }
+
+          if (this.options.webSocketServer) {
+            try {
+              this.createWebSocketServer();
+            } catch (webSocketServerError) {
+              fn.call(this.server, webSocketServerError);
+
+              return;
+            }
+          }
+
+          if (this.options.bonjour) {
+            this.runBonjour();
+          }
+
+          this.logStatus();
+
+          if (fn) {
+            fn.call(this.server, error);
+          }
+
+          if (typeof this.options.onListening === "function") {
+            this.options.onListening(this);
+          }
+        });
+      })
+      .catch((error) => {
+        if (fn) {
+          fn.call(this.server, error);
+        }
+      });
+  }
+
+  close(callback) {
+    if (this.webSocketServer) {
+      this.webSocketServer.implementation.close();
+    }
+
+    const prom = Promise.all(
+      this.staticWatchers.map((watcher) => watcher.close())
     );
+    this.staticWatchers = [];
 
-    return statsConfig ? statsConfig.stats : {};
+    if (this.server) {
+      this.server.kill(() => {
+        // watchers must be closed before closing middleware
+        prom.then(() => {
+          this.middleware.close(callback);
+        });
+      });
+    } else if (callback) {
+      callback();
+    }
   }
 
   getStats(statsObj) {
     const stats = Server.DEFAULT_STATS;
+    const compilerOptions = this.getCompilerOptions();
 
-    const configArray = this.getCompilerConfigArray();
-    const statsOption = this.getStatsOption(configArray);
-
-    if (typeof statsOption === "object" && statsOption.warningsFilter) {
-      stats.warningsFilter = statsOption.warningsFilter;
+    if (compilerOptions.stats && compilerOptions.stats.warningsFilter) {
+      stats.warningsFilter = compilerOptions.stats.warningsFilter;
     }
 
     return statsObj.toJson(stats);