chore: update socket.js

.github/workflows/nodejs.yml

@@ -43,6 +43,12 @@ jobs:
       - name: Lint
         run: npm run lint
 
+      - name: Build types
+        run: npm run build:types
+
+      - name: Check types
+        run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'npm run build:types'"; exit 1; else echo "All types are valid"; fi
+
       - name: Security audit
         run: npm audit --production
 

client-src/index.js

@@ -1,7 +1,7 @@
 /* global __resourceQuery, __webpack_hash__ */
 /// <reference types="webpack/module" />
 import webpackHotLog from "webpack/hot/log.js";
-import stripAnsi from "./modules/strip-ansi/index.js";
+import stripAnsi from "./utils/stripAnsi.js";
 import parseURL from "./utils/parseURL.js";
 import socket from "./socket.js";
 import { formatProblem, show, hide } from "./overlay.js";

client-src/socket.js

@@ -18,6 +18,8 @@ let retries = 0;
 let maxRetries = 10;
 
 // Initialized client is exported so external consumers can utilize the same instance
+// It is mutable to enforce singleton
+// eslint-disable-next-line no-mutable-exports
 export let client = null;
 
 /**

client-src/utils/createSocketURL.js

@@ -5,7 +5,7 @@
 function format(objURL) {
   let protocol = objURL.protocol || "";
 
-  if (protocol && protocol.substr(-1) !== ":") {
+  if (protocol && !protocol.endsWith(":")) {
     protocol += ":";
   }
 

client-src/utils/parseURL.js

@@ -9,7 +9,7 @@ function parseURL(resourceQuery) {
   let options = {};
 
   if (typeof resourceQuery === "string" && resourceQuery !== "") {
-    const searchParams = resourceQuery.substr(1).split("&");
+    const searchParams = resourceQuery.slice(1).split("&");
 
     for (let i = 0; i < searchParams.length; i++) {
       const pair = searchParams[i].split("=");

client-src/utils/stripAnsi.js

@@ -0,0 +1,26 @@
+const ansiRegex = new RegExp(
+  [
+    "[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)",
+    "(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-nq-uy=><~]))",
+  ].join("|"),
+  "g"
+);
+
+/**
+ *
+ * Strip [ANSI escape codes](https://en.wikipedia.org/wiki/ANSI_escape_code) from a string.
+ * Adapted from code originally released by Sindre Sorhus
+ * Licensed the MIT License
+ *
+ * @param {string} string
+ * @return {string}
+ */
+function stripAnsi(string) {
+  if (typeof string !== "string") {
+    throw new TypeError(`Expected a \`string\`, got \`${typeof string}\``);
+  }
+
+  return string.replace(ansiRegex, "");
+}
+
+export default stripAnsi;

client-src/webpack.config.js

@@ -78,13 +78,6 @@ module.exports = [
       ),
     ],
   }),
-  merge(baseForModules, {
-    entry: path.join(__dirname, "modules/strip-ansi/index.js"),
-    output: {
-      // @ts-ignore
-      filename: "strip-ansi/index.js",
-    },
-  }),
   merge(baseForModules, {
     entry: path.join(__dirname, "modules/sockjs-client/index.js"),
     output: {

examples/util.js

@@ -72,14 +72,17 @@ module.exports = {
       })
     );
 
-    if (result.devServer.onBeforeSetupMiddleware) {
-      const proxy = result.devServer.onBeforeSetupMiddleware;
-      result.devServer.onBeforeSetupMiddleware = function replace(app) {
-        onBeforeSetupMiddleware(app);
-        proxy(app);
+    if (result.devServer.setupMiddlewares) {
+      const proxy = result.devServer.setupMiddlewares;
+      result.devServer.setupMiddlewares = (middlewares, devServer) => {
+        onBeforeSetupMiddleware(devServer);
+        return proxy(middlewares, devServer);
       };
     } else {
-      result.devServer.onBeforeSetupMiddleware = onBeforeSetupMiddleware;
+      result.devServer.setupMiddlewares = (middlewares, devServer) => {
+        onBeforeSetupMiddleware(devServer);
+        return middlewares;
+      };
     }
 
     const output = {

lib/Server.js

@@ -29,8 +29,8 @@ const schema = require("./options.json");
 /** @typedef {import("chokidar").WatchOptions} WatchOptions */
 /** @typedef {import("chokidar").FSWatcher} FSWatcher */
 /** @typedef {import("connect-history-api-fallback").Options} ConnectHistoryApiFallbackOptions */
-/** @typedef {import("bonjour").Bonjour} Bonjour */
-/** @typedef {import("bonjour").BonjourOptions} BonjourOptions */
+/** @typedef {import("bonjour-service").Bonjour} Bonjour */
+/** @typedef {import("bonjour-service").Service} BonjourOptions */
 /** @typedef {import("http-proxy-middleware").RequestHandler} RequestHandler */
 /** @typedef {import("http-proxy-middleware").Options} HttpProxyMiddlewareOptions */
 /** @typedef {import("http-proxy-middleware").Filter} HttpProxyMiddlewareOptionsFilter */
@@ -188,7 +188,7 @@ const schema = require("./options.json");
  * @property {"auto" | "all" | string | string[]} [allowedHosts]
  * @property {boolean | ConnectHistoryApiFallbackOptions} [historyApiFallback]
  * @property {boolean} [setupExitSignals]
- * @property {boolean | BonjourOptions} [bonjour]
+ * @property {boolean | Record<string, never> | BonjourOptions} [bonjour]
  * @property {string | string[] | WatchFiles | Array<string | WatchFiles>} [watchFiles]
  * @property {boolean | string | Static | Array<string | Static>} [static]
  * @property {boolean | ServerOptions} [https]
@@ -2594,14 +2594,18 @@ class Server {
    * @returns {void}
    */
   runBonjour() {
+    const { Bonjour } = require("bonjour-service");
     /**
      * @private
-     * @type {import("bonjour").Bonjour | undefined}
+     * @type {Bonjour | undefined}
      */
-    this.bonjour = require("bonjour")();
+    this.bonjour = new Bonjour();
     this.bonjour.publish({
+      // @ts-expect-error
       name: `Webpack Dev Server ${os.hostname()}:${this.options.port}`,
+      // @ts-expect-error
       port: /** @type {number} */ (this.options.port),
+      // @ts-expect-error
       type:
         /** @type {ServerConfiguration} */
         (this.options.server).type === "http" ? "http" : "https",