Updated the files.

my-app/node_modules/webpack-dev-server/lib/getPort.js

@@ -0,0 +1,133 @@
+"use strict";
+
+/*
+ * Based on the packages get-port https://www.npmjs.com/package/get-port
+ * and portfinder https://www.npmjs.com/package/portfinder
+ * The code structure is similar to get-port, but it searches
+ * ports deterministically like portfinder
+ */
+const net = require("net");
+const os = require("os");
+
+const minPort = 1024;
+const maxPort = 65_535;
+
+/**
+ * @return {Set<string|undefined>}
+ */
+const getLocalHosts = () => {
+  const interfaces = os.networkInterfaces();
+
+  // Add undefined value for createServer function to use default host,
+  // and default IPv4 host in case createServer defaults to IPv6.
+  // eslint-disable-next-line no-undefined
+  const results = new Set([undefined, "0.0.0.0"]);
+
+  for (const _interface of Object.values(interfaces)) {
+    if (_interface) {
+      for (const config of _interface) {
+        results.add(config.address);
+      }
+    }
+  }
+
+  return results;
+};
+
+/**
+ * @param {number} basePort
+ * @param {string | undefined} host
+ * @return {Promise<number>}
+ */
+const checkAvailablePort = (basePort, host) =>
+  new Promise((resolve, reject) => {
+    const server = net.createServer();
+    server.unref();
+    server.on("error", reject);
+
+    server.listen(basePort, host, () => {
+      // Next line should return AdressInfo because we're calling it after listen() and before close()
+      const { port } = /** @type {import("net").AddressInfo} */ (
+        server.address()
+      );
+      server.close(() => {
+        resolve(port);
+      });
+    });
+  });
+
+/**
+ * @param {number} port
+ * @param {Set<string|undefined>} hosts
+ * @return {Promise<number>}
+ */
+const getAvailablePort = async (port, hosts) => {
+  /**
+   * Errors that mean that host is not available.
+   * @type {Set<string | undefined>}
+   */
+  const nonExistentInterfaceErrors = new Set(["EADDRNOTAVAIL", "EINVAL"]);
+  /* Check if the post is available on every local host name */
+  for (const host of hosts) {
+    try {
+      await checkAvailablePort(port, host); // eslint-disable-line no-await-in-loop
+    } catch (error) {
+      /* We throw an error only if the interface exists */
+      if (
+        !nonExistentInterfaceErrors.has(
+          /** @type {NodeJS.ErrnoException} */ (error).code
+        )
+      ) {
+        throw error;
+      }
+    }
+  }
+
+  return port;
+};
+
+/**
+ * @param {number} basePort
+ * @param {string=} host
+ * @return {Promise<number>}
+ */
+async function getPorts(basePort, host) {
+  if (basePort < minPort || basePort > maxPort) {
+    throw new Error(`Port number must lie between ${minPort} and ${maxPort}`);
+  }
+
+  let port = basePort;
+  const localhosts = getLocalHosts();
+  let hosts;
+  if (host && !localhosts.has(host)) {
+    hosts = new Set([host]);
+  } else {
+    /* If the host is equivalent to localhost
+       we need to check every equivalent host
+       else the port might falsely appear as available
+       on some operating systems  */
+    hosts = localhosts;
+  }
+  /** @type {Set<string | undefined>} */
+  const portUnavailableErrors = new Set(["EADDRINUSE", "EACCES"]);
+  while (port <= maxPort) {
+    try {
+      const availablePort = await getAvailablePort(port, hosts); // eslint-disable-line no-await-in-loop
+      return availablePort;
+    } catch (error) {
+      /* Try next port if port is busy; throw for any other error */
+      if (
+        !portUnavailableErrors.has(
+          /** @type {NodeJS.ErrnoException} */ (error).code
+        )
+      ) {
+        throw error;
+      }
+      port += 1;
+    }
+  }
+
+  throw new Error("No available ports found");
+}
+
+module.exports = getPorts;

my-app/node_modules/webpack-dev-server/lib/servers/BaseServer.js

@@ -0,0 +1,18 @@
+"use strict";
+
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
+// base class that users should extend if they are making their own
+// server implementation
+module.exports = class BaseServer {
+  /**
+   * @param {import("../Server")} server
+   */
+  constructor(server) {
+    /** @type {import("../Server")} */
+    this.server = server;
+
+    /** @type {ClientConnection[]} */
+    this.clients = [];
+  }
+};

my-app/node_modules/webpack-dev-server/lib/servers/SockJSServer.js

@@ -0,0 +1,126 @@
+"use strict";
+
+const sockjs = require("sockjs");
+const BaseServer = require("./BaseServer");
+
+/** @typedef {import("../Server").WebSocketServerConfiguration} WebSocketServerConfiguration */
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
+// Workaround for sockjs@~0.3.19
+// sockjs will remove Origin header, however Origin header is required for checking host.
+// See https://github.com/webpack/webpack-dev-server/issues/1604 for more information
+{
+  // @ts-ignore
+  const SockjsSession = require("sockjs/lib/transport").Session;
+  const decorateConnection = SockjsSession.prototype.decorateConnection;
+
+  /**
+   * @param {import("http").IncomingMessage} req
+   */
+  // eslint-disable-next-line func-names
+  SockjsSession.prototype.decorateConnection = function (req) {
+    decorateConnection.call(this, req);
+
+    const connection = this.connection;
+
+    if (
+      connection.headers &&
+      !("origin" in connection.headers) &&
+      "origin" in req.headers
+    ) {
+      connection.headers.origin = req.headers.origin;
+    }
+  };
+}
+
+module.exports = class SockJSServer extends BaseServer {
+  // options has: error (function), debug (function), server (http/s server), path (string)
+  /**
+   * @param {import("../Server")} server
+   */
+  constructor(server) {
+    super(server);
+
+    const webSocketServerOptions =
+      /** @type {NonNullable<WebSocketServerConfiguration["options"]>} */
+      (
+        /** @type {WebSocketServerConfiguration} */
+        (this.server.options.webSocketServer).options
+      );
+
+    /**
+     * @param {NonNullable<WebSocketServerConfiguration["options"]>} options
+     * @returns {string}
+     */
+    const getSockjsUrl = (options) => {
+      if (typeof options.sockjsUrl !== "undefined") {
+        return options.sockjsUrl;
+      }
+
+      return "/__webpack_dev_server__/sockjs.bundle.js";
+    };
+
+    this.implementation = sockjs.createServer({
+      // Use provided up-to-date sockjs-client
+      sockjs_url: getSockjsUrl(webSocketServerOptions),
+      // Default logger is very annoy. Limit useless logs.
+      /**
+       * @param {string} severity
+       * @param {string} line
+       */
+      log: (severity, line) => {
+        if (severity === "error") {
+          this.server.logger.error(line);
+        } else if (severity === "info") {
+          this.server.logger.log(line);
+        } else {
+          this.server.logger.debug(line);
+        }
+      },
+    });
+
+    /**
+     * @param {import("sockjs").ServerOptions & { path?: string }} options
+     * @returns {string | undefined}
+     */
+    const getPrefix = (options) => {
+      if (typeof options.prefix !== "undefined") {
+        return options.prefix;
+      }
+
+      return options.path;
+    };
+
+    const options = {
+      ...webSocketServerOptions,
+      prefix: getPrefix(webSocketServerOptions),
+    };
+
+    this.implementation.installHandlers(
+      /** @type {import("http").Server} */ (this.server.server),
+      options
+    );
+
+    this.implementation.on("connection", (client) => {
+      // @ts-ignore
+      // Implement the the same API as for `ws`
+      client.send = client.write;
+      // @ts-ignore
+      client.terminate = client.close;
+
+      this.clients.push(/** @type {ClientConnection} */ (client));
+
+      client.on("close", () => {
+        this.clients.splice(
+          this.clients.indexOf(/** @type {ClientConnection} */ (client)),
+          1
+        );
+      });
+    });
+
+    // @ts-ignore
+    this.implementation.close = (callback) => {
+      callback();
+    };
+  }
+};

my-app/node_modules/webpack-dev-server/lib/servers/WebsocketServer.js

@@ -0,0 +1,105 @@
+"use strict";
+
+const WebSocket = require("ws");
+const BaseServer = require("./BaseServer");
+
+/** @typedef {import("../Server").WebSocketServerConfiguration} WebSocketServerConfiguration */
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
+module.exports = class WebsocketServer extends BaseServer {
+  static heartbeatInterval = 1000;
+
+  /**
+   * @param {import("../Server")} server
+   */
+  constructor(server) {
+    super(server);
+
+    /** @type {import("ws").ServerOptions} */
+    const options = {
+      .../** @type {WebSocketServerConfiguration} */
+      (this.server.options.webSocketServer).options,
+      clientTracking: false,
+    };
+    const isNoServerMode =
+      typeof options.port === "undefined" &&
+      typeof options.server === "undefined";
+
+    if (isNoServerMode) {
+      options.noServer = true;
+    }
+
+    this.implementation = new WebSocket.Server(options);
+
+    /** @type {import("http").Server} */
+    (this.server.server).on(
+      "upgrade",
+      /**
+       * @param {import("http").IncomingMessage} req
+       * @param {import("stream").Duplex} sock
+       * @param {Buffer} head
+       */
+      (req, sock, head) => {
+        if (!this.implementation.shouldHandle(req)) {
+          return;
+        }
+
+        this.implementation.handleUpgrade(req, sock, head, (connection) => {
+          this.implementation.emit("connection", connection, req);
+        });
+      }
+    );
+
+    this.implementation.on(
+      "error",
+      /**
+       * @param {Error} err
+       */
+      (err) => {
+        this.server.logger.error(err.message);
+      }
+    );
+
+    const interval = setInterval(() => {
+      this.clients.forEach(
+        /**
+         * @param {ClientConnection} client
+         */
+        (client) => {
+          if (client.isAlive === false) {
+            client.terminate();
+
+            return;
+          }
+
+          client.isAlive = false;
+          client.ping(() => {});
+        }
+      );
+    }, WebsocketServer.heartbeatInterval);
+
+    this.implementation.on(
+      "connection",
+      /**
+       * @param {ClientConnection} client
+       */
+      (client) => {
+        this.clients.push(client);
+
+        client.isAlive = true;
+
+        client.on("pong", () => {
+          client.isAlive = true;
+        });
+
+        client.on("close", () => {
+          this.clients.splice(this.clients.indexOf(client), 1);
+        });
+      }
+    );
+
+    this.implementation.on("close", () => {
+      clearInterval(interval);
+    });
+  }
+};