webpack-dev-server 4.6.0 → 4.7.3

package/bin/process-arguments.js

@@ -5,8 +5,50 @@ const path = require("path");
 // Based on https://github.com/webpack/webpack/blob/master/lib/cli.js
 // Please do not modify it
 
+/** @typedef {"unknown-argument" | "unexpected-non-array-in-path" | "unexpected-non-object-in-path" | "multiple-values-unexpected" | "invalid-value"} ProblemType */
+
+/**
+ * @typedef {Object} Problem
+ * @property {ProblemType} type
+ * @property {string} path
+ * @property {string} argument
+ * @property {any=} value
+ * @property {number=} index
+ * @property {string=} expected
+ */
+
+/**
+ * @typedef {Object} LocalProblem
+ * @property {ProblemType} type
+ * @property {string} path
+ * @property {string=} expected
+ */
+
+/**
+ * @typedef {Object} ArgumentConfig
+ * @property {string} description
+ * @property {string} path
+ * @property {boolean} multiple
+ * @property {"enum"|"string"|"path"|"number"|"boolean"|"RegExp"|"reset"} type
+ * @property {any[]=} values
+ */
+
+/**
+ * @typedef {Object} Argument
+ * @property {string} description
+ * @property {"string"|"number"|"boolean"} simpleType
+ * @property {boolean} multiple
+ * @property {ArgumentConfig[]} configs
+ */
+
 const cliAddedItems = new WeakMap();
 
+/**
+ * @param {any} config configuration
+ * @param {string} schemaPath path in the config
+ * @param {number | undefined} index index of value when multiple values are provided, otherwise undefined
+ * @returns {{ problem?: LocalProblem, object?: any, property?: string | number, value?: any }} problem or object with property and value
+ */
 const getObjectAndProperty = (config, schemaPath, index = 0) => {
   if (!schemaPath) {
     return { value: config };
@@ -81,10 +123,10 @@ const getObjectAndProperty = (config, schemaPath, index = 0) => {
     i++;
   }
 
-  const value = current[property];
+  const value = current[/** @type {string} */ (property)];
 
-  if (property.endsWith("[]")) {
-    const name = property.slice(0, -2);
+  if (/** @type {string} */ (property).endsWith("[]")) {
+    const name = /** @type {string} */ (property).slice(0, -2);
     // eslint-disable-next-line no-shadow
     const value = current[name];
 
@@ -140,6 +182,11 @@ const getObjectAndProperty = (config, schemaPath, index = 0) => {
   return { object: current, property, value };
 };
 
+/**
+ * @param {ArgumentConfig} argConfig processing instructions
+ * @param {any} value the value
+ * @returns {any | undefined} parsed value
+ */
 const parseValueForArgumentConfig = (argConfig, value) => {
   // eslint-disable-next-line default-case
   switch (argConfig.type) {
@@ -194,11 +241,11 @@ const parseValueForArgumentConfig = (argConfig, value) => {
 
       break;
     case "enum":
-      if (argConfig.values.includes(value)) {
+      if (/** @type {any[]} */ (argConfig.values).includes(value)) {
         return value;
       }
 
-      for (const item of argConfig.values) {
+      for (const item of /** @type {any[]} */ (argConfig.values)) {
         if (`${item}` === value) return item;
       }
 
@@ -212,6 +259,10 @@ const parseValueForArgumentConfig = (argConfig, value) => {
   }
 };
 
+/**
+ * @param {ArgumentConfig} argConfig processing instructions
+ * @returns {string | undefined} expected message
+ */
 const getExpectedValue = (argConfig) => {
   switch (argConfig.type) {
     default:
@@ -221,12 +272,21 @@ const getExpectedValue = (argConfig) => {
     case "RegExp":
       return "regular expression (example: /ab?c*/)";
     case "enum":
-      return argConfig.values.map((v) => `${v}`).join(" | ");
+      return /** @type {any[]} */ (argConfig.values)
+        .map((v) => `${v}`)
+        .join(" | ");
     case "reset":
       return "true (will reset the previous value to an empty array)";
   }
 };
 
+/**
+ * @param {any} config configuration
+ * @param {string} schemaPath path in the config
+ * @param {any} value parsed value
+ * @param {number | undefined} index index of value when multiple values are provided, otherwise undefined
+ * @returns {LocalProblem | null} problem or null for success
+ */
 const setValue = (config, schemaPath, value, index) => {
   const { problem, object, property } = getObjectAndProperty(
     config,
@@ -238,11 +298,18 @@ const setValue = (config, schemaPath, value, index) => {
     return problem;
   }
 
-  object[property] = value;
+  object[/** @type {string} */ (property)] = value;
 
   return null;
 };
 
+/**
+ * @param {ArgumentConfig} argConfig processing instructions
+ * @param {any} config configuration
+ * @param {any} value the value
+ * @param {number | undefined} index the index if multiple values provided
+ * @returns {LocalProblem | null} a problem if any
+ */
 const processArgumentConfig = (argConfig, config, value, index) => {
   // eslint-disable-next-line no-undefined
   if (index !== undefined && !argConfig.multiple) {
@@ -272,7 +339,16 @@ const processArgumentConfig = (argConfig, config, value, index) => {
   return null;
 };
 
+/**
+ * @param {Record<string, Argument>} args object of arguments
+ * @param {any} config configuration
+ * @param {Record<string, string | number | boolean | RegExp | (string | number | boolean | RegExp)[]>} values object with values
+ * @returns {Problem[] | null} problems or null for success
+ */
 const processArguments = (args, config, values) => {
+  /**
+   * @type {Problem[]}
+   */
   const problems = [];
 
   for (const key of Object.keys(values)) {
@@ -289,6 +365,10 @@ const processArguments = (args, config, values) => {
       continue;
     }
 
+    /**
+     * @param {any} value
+     * @param {number | undefined} i
+     */
     const processValue = (value, i) => {
       const currentProblems = [];
 

package/bin/webpack-dev-server.js

@@ -108,6 +108,9 @@ if (!cli.installed) {
 
   console.error(notify);
 
+  /**
+   * @type {string}
+   */
   let packageManager;
 
   if (fs.existsSync(path.resolve(process.cwd(), "yarn.lock"))) {

package/client/clients/SockJSClient.js

@@ -2,38 +2,61 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
 import SockJS from "../modules/sockjs-client/index.js";
 import { log } from "../utils/log.js";
 
 var SockJSClient = /*#__PURE__*/function () {
+  /**
+   * @param {string} url
+   */
   function SockJSClient(url) {
     _classCallCheck(this, SockJSClient);
 
     // SockJS requires `http` and `https` protocols
     this.sock = new SockJS(url.replace(/^ws:/i, "http:").replace(/^wss:/i, "https:"));
 
-    this.sock.onerror = function (error) {
+    this.sock.onerror =
+    /**
+     * @param {Error} error
+     */
+    function (error) {
       log.error(error);
     };
   }
+  /**
+   * @param {(...args: any[]) => void} f
+   */
+
 
   _createClass(SockJSClient, [{
     key: "onOpen",
     value: function onOpen(f) {
       this.sock.onopen = f;
     }
+    /**
+     * @param {(...args: any[]) => void} f
+     */
+
   }, {
     key: "onClose",
     value: function onClose(f) {
       this.sock.onclose = f;
     } // call f with the message string as the first argument
 
+    /**
+     * @param {(...args: any[]) => void} f
+     */
+
   }, {
     key: "onMessage",
     value: function onMessage(f) {
-      this.sock.onmessage = function (e) {
+      this.sock.onmessage =
+      /**
+       * @param {Error & { data: string }} e
+       */
+      function (e) {
         f(e.data);
       };
     }

package/client/clients/WebSocketClient.js

@@ -2,11 +2,14 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
 import { log } from "../utils/log.js";
 
 var WebSocketClient = /*#__PURE__*/function () {
+  /**
+   * @param {string} url
+   */
   function WebSocketClient(url) {
     _classCallCheck(this, WebSocketClient);
 
@@ -16,18 +19,30 @@ var WebSocketClient = /*#__PURE__*/function () {
       log.error(error);
     };
   }
+  /**
+   * @param {(...args: any[]) => void} f
+   */
+
 
   _createClass(WebSocketClient, [{
     key: "onOpen",
     value: function onOpen(f) {
       this.client.onopen = f;
     }
+    /**
+     * @param {(...args: any[]) => void} f
+     */
+
   }, {
     key: "onClose",
     value: function onClose(f) {
       this.client.onclose = f;
     } // call f with the message string as the first argument
 
+    /**
+     * @param {(...args: any[]) => void} f
+     */
+
   }, {
     key: "onMessage",
     value: function onMessage(f) {

package/client/index.js

@@ -1,4 +1,5 @@
 /* global __resourceQuery, __webpack_hash__ */
+/// <reference types="webpack/module" />
 import webpackHotLog from "webpack/hot/log.js";
 import stripAnsi from "./modules/strip-ansi/index.js";
 import parseURL from "./utils/parseURL.js";
@@ -8,12 +9,35 @@ import { log, setLogLevel } from "./utils/log.js";
 import sendMessage from "./utils/sendMessage.js";
 import reloadApp from "./utils/reloadApp.js";
 import createSocketURL from "./utils/createSocketURL.js";
+/**
+ * @typedef {Object} Options
+ * @property {boolean} hot
+ * @property {boolean} liveReload
+ * @property {boolean} progress
+ * @property {boolean | { warnings?: boolean, errors?: boolean }} overlay
+ * @property {string} [logging]
+ * @property {number} [reconnect]
+ */
+
+/**
+ * @typedef {Object} Status
+ * @property {boolean} isUnloading
+ * @property {string} currentHash
+ * @property {string} [previousHash]
+ */
+
+/**
+ * @type {Status}
+ */
+
 var status = {
   isUnloading: false,
   // TODO Workaround for webpack v4, `__webpack_hash__` is not replaced without HotModuleReplacement
   // eslint-disable-next-line camelcase
   currentHash: typeof __webpack_hash__ !== "undefined" ? __webpack_hash__ : ""
 };
+/** @type {Options} */
+
 var options = {
   hot: false,
   liveReload: false,
@@ -39,6 +63,10 @@ if (parsedResourceQuery.logging) {
 if (typeof parsedResourceQuery.reconnect !== "undefined") {
   options.reconnect = Number(parsedResourceQuery.reconnect);
 }
+/**
+ * @param {string} level
+ */
+
 
 function setAllLogLevel(level) {
   // This is needed because the HMR logger operate separately from dev server logger
@@ -79,11 +107,19 @@ var onSocketMessage = {
 
     sendMessage("Invalid");
   },
+
+  /**
+   * @param {string} hash
+   */
   hash: function hash(_hash) {
     status.previousHash = status.currentHash;
     status.currentHash = _hash;
   },
   logging: setAllLogLevel,
+
+  /**
+   * @param {boolean} value
+   */
   overlay: function overlay(value) {
     if (typeof document === "undefined") {
       return;
@@ -91,6 +127,10 @@ var onSocketMessage = {
 
     options.overlay = value;
   },
+
+  /**
+   * @param {number} value
+   */
   reconnect: function reconnect(value) {
     if (parsedResourceQuery.reconnect === "false") {
       return;
@@ -98,9 +138,17 @@ var onSocketMessage = {
 
     options.reconnect = value;
   },
-  progress: function progress(_progress) {
-    options.progress = _progress;
+
+  /**
+   * @param {boolean} value
+   */
+  progress: function progress(value) {
+    options.progress = value;
   },
+
+  /**
+   * @param {{ pluginName?: string, percent: number, msg: string }} data
+   */
   "progress-update": function progressUpdate(data) {
     if (options.progress) {
       log.info("".concat(data.pluginName ? "[".concat(data.pluginName, "] ") : "").concat(data.percent, "% - ").concat(data.msg, "."));
@@ -127,14 +175,27 @@ var onSocketMessage = {
     reloadApp(options, status);
   },
   // TODO: remove in v5 in favor of 'static-changed'
+
+  /**
+   * @param {string} file
+   */
   "content-changed": function contentChanged(file) {
     log.info("".concat(file ? "\"".concat(file, "\"") : "Content", " from static directory was changed. Reloading..."));
     self.location.reload();
   },
+
+  /**
+   * @param {string} file
+   */
   "static-changed": function staticChanged(file) {
     log.info("".concat(file ? "\"".concat(file, "\"") : "Content", " from static directory was changed. Reloading..."));
     self.location.reload();
   },
+
+  /**
+   * @param {Error[]} warnings
+   * @param {any} params
+   */
   warnings: function warnings(_warnings, params) {
     log.warn("Warnings while compiling.");
 
@@ -164,6 +225,10 @@ var onSocketMessage = {
 
     reloadApp(options, status);
   },
+
+  /**
+   * @param {Error[]} errors
+   */
   errors: function errors(_errors) {
     log.error("Errors while compiling. Reload prevented.");
 
@@ -187,6 +252,10 @@ var onSocketMessage = {
       show("error", _errors);
     }
   },
+
+  /**
+   * @param {Error} error
+   */
   error: function error(_error) {
     log.error(_error);
   },

package/client/modules/logger/index.js

@@ -87,6 +87,9 @@ function _defineProperties(target, props) {
 function _createClass(Constructor, protoProps, staticProps) {
   if (protoProps) _defineProperties(Constructor.prototype, protoProps);
   if (staticProps) _defineProperties(Constructor, staticProps);
+  Object.defineProperty(Constructor, "prototype", {
+    writable: false
+  });
   return Constructor;
 }
 

package/client/modules/sockjs-client/index.js

@@ -6459,7 +6459,7 @@ function Url(address, location, parser) {
 
   if (url.auth) {
     instruction = url.auth.split(':');
-    url.username = instruction[0] || '';
+    url.username = instruction[0];
     url.password = instruction[1] || '';
   }
 
@@ -6544,8 +6544,15 @@ function set(part, value, fn) {
 
       break;
 
-    default:
-      url[part] = value;
+    case 'username':
+    case 'password':
+      url[part] = encodeURIComponent(value);
+      break;
+
+    case 'auth':
+      var splits = value.split(':');
+      url.username = splits[0];
+      url.password = splits.length === 2 ? splits[1] : '';
   }
 
   for (var i = 0; i < rules.length; i++) {
@@ -6553,6 +6560,7 @@ function set(part, value, fn) {
     if (ins[4]) url[ins[1]] = url[ins[1]].toLowerCase();
   }
 
+  url.auth = url.password ? url.username + ':' + url.password : url.username;
   url.origin = url.protocol !== 'file:' && isSpecial(url.protocol) && url.host ? url.protocol + '//' + url.host : 'null';
   url.href = url.toString();
   return url;
@@ -6572,12 +6580,15 @@ function toString(stringify) {
       url = this,
       protocol = url.protocol;
   if (protocol && protocol.charAt(protocol.length - 1) !== ':') protocol += ':';
-  var result = protocol + (url.slashes || isSpecial(url.protocol) ? '//' : '');
+  var result = protocol + (url.protocol && url.slashes || isSpecial(url.protocol) ? '//' : '');
 
   if (url.username) {
     result += url.username;
     if (url.password) result += ':' + url.password;
     result += '@';
+  } else if (url.password) {
+    result += ':' + url.password;
+    result += '@';
   }
 
   result += url.host + url.pathname;

package/client/overlay.js

@@ -14,8 +14,14 @@ var colors = {
   lightgrey: "EBE7E3",
   darkgrey: "6D7891"
 };
+/** @type {HTMLIFrameElement | null | undefined} */
+
 var iframeContainerElement;
+/** @type {HTMLDivElement | null | undefined} */
+
 var containerElement;
+/** @type {Array<(element: HTMLDivElement) => void>} */
+
 var onLoadQueue = [];
 ansiHTML.setColors(colors);
 
@@ -34,7 +40,11 @@ function createContainer() {
   iframeContainerElement.style.zIndex = 9999999999;
 
   iframeContainerElement.onload = function () {
-    containerElement = iframeContainerElement.contentDocument.createElement("div");
+    containerElement =
+    /** @type {Document} */
+
+    /** @type {HTMLIFrameElement} */
+    iframeContainerElement.contentDocument.createElement("div");
     containerElement.id = "webpack-dev-server-client-overlay-div";
     containerElement.style.position = "fixed";
     containerElement.style.boxSizing = "border-box";
@@ -62,7 +72,8 @@ function createContainer() {
     closeButtonElement.style.fontWeight = "bold";
     closeButtonElement.style.color = "white";
     closeButtonElement.style.cursor = "pointer";
-    closeButtonElement.style.cssFloat = "right";
+    closeButtonElement.style.cssFloat = "right"; // @ts-ignore
+
     closeButtonElement.style.styleFloat = "right";
     closeButtonElement.addEventListener("click", function () {
       hide();
@@ -71,16 +82,27 @@ function createContainer() {
     containerElement.appendChild(closeButtonElement);
     containerElement.appendChild(document.createElement("br"));
     containerElement.appendChild(document.createElement("br"));
+    /** @type {Document} */
+
+    /** @type {HTMLIFrameElement} */
     iframeContainerElement.contentDocument.body.appendChild(containerElement);
     onLoadQueue.forEach(function (onLoad) {
-      onLoad(containerElement);
+      onLoad(
+      /** @type {HTMLDivElement} */
+      containerElement);
     });
     onLoadQueue = [];
+    /** @type {HTMLIFrameElement} */
+
     iframeContainerElement.onload = null;
   };
 
   document.body.appendChild(iframeContainerElement);
 }
+/**
+ * @param {(element: HTMLDivElement) => void} callback
+ */
+
 
 function ensureOverlayExists(callback) {
   if (containerElement) {
@@ -109,6 +131,12 @@ function hide() {
   iframeContainerElement = null;
   containerElement = null;
 }
+/**
+ * @param {string} type
+ * @param {string  | { file?: string, moduleName?: string, loc?: string, message?: string }} item
+ * @returns {{ header: string, body: string }}
+ */
+
 
 function formatProblem(type, item) {
   var header = type === "warning" ? "WARNING" : "ERROR";
@@ -131,6 +159,11 @@ function formatProblem(type, item) {
   };
 } // Compilation with errors (e.g. syntax error or missing modules).
 
+/**
+ * @param {string} type
+ * @param {Array<string  | { file?: string, moduleName?: string, loc?: string, message?: string }>} messages
+ */
+
 
 function show(type, messages) {
   ensureOverlayExists(function () {
@@ -154,6 +187,8 @@ function show(type, messages) {
       entryElement.appendChild(messageTextNode);
       entryElement.appendChild(document.createElement("br"));
       entryElement.appendChild(document.createElement("br"));
+      /** @type {HTMLDivElement} */
+
       containerElement.appendChild(entryElement);
     });
   });

package/client/socket.js

@@ -4,20 +4,27 @@ import { log } from "./utils/log.js"; // this WebsocketClient is here as a defau
 
 /* eslint-disable camelcase */
 
-var Client = // eslint-disable-next-line camelcase, no-nested-ternary
-typeof __webpack_dev_server_client__ !== "undefined" ? // eslint-disable-next-line camelcase
-typeof __webpack_dev_server_client__.default !== "undefined" ? __webpack_dev_server_client__.default : __webpack_dev_server_client__ : WebSocketClient;
+var Client = // eslint-disable-next-line no-nested-ternary
+typeof __webpack_dev_server_client__ !== "undefined" ? typeof __webpack_dev_server_client__.default !== "undefined" ? __webpack_dev_server_client__.default : __webpack_dev_server_client__ : WebSocketClient;
 /* eslint-enable camelcase */
 
 var retries = 0;
 var maxRetries = 10;
 var client = null;
+/**
+ * @param {string} url
+ * @param {{ [handler: string]: (data?: any, params?: any) => any }} handlers
+ * @param {number} [reconnect]
+ */
 
 var socket = function initSocket(url, handlers, reconnect) {
   client = new Client(url);
   client.onOpen(function () {
     retries = 0;
-    maxRetries = reconnect;
+
+    if (typeof reconnect !== "undefined") {
+      maxRetries = reconnect;
+    }
   });
   client.onClose(function () {
     if (retries === 0) {
@@ -30,7 +37,7 @@ var socket = function initSocket(url, handlers, reconnect) {
     if (retries < maxRetries) {
       // Exponentially increase timeout to reconnect.
       // Respectfully copied from the package `got`.
-      // eslint-disable-next-line no-mixed-operators, no-restricted-properties
+      // eslint-disable-next-line no-restricted-properties
       var retryInMs = 1000 * Math.pow(2, retries) + Math.random() * 100;
       retries += 1;
       log.info("Trying to reconnect...");
@@ -39,7 +46,11 @@ var socket = function initSocket(url, handlers, reconnect) {
       }, retryInMs);
     }
   });
-  client.onMessage(function (data) {
+  client.onMessage(
+  /**
+   * @param {any} data
+   */
+  function (data) {
     var message = JSON.parse(data);
 
     if (handlers[message.type]) {