diff --git a/.github/renovate.json5 b/.github/renovate.json5
index 4196e31..01512c3 100644
--- a/.github/renovate.json5
+++ b/.github/renovate.json5
@@ -1,6 +1,6 @@
 {
-	$schema: "https://docs.renovatebot.com/renovate-schema.json",
-	extends: ["config:base", "schedule:monthly", "group:allNonMajor"],
-	rangeStrategy: "bump",
-	packageRules: [{ depTypeList: ["peerDependencies"], enabled: false }]
+  $schema: 'https://docs.renovatebot.com/renovate-schema.json',
+  extends: ['config:base', 'schedule:monthly', 'group:allNonMajor'],
+  rangeStrategy: 'bump',
+  packageRules: [{ depTypeList: ['peerDependencies'], enabled: false }],
 }
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 86b66ab..89e91b2 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -5,9 +5,9 @@ on:
     inputs:
       version:
         type: choice
-        description: "Release Version Type"
+        description: 'Release Version Type'
         required: true
-        default: "patch"
+        default: 'patch'
         options:
           - major
           - premajor
@@ -19,9 +19,9 @@ on:
 
       tag:
         type: choice
-        description: "Release Npm Tag"
+        description: 'Release Npm Tag'
         required: true
-        default: "latest"
+        default: 'latest'
         options:
           - canary
           - nightly
@@ -31,7 +31,7 @@ on:
 
       dry_run:
         type: boolean
-        description: "DryRun release"
+        description: 'DryRun release'
         required: true
         default: false
 
@@ -58,7 +58,7 @@ jobs:
         uses: actions/setup-node@v6
         with:
           node-version: 20
-          cache: "pnpm"
+          cache: 'pnpm'
 
       # Update npm to the latest version to enable OIDC
       - name: Update npm
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index ddd974b..92a8c80 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -43,7 +43,7 @@ jobs:
         uses: actions/setup-node@v6
         with:
           node-version: ${{ matrix.node }}
-          cache: "pnpm"
+          cache: 'pnpm'
 
       - name: Install Dependencies
         run: pnpm install
@@ -70,7 +70,7 @@ jobs:
         uses: actions/setup-node@v6
         with:
           node-version: 20
-          cache: "pnpm"
+          cache: 'pnpm'
 
       - name: Install Dependencies
         run: pnpm install
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..544138b
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}
diff --git a/.prettierrc.js b/.prettierrc.js
deleted file mode 100644
index 475d811..0000000
--- a/.prettierrc.js
+++ /dev/null
@@ -1,21 +0,0 @@
-module.exports = {
-	useTabs: true,
-	tabWidth: 2,
-	trailingComma: "none",
-	arrowParens: "avoid",
-	overrides: [
-		{
-			files: "*.json",
-			options: {
-				parser: "json",
-				useTabs: false
-			}
-		},
-		{
-			files: "*.ts",
-			options: {
-				parser: "typescript"
-			}
-		}
-	]
-};
diff --git a/README.md b/README.md
index 5162fb8..6e6ee2c 100644
--- a/README.md
+++ b/README.md
@@ -75,11 +75,11 @@ While starting the development server, you can specify the configuration by the
 ```js
 // rspack.config.mjs
 export default {
-	// ...
-	devServer: {
-		// the configuration of the development server
-		port: 8080
-	}
+  // ...
+  devServer: {
+    // the configuration of the development server
+    port: 8080,
+  },
 };
 ```
 
@@ -90,21 +90,21 @@ export default {
 While it's recommended to run `@rspack/dev-server` via the CLI, you may also choose to start a server via the API.
 
 ```js
-import { RspackDevServer } from "@rspack/dev-server";
-import rspack from "@rspack/core";
-import rspackConfig from "./rspack.config.mjs";
+import { RspackDevServer } from '@rspack/dev-server';
+import rspack from '@rspack/core';
+import rspackConfig from './rspack.config.mjs';
 
 const compiler = rspack(rspackConfig);
 const devServerOptions = {
-	...rspackConfig.devServer,
-	// override
-	port: 8888
+  ...rspackConfig.devServer,
+  // override
+  port: 8888,
 };
 
 const server = new RspackDevServer(devServerOptions, compiler);
 
 server.startCallback(() => {
-	console.log("Successfully started server on http://localhost:8888");
+  console.log('Successfully started server on http://localhost:8888');
 });
 ```
 
diff --git a/biome.jsonc b/biome.jsonc
index f798737..3e1e9aa 100644
--- a/biome.jsonc
+++ b/biome.jsonc
@@ -1,11 +1,11 @@
 {
-	"$schema": "https://biomejs.dev/schemas/1.8.0/schema.json",
-	"files": {
-		"ignore": [
-			"client-src/**/*",
-			"client/**/*.js",
-			"dist/**/*",
-			"tests/fixtures/**/*"
-		]
-	}
+  "$schema": "https://biomejs.dev/schemas/1.8.0/schema.json",
+  "files": {
+    "ignore": [
+      "client-src/**/*",
+      "client/**/*.js",
+      "dist/**/*",
+      "tests/fixtures/**/*",
+    ],
+  },
 }
diff --git a/client-src/index.js b/client-src/index.js
index e76f6a3..6c33901 100644
--- a/client-src/index.js
+++ b/client-src/index.js
@@ -1,21 +1,21 @@
 // @ts-nocheck
 
-import hotEmitter from "@rspack/core/hot/emitter.js";
+import hotEmitter from '@rspack/core/hot/emitter.js';
 /* global __resourceQuery, __webpack_hash__ */
 /* Rspack dev server runtime client */
 /// <reference types="webpack/module" />
-import webpackHotLog from "@rspack/core/hot/log.js";
+import webpackHotLog from '@rspack/core/hot/log.js';
 import {
-	createOverlay,
-	formatProblem
-} from "webpack-dev-server/client/overlay.js";
-import socket from "webpack-dev-server/client/socket.js";
+  createOverlay,
+  formatProblem,
+} from 'webpack-dev-server/client/overlay.js';
+import socket from 'webpack-dev-server/client/socket.js';
 import {
-	defineProgressElement,
-	isProgressSupported
-} from "webpack-dev-server/client/progress.js";
-import { log, setLogLevel } from "webpack-dev-server/client/utils/log.js";
-import sendMessage from "webpack-dev-server/client/utils/sendMessage.js";
+  defineProgressElement,
+  isProgressSupported,
+} from 'webpack-dev-server/client/progress.js';
+import { log, setLogLevel } from 'webpack-dev-server/client/utils/log.js';
+import sendMessage from 'webpack-dev-server/client/utils/sendMessage.js';
 
 /**
  * @typedef {Object} OverlayOptions
@@ -45,290 +45,290 @@ import sendMessage from "webpack-dev-server/client/utils/sendMessage.js";
 /**
  * @param {boolean | { warnings?: boolean | string; errors?: boolean | string; runtimeErrors?: boolean | string; }} overlayOptions
  */
-const decodeOverlayOptions = overlayOptions => {
-	if (typeof overlayOptions === "object") {
-		["warnings", "errors", "runtimeErrors"].forEach(property => {
-			if (typeof overlayOptions[property] === "string") {
-				const overlayFilterFunctionString = decodeURIComponent(
-					overlayOptions[property]
-				);
-
-				// eslint-disable-next-line no-new-func
-				overlayOptions[property] = new Function(
-					"message",
-					`var callback = ${overlayFilterFunctionString}
-				return callback(message)`
-				);
-			}
-		});
-	}
+const decodeOverlayOptions = (overlayOptions) => {
+  if (typeof overlayOptions === 'object') {
+    ['warnings', 'errors', 'runtimeErrors'].forEach((property) => {
+      if (typeof overlayOptions[property] === 'string') {
+        const overlayFilterFunctionString = decodeURIComponent(
+          overlayOptions[property],
+        );
+
+        // eslint-disable-next-line no-new-func
+        overlayOptions[property] = new Function(
+          'message',
+          `var callback = ${overlayFilterFunctionString}
+				return callback(message)`,
+        );
+      }
+    });
+  }
 };
 
 /**
  * @param {string} resourceQuery
  * @returns {{ [key: string]: string | boolean }}
  */
-const parseURL = resourceQuery => {
-	/** @type {{ [key: string]: string }} */
-	let result = {};
-
-	if (typeof resourceQuery === "string" && resourceQuery !== "") {
-		const searchParams = resourceQuery.slice(1).split("&");
-
-		for (let i = 0; i < searchParams.length; i++) {
-			const pair = searchParams[i].split("=");
-
-			result[pair[0]] = decodeURIComponent(pair[1]);
-		}
-	} else {
-		// Else, get the url from the <script> this file was called with.
-		const scriptSource = getCurrentScriptSource();
-
-		let scriptSourceURL;
-
-		try {
-			// The placeholder `baseURL` with `window.location.href`,
-			// is to allow parsing of path-relative or protocol-relative URLs,
-			// and will have no effect if `scriptSource` is a fully valid URL.
-			scriptSourceURL = new URL(scriptSource, self.location.href);
-		} catch (error) {
-			// URL parsing failed, do nothing.
-			// We will still proceed to see if we can recover using `resourceQuery`
-		}
-
-		if (scriptSourceURL) {
-			result = scriptSourceURL;
-			result.fromCurrentScript = true;
-		}
-	}
-
-	return result;
+const parseURL = (resourceQuery) => {
+  /** @type {{ [key: string]: string }} */
+  let result = {};
+
+  if (typeof resourceQuery === 'string' && resourceQuery !== '') {
+    const searchParams = resourceQuery.slice(1).split('&');
+
+    for (let i = 0; i < searchParams.length; i++) {
+      const pair = searchParams[i].split('=');
+
+      result[pair[0]] = decodeURIComponent(pair[1]);
+    }
+  } else {
+    // Else, get the url from the <script> this file was called with.
+    const scriptSource = getCurrentScriptSource();
+
+    let scriptSourceURL;
+
+    try {
+      // The placeholder `baseURL` with `window.location.href`,
+      // is to allow parsing of path-relative or protocol-relative URLs,
+      // and will have no effect if `scriptSource` is a fully valid URL.
+      scriptSourceURL = new URL(scriptSource, self.location.href);
+    } catch (error) {
+      // URL parsing failed, do nothing.
+      // We will still proceed to see if we can recover using `resourceQuery`
+    }
+
+    if (scriptSourceURL) {
+      result = scriptSourceURL;
+      result.fromCurrentScript = true;
+    }
+  }
+
+  return result;
 };
 
 /**
  * @type {Status}
  */
 const status = {
-	isUnloading: false,
-	// eslint-disable-next-line camelcase
-	currentHash: __webpack_hash__
+  isUnloading: false,
+  // eslint-disable-next-line camelcase
+  currentHash: __webpack_hash__,
 };
 
 /**
  * @returns {string}
  */
 const getCurrentScriptSource = () => {
-	// `document.currentScript` is the most accurate way to find the current script,
-	// but is not supported in all browsers.
-	if (document.currentScript) {
-		return document.currentScript.getAttribute("src");
-	}
-
-	// Fallback to getting all scripts running in the document.
-	const scriptElements = document.scripts || [];
-	const scriptElementsWithSrc = Array.prototype.filter.call(
-		scriptElements,
-		element => element.getAttribute("src")
-	);
-
-	if (scriptElementsWithSrc.length > 0) {
-		const currentScript =
-			scriptElementsWithSrc[scriptElementsWithSrc.length - 1];
-
-		return currentScript.getAttribute("src");
-	}
-
-	// Fail as there was no script to use.
-	throw new Error("[webpack-dev-server] Failed to get current script source.");
+  // `document.currentScript` is the most accurate way to find the current script,
+  // but is not supported in all browsers.
+  if (document.currentScript) {
+    return document.currentScript.getAttribute('src');
+  }
+
+  // Fallback to getting all scripts running in the document.
+  const scriptElements = document.scripts || [];
+  const scriptElementsWithSrc = Array.prototype.filter.call(
+    scriptElements,
+    (element) => element.getAttribute('src'),
+  );
+
+  if (scriptElementsWithSrc.length > 0) {
+    const currentScript =
+      scriptElementsWithSrc[scriptElementsWithSrc.length - 1];
+
+    return currentScript.getAttribute('src');
+  }
+
+  // Fail as there was no script to use.
+  throw new Error('[webpack-dev-server] Failed to get current script source.');
 };
 
 const parsedResourceQuery = parseURL(__resourceQuery);
 
 const enabledFeatures = {
-	"Hot Module Replacement": false,
-	"Live Reloading": false,
-	Progress: false,
-	Overlay: false
+  'Hot Module Replacement': false,
+  'Live Reloading': false,
+  Progress: false,
+  Overlay: false,
 };
 
 /** @type {Options} */
 const options = {
-	hot: false,
-	liveReload: false,
-	progress: false,
-	overlay: false
+  hot: false,
+  liveReload: false,
+  progress: false,
+  overlay: false,
 };
 
-if (parsedResourceQuery.hot === "true") {
-	options.hot = true;
-	enabledFeatures["Hot Module Replacement"] = true;
+if (parsedResourceQuery.hot === 'true') {
+  options.hot = true;
+  enabledFeatures['Hot Module Replacement'] = true;
 }
 
-if (parsedResourceQuery["live-reload"] === "true") {
-	options.liveReload = true;
-	enabledFeatures["Live Reloading"] = true;
+if (parsedResourceQuery['live-reload'] === 'true') {
+  options.liveReload = true;
+  enabledFeatures['Live Reloading'] = true;
 }
 
-if (parsedResourceQuery.progress === "true") {
-	options.progress = true;
-	enabledFeatures.Progress = true;
+if (parsedResourceQuery.progress === 'true') {
+  options.progress = true;
+  enabledFeatures.Progress = true;
 }
 
 if (parsedResourceQuery.overlay) {
-	try {
-		options.overlay = JSON.parse(parsedResourceQuery.overlay);
-	} catch (e) {
-		log.error("Error parsing overlay options from resource query:", e);
-	}
-
-	// Fill in default "true" params for partially-specified objects.
-	if (typeof options.overlay === "object") {
-		options.overlay = {
-			errors: true,
-			warnings: true,
-			runtimeErrors: true,
-			...options.overlay
-		};
-
-		decodeOverlayOptions(options.overlay);
-	}
-	enabledFeatures.Overlay = options.overlay !== false;
+  try {
+    options.overlay = JSON.parse(parsedResourceQuery.overlay);
+  } catch (e) {
+    log.error('Error parsing overlay options from resource query:', e);
+  }
+
+  // Fill in default "true" params for partially-specified objects.
+  if (typeof options.overlay === 'object') {
+    options.overlay = {
+      errors: true,
+      warnings: true,
+      runtimeErrors: true,
+      ...options.overlay,
+    };
+
+    decodeOverlayOptions(options.overlay);
+  }
+  enabledFeatures.Overlay = options.overlay !== false;
 }
 
 if (parsedResourceQuery.logging) {
-	options.logging = parsedResourceQuery.logging;
+  options.logging = parsedResourceQuery.logging;
 }
 
-if (typeof parsedResourceQuery.reconnect !== "undefined") {
-	options.reconnect = Number(parsedResourceQuery.reconnect);
+if (typeof parsedResourceQuery.reconnect !== 'undefined') {
+  options.reconnect = Number(parsedResourceQuery.reconnect);
 }
 
 /**
  * @param {string} level
  */
-const setAllLogLevel = level => {
-	// This is needed because the HMR logger operate separately from dev server logger
-	webpackHotLog.setLogLevel(
-		level === "verbose" || level === "log" ? "info" : level
-	);
-	setLogLevel(level);
+const setAllLogLevel = (level) => {
+  // This is needed because the HMR logger operate separately from dev server logger
+  webpackHotLog.setLogLevel(
+    level === 'verbose' || level === 'log' ? 'info' : level,
+  );
+  setLogLevel(level);
 };
 
 if (options.logging) {
-	setAllLogLevel(options.logging);
+  setAllLogLevel(options.logging);
 }
 
-const logEnabledFeatures = features => {
-	const listEnabledFeatures = Object.keys(features);
-	if (!features || listEnabledFeatures.length === 0) {
-		return;
-	}
+const logEnabledFeatures = (features) => {
+  const listEnabledFeatures = Object.keys(features);
+  if (!features || listEnabledFeatures.length === 0) {
+    return;
+  }
 
-	let logString = "Server started:";
+  let logString = 'Server started:';
 
-	// Server started: Hot Module Replacement enabled, Live Reloading enabled, Overlay disabled.
-	for (let i = 0; i < listEnabledFeatures.length; i++) {
-		const key = listEnabledFeatures[i];
-		logString += ` ${key} ${features[key] ? "enabled" : "disabled"},`;
-	}
-	// replace last comma with a period
-	logString = logString.slice(0, -1).concat(".");
+  // Server started: Hot Module Replacement enabled, Live Reloading enabled, Overlay disabled.
+  for (let i = 0; i < listEnabledFeatures.length; i++) {
+    const key = listEnabledFeatures[i];
+    logString += ` ${key} ${features[key] ? 'enabled' : 'disabled'},`;
+  }
+  // replace last comma with a period
+  logString = logString.slice(0, -1).concat('.');
 
-	log.info(logString);
+  log.info(logString);
 };
 
 logEnabledFeatures(enabledFeatures);
 
-self.addEventListener("beforeunload", () => {
-	status.isUnloading = true;
+self.addEventListener('beforeunload', () => {
+  status.isUnloading = true;
 });
 
 const overlay =
-	typeof window !== "undefined"
-		? createOverlay(
-				typeof options.overlay === "object"
-					? {
-							trustedTypesPolicyName: options.overlay.trustedTypesPolicyName,
-							catchRuntimeError: options.overlay.runtimeErrors
-						}
-					: {
-							trustedTypesPolicyName: false,
-							catchRuntimeError: options.overlay
-						}
-			)
-		: { send: () => {} };
+  typeof window !== 'undefined'
+    ? createOverlay(
+        typeof options.overlay === 'object'
+          ? {
+              trustedTypesPolicyName: options.overlay.trustedTypesPolicyName,
+              catchRuntimeError: options.overlay.runtimeErrors,
+            }
+          : {
+              trustedTypesPolicyName: false,
+              catchRuntimeError: options.overlay,
+            },
+      )
+    : { send: () => {} };
 
 /**
  * @param {Options} options
  * @param {Status} currentStatus
  */
 const reloadApp = ({ hot, liveReload }, currentStatus) => {
-	if (currentStatus.isUnloading) {
-		return;
-	}
-
-	const { currentHash, previousHash } = currentStatus;
-	const isInitial =
-		currentHash.indexOf(/** @type {string} */ (previousHash)) >= 0;
-
-	if (isInitial) {
-		return;
-	}
-
-	/**
-	 * @param {Window} rootWindow
-	 * @param {number} intervalId
-	 */
-	function applyReload(rootWindow, intervalId) {
-		clearInterval(intervalId);
-
-		log.info("App updated. Reloading...");
-
-		rootWindow.location.reload();
-	}
-
-	const search = self.location.search.toLowerCase();
-	const allowToHot = search.indexOf("webpack-dev-server-hot=false") === -1;
-	const allowToLiveReload =
-		search.indexOf("webpack-dev-server-live-reload=false") === -1;
-
-	if (hot && allowToHot) {
-		log.info("App hot update...");
-
-		hotEmitter.emit("webpackHotUpdate", currentStatus.currentHash);
-
-		if (typeof self !== "undefined" && self.window) {
-			// broadcast update to window
-			self.postMessage(`webpackHotUpdate${currentStatus.currentHash}`, "*");
-		}
-	}
-	// allow refreshing the page only if liveReload isn't disabled
-	else if (liveReload && allowToLiveReload) {
-		let rootWindow = self;
-
-		// use parent window for reload (in case we're in an iframe with no valid src)
-		const intervalId = self.setInterval(() => {
-			if (rootWindow.location.protocol !== "about:") {
-				// reload immediately if protocol is valid
-				applyReload(rootWindow, intervalId);
-			} else {
-				rootWindow = rootWindow.parent;
-
-				if (rootWindow.parent === rootWindow) {
-					// if parent equals current window we've reached the root which would continue forever, so trigger a reload anyways
-					applyReload(rootWindow, intervalId);
-				}
-			}
-		});
-	}
+  if (currentStatus.isUnloading) {
+    return;
+  }
+
+  const { currentHash, previousHash } = currentStatus;
+  const isInitial =
+    currentHash.indexOf(/** @type {string} */ (previousHash)) >= 0;
+
+  if (isInitial) {
+    return;
+  }
+
+  /**
+   * @param {Window} rootWindow
+   * @param {number} intervalId
+   */
+  function applyReload(rootWindow, intervalId) {
+    clearInterval(intervalId);
+
+    log.info('App updated. Reloading...');
+
+    rootWindow.location.reload();
+  }
+
+  const search = self.location.search.toLowerCase();
+  const allowToHot = search.indexOf('webpack-dev-server-hot=false') === -1;
+  const allowToLiveReload =
+    search.indexOf('webpack-dev-server-live-reload=false') === -1;
+
+  if (hot && allowToHot) {
+    log.info('App hot update...');
+
+    hotEmitter.emit('webpackHotUpdate', currentStatus.currentHash);
+
+    if (typeof self !== 'undefined' && self.window) {
+      // broadcast update to window
+      self.postMessage(`webpackHotUpdate${currentStatus.currentHash}`, '*');
+    }
+  }
+  // allow refreshing the page only if liveReload isn't disabled
+  else if (liveReload && allowToLiveReload) {
+    let rootWindow = self;
+
+    // use parent window for reload (in case we're in an iframe with no valid src)
+    const intervalId = self.setInterval(() => {
+      if (rootWindow.location.protocol !== 'about:') {
+        // reload immediately if protocol is valid
+        applyReload(rootWindow, intervalId);
+      } else {
+        rootWindow = rootWindow.parent;
+
+        if (rootWindow.parent === rootWindow) {
+          // if parent equals current window we've reached the root which would continue forever, so trigger a reload anyways
+          applyReload(rootWindow, intervalId);
+        }
+      }
+    });
+  }
 };
 
 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"
+  [
+    '[\\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',
 );
 
 /**
@@ -340,394 +340,394 @@ const ansiRegex = new RegExp(
  * @param {string} string
  * @return {string}
  */
-const stripAnsi = string => {
-	if (typeof string !== "string") {
-		throw new TypeError(`Expected a \`string\`, got \`${typeof string}\``);
-	}
+const stripAnsi = (string) => {
+  if (typeof string !== 'string') {
+    throw new TypeError(`Expected a \`string\`, got \`${typeof string}\``);
+  }
 
-	return string.replace(ansiRegex, "");
+  return string.replace(ansiRegex, '');
 };
 
 const onSocketMessage = {
-	hot() {
-		if (parsedResourceQuery.hot === "false") {
-			return;
-		}
-
-		options.hot = true;
-	},
-	liveReload() {
-		if (parsedResourceQuery["live-reload"] === "false") {
-			return;
-		}
-
-		options.liveReload = true;
-	},
-	invalid() {
-		log.info("App updated. Recompiling...");
-
-		// Fixes #1042. overlay doesn't clear if errors are fixed but warnings remain.
-		if (options.overlay) {
-			overlay.send({ type: "DISMISS" });
-		}
-
-		sendMessage("Invalid");
-	},
-	/**
-	 * @param {string | undefined} hash
-	 */
-	hash: function hash(_hash) {
-		if (!_hash) {
-			return;
-		}
-		status.previousHash = status.currentHash;
-		status.currentHash = _hash;
-	},
-	logging: setAllLogLevel,
-	/**
-	 * @param {boolean} value
-	 */
-	overlay(value) {
-		if (typeof document === "undefined") {
-			return;
-		}
-
-		options.overlay = value;
-		decodeOverlayOptions(options.overlay);
-	},
-	/**
-	 * @param {number} value
-	 */
-	reconnect(value) {
-		if (parsedResourceQuery.reconnect === "false") {
-			return;
-		}
-
-		options.reconnect = value;
-	},
-	/**
-	 * @param {boolean} value
-	 */
-	progress(value) {
-		options.progress = value;
-	},
-	/**
-	 * @param {{ pluginName?: string, percent: number, msg: string }} data
-	 */
-	"progress-update": function progressUpdate(data) {
-		if (options.progress) {
-			log.info(
-				`${data.pluginName ? `[${data.pluginName}] ` : ""}${data.percent}% - ${
-					data.msg
-				}.`
-			);
-		}
-
-		if (isProgressSupported()) {
-			if (typeof options.progress === "string") {
-				let progress = document.querySelector("wds-progress");
-				if (!progress) {
-					defineProgressElement();
-					progress = document.createElement("wds-progress");
-					document.body.appendChild(progress);
-				}
-				progress.setAttribute("progress", data.percent);
-				progress.setAttribute("type", options.progress);
-			}
-		}
-
-		sendMessage("Progress", data);
-	},
-	"still-ok": function stillOk() {
-		log.info("Nothing changed.");
-
-		if (options.overlay) {
-			overlay.send({ type: "DISMISS" });
-		}
-
-		sendMessage("StillOk");
-	},
-	ok() {
-		sendMessage("Ok");
-
-		if (options.overlay) {
-			overlay.send({ type: "DISMISS" });
-		}
-
-		reloadApp(options, status);
-	},
-	/**
-	 * @param {string} file
-	 */
-	"static-changed": function staticChanged(file) {
-		log.info(
-			`${
-				file ? `"${file}"` : "Content"
-			} from static directory was changed. Reloading...`
-		);
-
-		self.location.reload();
-	},
-	/**
-	 * @param {Error[]} warnings
-	 * @param {any} params
-	 */
-	warnings(warnings, params) {
-		log.warn("Warnings while compiling.");
-
-		const printableWarnings = warnings.map(error => {
-			const { header, body } = formatProblem("warning", error);
-
-			return `${header}\n${stripAnsi(body)}`;
-		});
-
-		sendMessage("Warnings", printableWarnings);
-
-		for (let i = 0; i < printableWarnings.length; i++) {
-			log.warn(printableWarnings[i]);
-		}
-
-		const overlayWarningsSetting =
-			typeof options.overlay === "boolean"
-				? options.overlay
-				: options.overlay && options.overlay.warnings;
-
-		if (overlayWarningsSetting) {
-			const warningsToDisplay =
-				typeof overlayWarningsSetting === "function"
-					? warnings.filter(overlayWarningsSetting)
-					: warnings;
-
-			if (warningsToDisplay.length) {
-				overlay.send({
-					type: "BUILD_ERROR",
-					level: "warning",
-					messages: warnings
-				});
-			}
-		}
-
-		if (params && params.preventReloading) {
-			return;
-		}
-
-		reloadApp(options, status);
-	},
-	/**
-	 * @param {Error[]} errors
-	 */
-	errors(errors) {
-		log.error("Errors while compiling. Reload prevented.");
-
-		const printableErrors = errors.map(error => {
-			const { header, body } = formatProblem("error", error);
-
-			return `${header}\n${stripAnsi(body)}`;
-		});
-
-		sendMessage("Errors", printableErrors);
-
-		for (let i = 0; i < printableErrors.length; i++) {
-			log.error(printableErrors[i]);
-		}
-
-		const overlayErrorsSettings =
-			typeof options.overlay === "boolean"
-				? options.overlay
-				: options.overlay && options.overlay.errors;
-
-		if (overlayErrorsSettings) {
-			const errorsToDisplay =
-				typeof overlayErrorsSettings === "function"
-					? errors.filter(overlayErrorsSettings)
-					: errors;
-
-			if (errorsToDisplay.length) {
-				overlay.send({
-					type: "BUILD_ERROR",
-					level: "error",
-					messages: errors
-				});
-			}
-		}
-	},
-	/**
-	 * @param {Error} error
-	 */
-	error(error) {
-		log.error(error);
-	},
-	close() {
-		log.info("Disconnected!");
-
-		if (options.overlay) {
-			overlay.send({ type: "DISMISS" });
-		}
-
-		sendMessage("Close");
-	}
+  hot() {
+    if (parsedResourceQuery.hot === 'false') {
+      return;
+    }
+
+    options.hot = true;
+  },
+  liveReload() {
+    if (parsedResourceQuery['live-reload'] === 'false') {
+      return;
+    }
+
+    options.liveReload = true;
+  },
+  invalid() {
+    log.info('App updated. Recompiling...');
+
+    // Fixes #1042. overlay doesn't clear if errors are fixed but warnings remain.
+    if (options.overlay) {
+      overlay.send({ type: 'DISMISS' });
+    }
+
+    sendMessage('Invalid');
+  },
+  /**
+   * @param {string | undefined} hash
+   */
+  hash: function hash(_hash) {
+    if (!_hash) {
+      return;
+    }
+    status.previousHash = status.currentHash;
+    status.currentHash = _hash;
+  },
+  logging: setAllLogLevel,
+  /**
+   * @param {boolean} value
+   */
+  overlay(value) {
+    if (typeof document === 'undefined') {
+      return;
+    }
+
+    options.overlay = value;
+    decodeOverlayOptions(options.overlay);
+  },
+  /**
+   * @param {number} value
+   */
+  reconnect(value) {
+    if (parsedResourceQuery.reconnect === 'false') {
+      return;
+    }
+
+    options.reconnect = value;
+  },
+  /**
+   * @param {boolean} value
+   */
+  progress(value) {
+    options.progress = value;
+  },
+  /**
+   * @param {{ pluginName?: string, percent: number, msg: string }} data
+   */
+  'progress-update': function progressUpdate(data) {
+    if (options.progress) {
+      log.info(
+        `${data.pluginName ? `[${data.pluginName}] ` : ''}${data.percent}% - ${
+          data.msg
+        }.`,
+      );
+    }
+
+    if (isProgressSupported()) {
+      if (typeof options.progress === 'string') {
+        let progress = document.querySelector('wds-progress');
+        if (!progress) {
+          defineProgressElement();
+          progress = document.createElement('wds-progress');
+          document.body.appendChild(progress);
+        }
+        progress.setAttribute('progress', data.percent);
+        progress.setAttribute('type', options.progress);
+      }
+    }
+
+    sendMessage('Progress', data);
+  },
+  'still-ok': function stillOk() {
+    log.info('Nothing changed.');
+
+    if (options.overlay) {
+      overlay.send({ type: 'DISMISS' });
+    }
+
+    sendMessage('StillOk');
+  },
+  ok() {
+    sendMessage('Ok');
+
+    if (options.overlay) {
+      overlay.send({ type: 'DISMISS' });
+    }
+
+    reloadApp(options, status);
+  },
+  /**
+   * @param {string} file
+   */
+  'static-changed': function staticChanged(file) {
+    log.info(
+      `${
+        file ? `"${file}"` : 'Content'
+      } from static directory was changed. Reloading...`,
+    );
+
+    self.location.reload();
+  },
+  /**
+   * @param {Error[]} warnings
+   * @param {any} params
+   */
+  warnings(warnings, params) {
+    log.warn('Warnings while compiling.');
+
+    const printableWarnings = warnings.map((error) => {
+      const { header, body } = formatProblem('warning', error);
+
+      return `${header}\n${stripAnsi(body)}`;
+    });
+
+    sendMessage('Warnings', printableWarnings);
+
+    for (let i = 0; i < printableWarnings.length; i++) {
+      log.warn(printableWarnings[i]);
+    }
+
+    const overlayWarningsSetting =
+      typeof options.overlay === 'boolean'
+        ? options.overlay
+        : options.overlay && options.overlay.warnings;
+
+    if (overlayWarningsSetting) {
+      const warningsToDisplay =
+        typeof overlayWarningsSetting === 'function'
+          ? warnings.filter(overlayWarningsSetting)
+          : warnings;
+
+      if (warningsToDisplay.length) {
+        overlay.send({
+          type: 'BUILD_ERROR',
+          level: 'warning',
+          messages: warnings,
+        });
+      }
+    }
+
+    if (params && params.preventReloading) {
+      return;
+    }
+
+    reloadApp(options, status);
+  },
+  /**
+   * @param {Error[]} errors
+   */
+  errors(errors) {
+    log.error('Errors while compiling. Reload prevented.');
+
+    const printableErrors = errors.map((error) => {
+      const { header, body } = formatProblem('error', error);
+
+      return `${header}\n${stripAnsi(body)}`;
+    });
+
+    sendMessage('Errors', printableErrors);
+
+    for (let i = 0; i < printableErrors.length; i++) {
+      log.error(printableErrors[i]);
+    }
+
+    const overlayErrorsSettings =
+      typeof options.overlay === 'boolean'
+        ? options.overlay
+        : options.overlay && options.overlay.errors;
+
+    if (overlayErrorsSettings) {
+      const errorsToDisplay =
+        typeof overlayErrorsSettings === 'function'
+          ? errors.filter(overlayErrorsSettings)
+          : errors;
+
+      if (errorsToDisplay.length) {
+        overlay.send({
+          type: 'BUILD_ERROR',
+          level: 'error',
+          messages: errors,
+        });
+      }
+    }
+  },
+  /**
+   * @param {Error} error
+   */
+  error(error) {
+    log.error(error);
+  },
+  close() {
+    log.info('Disconnected!');
+
+    if (options.overlay) {
+      overlay.send({ type: 'DISMISS' });
+    }
+
+    sendMessage('Close');
+  },
 };
 
 /**
  * @param {{ protocol?: string, auth?: string, hostname?: string, port?: string, pathname?: string, search?: string, hash?: string, slashes?: boolean }} objURL
  * @returns {string}
  */
-const formatURL = objURL => {
-	let protocol = objURL.protocol || "";
-
-	if (protocol && protocol.substr(-1) !== ":") {
-		protocol += ":";
-	}
-
-	let auth = objURL.auth || "";
-
-	if (auth) {
-		auth = encodeURIComponent(auth);
-		auth = auth.replace(/%3A/i, ":");
-		auth += "@";
-	}
-
-	let host = "";
-
-	if (objURL.hostname) {
-		host =
-			auth +
-			(objURL.hostname.indexOf(":") === -1
-				? objURL.hostname
-				: `[${objURL.hostname}]`);
-
-		if (objURL.port) {
-			host += `:${objURL.port}`;
-		}
-	}
-
-	let pathname = objURL.pathname || "";
-
-	if (objURL.slashes) {
-		host = `//${host || ""}`;
-
-		if (pathname && pathname.charAt(0) !== "/") {
-			pathname = `/${pathname}`;
-		}
-	} else if (!host) {
-		host = "";
-	}
-
-	let search = objURL.search || "";
-
-	if (search && search.charAt(0) !== "?") {
-		search = `?${search}`;
-	}
-
-	let hash = objURL.hash || "";
-
-	if (hash && hash.charAt(0) !== "#") {
-		hash = `#${hash}`;
-	}
-
-	pathname = pathname.replace(
-		/[?#]/g,
-		/**
-		 * @param {string} match
-		 * @returns {string}
-		 */
-		match => encodeURIComponent(match)
-	);
-	search = search.replace("#", "%23");
-
-	return `${protocol}${host}${pathname}${search}${hash}`;
+const formatURL = (objURL) => {
+  let protocol = objURL.protocol || '';
+
+  if (protocol && protocol.substr(-1) !== ':') {
+    protocol += ':';
+  }
+
+  let auth = objURL.auth || '';
+
+  if (auth) {
+    auth = encodeURIComponent(auth);
+    auth = auth.replace(/%3A/i, ':');
+    auth += '@';
+  }
+
+  let host = '';
+
+  if (objURL.hostname) {
+    host =
+      auth +
+      (objURL.hostname.indexOf(':') === -1
+        ? objURL.hostname
+        : `[${objURL.hostname}]`);
+
+    if (objURL.port) {
+      host += `:${objURL.port}`;
+    }
+  }
+
+  let pathname = objURL.pathname || '';
+
+  if (objURL.slashes) {
+    host = `//${host || ''}`;
+
+    if (pathname && pathname.charAt(0) !== '/') {
+      pathname = `/${pathname}`;
+    }
+  } else if (!host) {
+    host = '';
+  }
+
+  let search = objURL.search || '';
+
+  if (search && search.charAt(0) !== '?') {
+    search = `?${search}`;
+  }
+
+  let hash = objURL.hash || '';
+
+  if (hash && hash.charAt(0) !== '#') {
+    hash = `#${hash}`;
+  }
+
+  pathname = pathname.replace(
+    /[?#]/g,
+    /**
+     * @param {string} match
+     * @returns {string}
+     */
+    (match) => encodeURIComponent(match),
+  );
+  search = search.replace('#', '%23');
+
+  return `${protocol}${host}${pathname}${search}${hash}`;
 };
 
 /**
  * @param {URL & { fromCurrentScript?: boolean }} parsedURL
  * @returns {string}
  */
-const createSocketURL = parsedURL => {
-	let { hostname } = parsedURL;
-
-	// Node.js module parses it as `::`
-	// `new URL(urlString, [baseURLString])` parses it as '[::]'
-	const isInAddrAny =
-		hostname === "0.0.0.0" || hostname === "::" || hostname === "[::]";
-
-	// why do we need this check?
-	// hostname n/a for file protocol (example, when using electron, ionic)
-	// see: https://github.com/webpack/webpack-dev-server/pull/384
-	if (
-		isInAddrAny &&
-		self.location.hostname &&
-		self.location.protocol.indexOf("http") === 0
-	) {
-		hostname = self.location.hostname;
-	}
-
-	let socketURLProtocol = parsedURL.protocol || self.location.protocol;
-
-	// When https is used in the app, secure web sockets are always necessary because the browser doesn't accept non-secure web sockets.
-	if (
-		socketURLProtocol === "auto:" ||
-		(hostname && isInAddrAny && self.location.protocol === "https:")
-	) {
-		socketURLProtocol = self.location.protocol;
-	}
-
-	socketURLProtocol = socketURLProtocol.replace(
-		/^(?:http|.+-extension|file)/i,
-		"ws"
-	);
-
-	let socketURLAuth = "";
-
-	// `new URL(urlString, [baseURLstring])` doesn't have `auth` property
-	// Parse authentication credentials in case we need them
-	if (parsedURL.username) {
-		socketURLAuth = parsedURL.username;
-
-		// Since HTTP basic authentication does not allow empty username,
-		// we only include password if the username is not empty.
-		if (parsedURL.password) {
-			// Result: <username>:<password>
-			socketURLAuth = socketURLAuth.concat(":", parsedURL.password);
-		}
-	}
-
-	// In case the host is a raw IPv6 address, it can be enclosed in
-	// the brackets as the brackets are needed in the final URL string.
-	// Need to remove those as url.format blindly adds its own set of brackets
-	// if the host string contains colons. That would lead to non-working
-	// double brackets (e.g. [[::]]) host
-	//
-	// All of these web socket url params are optionally passed in through resourceQuery,
-	// so we need to fall back to the default if they are not provided
-	const socketURLHostname = (
-		hostname ||
-		self.location.hostname ||
-		"localhost"
-	).replace(/^\[(.*)\]$/, "$1");
-
-	let socketURLPort = parsedURL.port;
-
-	if (!socketURLPort || socketURLPort === "0") {
-		socketURLPort = self.location.port;
-	}
-
-	// If path is provided it'll be passed in via the resourceQuery as a
-	// query param so it has to be parsed out of the querystring in order for the
-	// client to open the socket to the correct location.
-	let socketURLPathname = "/ws";
-
-	if (parsedURL.pathname && !parsedURL.fromCurrentScript) {
-		socketURLPathname = parsedURL.pathname;
-	}
-
-	return formatURL({
-		protocol: socketURLProtocol,
-		auth: socketURLAuth,
-		hostname: socketURLHostname,
-		port: socketURLPort,
-		pathname: socketURLPathname,
-		slashes: true
-	});
+const createSocketURL = (parsedURL) => {
+  let { hostname } = parsedURL;
+
+  // Node.js module parses it as `::`
+  // `new URL(urlString, [baseURLString])` parses it as '[::]'
+  const isInAddrAny =
+    hostname === '0.0.0.0' || hostname === '::' || hostname === '[::]';
+
+  // why do we need this check?
+  // hostname n/a for file protocol (example, when using electron, ionic)
+  // see: https://github.com/webpack/webpack-dev-server/pull/384
+  if (
+    isInAddrAny &&
+    self.location.hostname &&
+    self.location.protocol.indexOf('http') === 0
+  ) {
+    hostname = self.location.hostname;
+  }
+
+  let socketURLProtocol = parsedURL.protocol || self.location.protocol;
+
+  // When https is used in the app, secure web sockets are always necessary because the browser doesn't accept non-secure web sockets.
+  if (
+    socketURLProtocol === 'auto:' ||
+    (hostname && isInAddrAny && self.location.protocol === 'https:')
+  ) {
+    socketURLProtocol = self.location.protocol;
+  }
+
+  socketURLProtocol = socketURLProtocol.replace(
+    /^(?:http|.+-extension|file)/i,
+    'ws',
+  );
+
+  let socketURLAuth = '';
+
+  // `new URL(urlString, [baseURLstring])` doesn't have `auth` property
+  // Parse authentication credentials in case we need them
+  if (parsedURL.username) {
+    socketURLAuth = parsedURL.username;
+
+    // Since HTTP basic authentication does not allow empty username,
+    // we only include password if the username is not empty.
+    if (parsedURL.password) {
+      // Result: <username>:<password>
+      socketURLAuth = socketURLAuth.concat(':', parsedURL.password);
+    }
+  }
+
+  // In case the host is a raw IPv6 address, it can be enclosed in
+  // the brackets as the brackets are needed in the final URL string.
+  // Need to remove those as url.format blindly adds its own set of brackets
+  // if the host string contains colons. That would lead to non-working
+  // double brackets (e.g. [[::]]) host
+  //
+  // All of these web socket url params are optionally passed in through resourceQuery,
+  // so we need to fall back to the default if they are not provided
+  const socketURLHostname = (
+    hostname ||
+    self.location.hostname ||
+    'localhost'
+  ).replace(/^\[(.*)\]$/, '$1');
+
+  let socketURLPort = parsedURL.port;
+
+  if (!socketURLPort || socketURLPort === '0') {
+    socketURLPort = self.location.port;
+  }
+
+  // If path is provided it'll be passed in via the resourceQuery as a
+  // query param so it has to be parsed out of the querystring in order for the
+  // client to open the socket to the correct location.
+  let socketURLPathname = '/ws';
+
+  if (parsedURL.pathname && !parsedURL.fromCurrentScript) {
+    socketURLPathname = parsedURL.pathname;
+  }
+
+  return formatURL({
+    protocol: socketURLProtocol,
+    auth: socketURLAuth,
+    hostname: socketURLHostname,
+    port: socketURLPort,
+    pathname: socketURLPathname,
+    slashes: true,
+  });
 };
 
 const socketURL = createSocketURL(parsedResourceQuery);
diff --git a/client-src/utils/ansiHTML.ts b/client-src/utils/ansiHTML.ts
index 52094c0..74fbc5e 100644
--- a/client-src/utils/ansiHTML.ts
+++ b/client-src/utils/ansiHTML.ts
@@ -10,192 +10,196 @@
  * https://github.com/mahdyar/ansi-html-community/blob/master/LICENSE
  */
 interface AnsiHtmlTags {
-	open: typeof _openTags;
-	close: typeof _closeTags;
+  open: typeof _openTags;
+  close: typeof _closeTags;
 }
 
 type Option<T> = T | null | undefined;
 
 type Match = {
-	advance: (n: number) => void;
+  advance: (n: number) => void;
 } & Array<string>;
 
 // Reference to https://github.com/sindresorhus/ansi-regex
 const _regANSI =
-	/(?:(?:\u001b\[)|\u009b)(?:(?:[0-9]{1,3})?(?:(?:;[0-9]{0,3})*)?[A-M|f-m])|\u001b[A-M]/;
+  /(?:(?:\u001b\[)|\u009b)(?:(?:[0-9]{1,3})?(?:(?:;[0-9]{0,3})*)?[A-M|f-m])|\u001b[A-M]/;
 
 const _defColors: Record<string, string | Array<string>> = {
-	reset: ["fff", "000"], // [FOREGROUND_COLOR, BACKGROUND_COLOR]
-	black: "000",
-	red: "ff0000",
-	green: "209805",
-	yellow: "e8bf03",
-	blue: "0000ff",
-	magenta: "ff00ff",
-	cyan: "00ffee",
-	lightgrey: "f0f0f0",
-	darkgrey: "888"
+  reset: ['fff', '000'], // [FOREGROUND_COLOR, BACKGROUND_COLOR]
+  black: '000',
+  red: 'ff0000',
+  green: '209805',
+  yellow: 'e8bf03',
+  blue: '0000ff',
+  magenta: 'ff00ff',
+  cyan: '00ffee',
+  lightgrey: 'f0f0f0',
+  darkgrey: '888',
 };
 const _styles: Record<string, string> = {
-	30: "black",
-	31: "red",
-	32: "green",
-	33: "yellow",
-	34: "blue",
-	35: "magenta",
-	36: "cyan",
-	37: "lightgrey"
+  30: 'black',
+  31: 'red',
+  32: 'green',
+  33: 'yellow',
+  34: 'blue',
+  35: 'magenta',
+  36: 'cyan',
+  37: 'lightgrey',
 };
 
 const _colorMode: Record<string, string> = {
-	2: "rgb"
+  2: 'rgb',
 };
 
 const _openTags: Record<string, string | ((m: Match) => Option<string>)> = {
-	1: "font-weight:bold", // bold
-	2: "opacity:0.5", // dim
-	3: "<i>", // italic
-	4: "<u>", // underscore
-	8: "display:none", // hidden
-	9: "<del>", // delete
-	38: (match: Match) => {
-		// color
-		const mode = _colorMode[match[0]];
-		if (mode === "rgb") {
-			const r = match[1];
-			const g = match[2];
-			const b = match[3];
-			match.advance(4);
-			return `color: rgb(${r},${g},${b})`;
-		}
-	},
-	48: (match: Match) => {
-		// background color
-		const mode = _colorMode[match[0]];
-		if (mode === "rgb") {
-			const r = match[1];
-			const g = match[2];
-			const b = match[3];
-			match.advance(4);
-			return `background-color: rgb(${r},${g},${b})`;
-		}
-	}
+  1: 'font-weight:bold', // bold
+  2: 'opacity:0.5', // dim
+  3: '<i>', // italic
+  4: '<u>', // underscore
+  8: 'display:none', // hidden
+  9: '<del>', // delete
+  38: (match: Match) => {
+    // color
+    const mode = _colorMode[match[0]];
+    if (mode === 'rgb') {
+      const r = match[1];
+      const g = match[2];
+      const b = match[3];
+      match.advance(4);
+      return `color: rgb(${r},${g},${b})`;
+    }
+  },
+  48: (match: Match) => {
+    // background color
+    const mode = _colorMode[match[0]];
+    if (mode === 'rgb') {
+      const r = match[1];
+      const g = match[2];
+      const b = match[3];
+      match.advance(4);
+      return `background-color: rgb(${r},${g},${b})`;
+    }
+  },
 };
 
 const _openTagToCloseTag: Record<string, string> = {
-	3: "23",
-	4: "24",
-	9: "29"
+  3: '23',
+  4: '24',
+  9: '29',
 };
 
 const _closeTags: Record<
-	string,
-	string | ((ansiCodes: Option<Array<string>>) => string)
+  string,
+  string | ((ansiCodes: Option<Array<string>>) => string)
 > = {
-	0: ansiCodes => {
-		if (!ansiCodes) return "</span>";
-		if (!ansiCodes.length) return "";
-		let code: Option<string>;
-		let ret = "";
-		while ((code = ansiCodes.pop())) {
-			const closeTag = _openTagToCloseTag[code];
-			if (closeTag) {
-				ret += _closeTags[closeTag];
-				continue;
-			}
-			ret += "</span>";
-		}
-		return ret;
-	},
-	23: "</i>", // reset italic
-	24: "</u>", // reset underscore
-	29: "</del>" // reset delete
+  0: (ansiCodes) => {
+    if (!ansiCodes) return '</span>';
+    if (!ansiCodes.length) return '';
+    let code: Option<string>;
+    let ret = '';
+    while ((code = ansiCodes.pop())) {
+      const closeTag = _openTagToCloseTag[code];
+      if (closeTag) {
+        ret += _closeTags[closeTag];
+        continue;
+      }
+      ret += '</span>';
+    }
+    return ret;
+  },
+  23: '</i>', // reset italic
+  24: '</u>', // reset underscore
+  29: '</del>', // reset delete
 };
 
 for (const n of [21, 22, 27, 28, 39, 49]) {
-	_closeTags[n] = "</span>";
+  _closeTags[n] = '</span>';
 }
 
 /**
  * Normalize ';<seq>' | '<seq>' -> '<seq>'
  */
 function normalizeSeq(seq: Option<string>): Option<string> {
-	if (seq === null || seq === undefined) return null;
-	if (seq.startsWith(";")) {
-		return seq.slice(1);
-	}
-	return seq;
+  if (seq === null || seq === undefined) return null;
+  if (seq.startsWith(';')) {
+    return seq.slice(1);
+  }
+  return seq;
 }
 
 /**
  * Converts text with ANSI color codes to HTML markup.
  */
 export default function ansiHTML(text: string) {
-	// Returns the text if the string has no ANSI escape code.
-	if (!_regANSI.test(text)) {
-		return text;
-	}
+  // Returns the text if the string has no ANSI escape code.
+  if (!_regANSI.test(text)) {
+    return text;
+  }
 
-	// Cache opened sequence.
-	const ansiCodes: string[] = [];
-	// Replace with markup.
-	//@ts-ignore TS1487 error
-	let ret = text.replace(/\033\[(?:[0-9]{1,3})?(?:(?:;[0-9]{0,3})*)?m/g, m => {
-		const match = m.match(/(;?\d+)/g)?.map(normalizeSeq) as unknown as Match;
-		Object.defineProperty(match, "advance", {
-			value: function (count: number) {
-				this.splice(0, count);
-			}
-		});
-		let rep = "";
-		let seq: string;
-		while ((seq = match[0])) {
-			match.advance(1);
-			rep += applySeq(seq);
-		}
-		return rep;
+  // Cache opened sequence.
+  const ansiCodes: string[] = [];
+  // Replace with markup.
+  //@ts-ignore TS1487 error
+  let ret = text.replace(
+    /\033\[(?:[0-9]{1,3})?(?:(?:;[0-9]{0,3})*)?m/g,
+    (m) => {
+      const match = m.match(/(;?\d+)/g)?.map(normalizeSeq) as unknown as Match;
+      Object.defineProperty(match, 'advance', {
+        value: function (count: number) {
+          this.splice(0, count);
+        },
+      });
+      let rep = '';
+      let seq: string;
+      while ((seq = match[0])) {
+        match.advance(1);
+        rep += applySeq(seq);
+      }
+      return rep;
 
-		function applySeq(seq: string) {
-			let other = _openTags[seq];
-			if (
-				other &&
-				(other = typeof other === "function" ? (other(match) as string) : other)
-			) {
-				// If reset signal is encountered, we have to reset everything.
-				let ret = "";
-				if (seq === "0") {
-					ret += (
-						_closeTags[seq] as (ansiCodes: Option<Array<string>>) => string
-					)(ansiCodes);
-				}
-				// If current sequence has been opened, close it.
-				if (ansiCodes.indexOf(seq) !== -1) {
-					ansiCodes.pop();
-					return "</span>";
-				}
-				// Open tag.
-				ansiCodes.push(seq);
-				return ret + (other[0] === "<" ? other : `<span style="${other};">`);
-			}
+      function applySeq(seq: string) {
+        let other = _openTags[seq];
+        if (
+          other &&
+          (other =
+            typeof other === 'function' ? (other(match) as string) : other)
+        ) {
+          // If reset signal is encountered, we have to reset everything.
+          let ret = '';
+          if (seq === '0') {
+            ret += (
+              _closeTags[seq] as (ansiCodes: Option<Array<string>>) => string
+            )(ansiCodes);
+          }
+          // If current sequence has been opened, close it.
+          if (ansiCodes.indexOf(seq) !== -1) {
+            ansiCodes.pop();
+            return '</span>';
+          }
+          // Open tag.
+          ansiCodes.push(seq);
+          return ret + (other[0] === '<' ? other : `<span style="${other};">`);
+        }
 
-			const ct = _closeTags[seq];
-			if (typeof ct === "function") {
-				return ct(ansiCodes);
-			}
-			if (ct) {
-				// Pop sequence
-				ansiCodes.pop();
-				return ct;
-			}
-			return "";
-		}
-	});
+        const ct = _closeTags[seq];
+        if (typeof ct === 'function') {
+          return ct(ansiCodes);
+        }
+        if (ct) {
+          // Pop sequence
+          ansiCodes.pop();
+          return ct;
+        }
+        return '';
+      }
+    },
+  );
 
-	// Make sure tags are closed.
-	const l = ansiCodes.length;
-	l > 0 && (ret += Array(l + 1).join("</span>"));
+  // Make sure tags are closed.
+  const l = ansiCodes.length;
+  l > 0 && (ret += Array(l + 1).join('</span>'));
 
-	return ret;
+  return ret;
 }
 
 /**
@@ -203,55 +207,55 @@ export default function ansiHTML(text: string) {
  * @param {Object} colors reference to _defColors
  */
 ansiHTML.setColors = (colors: typeof _defColors) => {
-	if (typeof colors !== "object") {
-		throw new Error("`colors` parameter must be an Object.");
-	}
+  if (typeof colors !== 'object') {
+    throw new Error('`colors` parameter must be an Object.');
+  }
 
-	const _finalColors: typeof _defColors = {};
-	for (const key in _defColors) {
-		let hex = colors.hasOwnProperty(key) ? colors[key] : null;
-		if (!hex) {
-			_finalColors[key] = _defColors[key];
-			continue;
-		}
-		if ("reset" === key) {
-			if (typeof hex === "string") {
-				hex = [hex];
-			}
-			if (
-				!Array.isArray(hex) ||
-				hex.length === 0 ||
-				hex.some(h => typeof h !== "string")
-			) {
-				throw new Error(
-					`The value of \`${key}\` property must be an Array and each item could only be a hex string, e.g.: FF0000`
-				);
-			}
-			const defHexColor = _defColors[key];
-			if (!hex[0]) {
-				hex[0] = defHexColor[0];
-			}
-			if (hex.length === 1 || !hex[1]) {
-				hex = [hex[0]];
-				hex.push(defHexColor[1]);
-			}
+  const _finalColors: typeof _defColors = {};
+  for (const key in _defColors) {
+    let hex = colors.hasOwnProperty(key) ? colors[key] : null;
+    if (!hex) {
+      _finalColors[key] = _defColors[key];
+      continue;
+    }
+    if ('reset' === key) {
+      if (typeof hex === 'string') {
+        hex = [hex];
+      }
+      if (
+        !Array.isArray(hex) ||
+        hex.length === 0 ||
+        hex.some((h) => typeof h !== 'string')
+      ) {
+        throw new Error(
+          `The value of \`${key}\` property must be an Array and each item could only be a hex string, e.g.: FF0000`,
+        );
+      }
+      const defHexColor = _defColors[key];
+      if (!hex[0]) {
+        hex[0] = defHexColor[0];
+      }
+      if (hex.length === 1 || !hex[1]) {
+        hex = [hex[0]];
+        hex.push(defHexColor[1]);
+      }
 
-			hex = hex.slice(0, 2);
-		} else if (typeof hex !== "string") {
-			throw new Error(
-				`The value of \`${key}\` property must be a hex string, e.g.: FF0000`
-			);
-		}
-		_finalColors[key] = hex;
-	}
-	_setTags(_finalColors);
+      hex = hex.slice(0, 2);
+    } else if (typeof hex !== 'string') {
+      throw new Error(
+        `The value of \`${key}\` property must be a hex string, e.g.: FF0000`,
+      );
+    }
+    _finalColors[key] = hex;
+  }
+  _setTags(_finalColors);
 };
 
 /**
  * Reset colors.
  */
 ansiHTML.reset = () => {
-	_setTags(_defColors);
+  _setTags(_defColors);
 };
 
 /**
@@ -261,33 +265,33 @@ ansiHTML.reset = () => {
 ansiHTML.tags = {} as AnsiHtmlTags;
 
 if (Object.defineProperty) {
-	Object.defineProperty(ansiHTML.tags, "open", {
-		get: () => _openTags
-	});
-	Object.defineProperty(ansiHTML.tags, "close", {
-		get: () => _closeTags
-	});
+  Object.defineProperty(ansiHTML.tags, 'open', {
+    get: () => _openTags,
+  });
+  Object.defineProperty(ansiHTML.tags, 'close', {
+    get: () => _closeTags,
+  });
 } else {
-	ansiHTML.tags.open = _openTags;
-	ansiHTML.tags.close = _closeTags;
+  ansiHTML.tags.open = _openTags;
+  ansiHTML.tags.close = _closeTags;
 }
 
 function _setTags(colors: typeof _defColors) {
-	// reset all
-	_openTags["0"] =
-		`font-weight:normal;opacity:1;color:#${colors.reset[0]};background:#${colors.reset[1]}`;
-	// inverse
-	_openTags["7"] = `color:#${colors.reset[1]};background:#${colors.reset[0]}`;
-	// dark grey
-	_openTags["90"] = `color:#${colors.darkgrey}`;
+  // reset all
+  _openTags['0'] =
+    `font-weight:normal;opacity:1;color:#${colors.reset[0]};background:#${colors.reset[1]}`;
+  // inverse
+  _openTags['7'] = `color:#${colors.reset[1]};background:#${colors.reset[0]}`;
+  // dark grey
+  _openTags['90'] = `color:#${colors.darkgrey}`;
 
-	for (const code in _styles) {
-		const color = _styles[code];
-		const oriColor = colors[color] || "000";
-		_openTags[code] = `color:#${oriColor}`;
-		const codeInt = Number.parseInt(code);
-		_openTags[(codeInt + 10).toString()] = `background:#${oriColor}`;
-	}
+  for (const code in _styles) {
+    const color = _styles[code];
+    const oriColor = colors[color] || '000';
+    _openTags[code] = `color:#${oriColor}`;
+    const codeInt = Number.parseInt(code);
+    _openTags[(codeInt + 10).toString()] = `background:#${oriColor}`;
+  }
 }
 
 ansiHTML.reset();
diff --git a/jest.config.js b/jest.config.js
index 7508299..c3ba113 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -1,44 +1,44 @@
-const os = require("node:os");
-const isWin = os.platform() === "win32";
+const os = require('node:os');
+const isWin = os.platform() === 'win32';
 /** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */
 const config = {
-	preset: "ts-jest",
-	testEnvironmentOptions: {
-		url: "http://localhost/"
-	},
-	testMatch: [
-		"<rootDir>/tests/*.test.ts",
-		// TODO: enable after migrating to separated repo
-		"<rootDir>/tests/e2e/*.test.js"
-	],
-	testPathIgnorePatterns: [
-		// TODO: check why http proxy server throw error with websocket server
-		"<rootDir>/tests/e2e/allowed-hosts.test.js",
-		// TODO: check why this test timeout
-		"<rootDir>/tests/e2e/host.test.js",
-		// TODO: check why this test throw error when run with other tests
-		"<rootDir>/tests/e2e/watch-files.test.js",
-		// TODO: check why this test timeout
-		"<rootDir>/tests/e2e/web-socket-server-url.test.js"
-	],
-	cache: false,
-	testTimeout: process.env.CI ? 120000 : 30000,
-	transform: {
-		"(.*)\\.{js,ts}": [
-			"ts-jest",
-			{
-				tsconfig: "<rootDir>/tests/tsconfig.json"
-			}
-		]
-	},
-	// Add this to find out which test timeouts
-	// testSequencer: "<rootDir>/tests/helpers/sequencer.js",
-	snapshotResolver: "<rootDir>/tests/helpers/snapshot-resolver.js",
-	setupFilesAfterEnv: ["<rootDir>/tests/helpers/setup-test.js"],
-	globalSetup: "<rootDir>/tests/helpers/global-setup-test.js",
-	moduleNameMapper: {
-		"^uuid$": require.resolve("uuid")
-	}
+  preset: 'ts-jest',
+  testEnvironmentOptions: {
+    url: 'http://localhost/',
+  },
+  testMatch: [
+    '<rootDir>/tests/*.test.ts',
+    // TODO: enable after migrating to separated repo
+    '<rootDir>/tests/e2e/*.test.js',
+  ],
+  testPathIgnorePatterns: [
+    // TODO: check why http proxy server throw error with websocket server
+    '<rootDir>/tests/e2e/allowed-hosts.test.js',
+    // TODO: check why this test timeout
+    '<rootDir>/tests/e2e/host.test.js',
+    // TODO: check why this test throw error when run with other tests
+    '<rootDir>/tests/e2e/watch-files.test.js',
+    // TODO: check why this test timeout
+    '<rootDir>/tests/e2e/web-socket-server-url.test.js',
+  ],
+  cache: false,
+  testTimeout: process.env.CI ? 120000 : 30000,
+  transform: {
+    '(.*)\\.{js,ts}': [
+      'ts-jest',
+      {
+        tsconfig: '<rootDir>/tests/tsconfig.json',
+      },
+    ],
+  },
+  // Add this to find out which test timeouts
+  // testSequencer: "<rootDir>/tests/helpers/sequencer.js",
+  snapshotResolver: '<rootDir>/tests/helpers/snapshot-resolver.js',
+  setupFilesAfterEnv: ['<rootDir>/tests/helpers/setup-test.js'],
+  globalSetup: '<rootDir>/tests/helpers/global-setup-test.js',
+  moduleNameMapper: {
+    '^uuid$': require.resolve('uuid'),
+  },
 };
 
 module.exports = config;
diff --git a/package.json b/package.json
index 4943098..c586333 100644
--- a/package.json
+++ b/package.json
@@ -34,13 +34,18 @@
     "pre-commit": "npx nano-staged"
   },
   "nano-staged": {
-    "*.{yaml,yml,json,md,json5}": ["npm rum format"],
+    "*.{yaml,yml,json,md,json5}": [
+      "npm rum format"
+    ],
     "*.{js,jsx,ts,tsx,mjs,cjs}": [
       "npm run format",
       "biome lint --write --no-errors-on-unmatched"
     ]
   },
-  "files": ["dist", "client"],
+  "files": [
+    "dist",
+    "client"
+  ],
   "engines": {
     "node": ">= 18.12.0"
   },
diff --git a/scripts/patch-node-env.cjs b/scripts/patch-node-env.cjs
index 1589478..d32fcf7 100644
--- a/scripts/patch-node-env.cjs
+++ b/scripts/patch-node-env.cjs
@@ -1,18 +1,18 @@
 // Copied from <https://github.com/webpack/webpack/blob/main/test/patch-node-env.js>
 //
 const NodeEnvironment =
-	// For jest@29
-	require("jest-environment-node").TestEnvironment ||
-	// For jest@27
-	require("jest-environment-node");
+  // For jest@29
+  require('jest-environment-node').TestEnvironment ||
+  // For jest@27
+  require('jest-environment-node');
 
 class CustomEnvironment extends NodeEnvironment {
-	// Workaround for `Symbol('JEST_STATE_SYMBOL')`
-	async handleTestEvent(event, state) {
-		if (!this.global.JEST_STATE_SYMBOL) {
-			this.global.JEST_STATE_SYMBOL = state;
-		}
-	}
+  // Workaround for `Symbol('JEST_STATE_SYMBOL')`
+  async handleTestEvent(event, state) {
+    if (!this.global.JEST_STATE_SYMBOL) {
+      this.global.JEST_STATE_SYMBOL = state;
+    }
+  }
 }
 
 module.exports = CustomEnvironment;
diff --git a/scripts/release.mjs b/scripts/release.mjs
index 3770571..243ecfe 100644
--- a/scripts/release.mjs
+++ b/scripts/release.mjs
@@ -1,22 +1,22 @@
-import path from "node:path";
-import * as url from "node:url";
-import { $ } from "execa";
-import fs from "fs-extra";
-import { inc } from "semver";
+import path from 'node:path';
+import * as url from 'node:url';
+import { $ } from 'execa';
+import fs from 'fs-extra';
+import { inc } from 'semver';
 
-const RELEASE_TAG = process.env.TAG || "beta";
-const RELEASE_DRY_RUN = process.env.DRY_RUN || "true";
-const RELEASE_VERSION_TYPE = process.env.VERSION || "prerelease";
+const RELEASE_TAG = process.env.TAG || 'beta';
+const RELEASE_DRY_RUN = process.env.DRY_RUN || 'true';
+const RELEASE_VERSION_TYPE = process.env.VERSION || 'prerelease';
 
-const __dirname = url.fileURLToPath(new URL(".", import.meta.url));
-const PKG_PATH = path.resolve(__dirname, "../package.json");
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
+const PKG_PATH = path.resolve(__dirname, '../package.json');
 const pkg = fs.readJsonSync(PKG_PATH);
 const currentVersion = pkg.version;
 const nextVersion = inc(currentVersion, RELEASE_VERSION_TYPE);
 if (!nextVersion) {
-	throw new Error(
-		`Failed to generate next version from "${currentVersion}" with type "${RELEASE_VERSION_TYPE}"`
-	);
+  throw new Error(
+    `Failed to generate next version from "${currentVersion}" with type "${RELEASE_VERSION_TYPE}"`,
+  );
 }
 
 console.info(`Release ${RELEASE_TAG} version ${nextVersion}`);
@@ -28,43 +28,43 @@ fs.writeJsonSync(PKG_PATH, pkg, { spaces: 2 });
 
 // Publish to npm
 console.info(`Publishing to npm with tag ${RELEASE_TAG}`);
-const dryRun = RELEASE_DRY_RUN === "true" ? ["--dry-run"] : [];
+const dryRun = RELEASE_DRY_RUN === 'true' ? ['--dry-run'] : [];
 try {
-	await $`pnpm publish ${dryRun} --tag ${RELEASE_TAG} --no-git-checks --provenance`;
-	console.info("Published successfully");
+  await $`pnpm publish ${dryRun} --tag ${RELEASE_TAG} --no-git-checks --provenance`;
+  console.info('Published successfully');
 } catch (e) {
-	console.error(`Publish failed: ${e.message}`);
-	process.exit(1);
+  console.error(`Publish failed: ${e.message}`);
+  process.exit(1);
 } finally {
 }
 
 // Push tag to github
-if (RELEASE_DRY_RUN !== "true") {
-	console.info("Pushing tag to github");
-	const tagName = `v${nextVersion}`;
-	try {
-		await $`git config --global --add safe.directory /github/workspace`;
-		await $`git config --global user.name "github-actions[bot]"`;
-		await $`git config --global user.email "github-actions[bot]@users.noreply.github.com"`;
-		await $`git status`;
-		await $`git tag ${tagName}`;
-		await $`git push origin ${tagName}`;
-		console.info("Pushed tag successfully");
-	} catch (e) {
-		console.error(`Push tag failed: ${e.message}`);
-		process.exit(1);
-	}
+if (RELEASE_DRY_RUN !== 'true') {
+  console.info('Pushing tag to github');
+  const tagName = `v${nextVersion}`;
+  try {
+    await $`git config --global --add safe.directory /github/workspace`;
+    await $`git config --global user.name "github-actions[bot]"`;
+    await $`git config --global user.email "github-actions[bot]@users.noreply.github.com"`;
+    await $`git status`;
+    await $`git tag ${tagName}`;
+    await $`git push origin ${tagName}`;
+    console.info('Pushed tag successfully');
+  } catch (e) {
+    console.error(`Push tag failed: ${e.message}`);
+    process.exit(1);
+  }
 
-	try {
-		await $`git add --all`;
-		const commitMsg = `release ${tagName}`;
-		await $`git commit -m ${commitMsg}`;
-		await $`git push`;
-		console.info("Pushed branch successfully");
-	} catch (e) {
-		console.error(`Update branch failed: ${e.message}`);
-		process.exit(1);
-	}
+  try {
+    await $`git add --all`;
+    const commitMsg = `release ${tagName}`;
+    await $`git commit -m ${commitMsg}`;
+    await $`git push`;
+    console.info('Pushed branch successfully');
+  } catch (e) {
+    console.error(`Update branch failed: ${e.message}`);
+    process.exit(1);
+  }
 }
 
-console.info("Release completed");
+console.info('Release completed');
diff --git a/src/config.ts b/src/config.ts
index 762d9b2..3476fc6 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -1,26 +1,26 @@
-import type { DevServer } from "@rspack/core";
-import type WebpackDevServer from "webpack-dev-server";
+import type { DevServer } from '@rspack/core';
+import type WebpackDevServer from 'webpack-dev-server';
 
 export type { DevServer };
 
 export interface ResolvedDevServer extends DevServer {
-	port: number | string;
-	static: false | Array<WebpackDevServer.NormalizedStatic>;
-	devMiddleware: DevServer["devMiddleware"];
-	hot: boolean | "only";
-	host?: string;
-	open: WebpackDevServer.Open[];
-	magicHtml: boolean;
-	liveReload: boolean;
-	webSocketServer: false | WebpackDevServer.WebSocketServerConfiguration;
-	proxy: Required<DevServer["proxy"]>;
-	client: WebpackDevServer.ClientConfiguration;
-	allowedHosts: "auto" | string[] | "all";
-	bonjour: false | Record<string, never> | WebpackDevServer.BonjourOptions;
-	compress: boolean;
-	historyApiFallback: false | WebpackDevServer.ConnectHistoryApiFallbackOptions;
-	server: WebpackDevServer.ServerConfiguration;
-	ipc: string | undefined;
-	setupExitSignals: boolean;
-	watchFiles: WebpackDevServer.WatchFiles[];
+  port: number | string;
+  static: false | Array<WebpackDevServer.NormalizedStatic>;
+  devMiddleware: DevServer['devMiddleware'];
+  hot: boolean | 'only';
+  host?: string;
+  open: WebpackDevServer.Open[];
+  magicHtml: boolean;
+  liveReload: boolean;
+  webSocketServer: false | WebpackDevServer.WebSocketServerConfiguration;
+  proxy: Required<DevServer['proxy']>;
+  client: WebpackDevServer.ClientConfiguration;
+  allowedHosts: 'auto' | string[] | 'all';
+  bonjour: false | Record<string, never> | WebpackDevServer.BonjourOptions;
+  compress: boolean;
+  historyApiFallback: false | WebpackDevServer.ConnectHistoryApiFallbackOptions;
+  server: WebpackDevServer.ServerConfiguration;
+  ipc: string | undefined;
+  setupExitSignals: boolean;
+  watchFiles: WebpackDevServer.WatchFiles[];
 }
diff --git a/src/index.ts b/src/index.ts
index b3be3ab..8b20f05 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,2 +1,2 @@
-export { RspackDevServer } from "./server";
-export type { DevServer as Configuration } from "@rspack/core";
+export { RspackDevServer } from './server';
+export type { DevServer as Configuration } from '@rspack/core';
diff --git a/src/patch.ts b/src/patch.ts
index 357b682..fb04fe2 100644
--- a/src/patch.ts
+++ b/src/patch.ts
@@ -1,35 +1,35 @@
-import WebpackDevServer from "webpack-dev-server";
+import WebpackDevServer from 'webpack-dev-server';
 
-let old: InstanceType<typeof WebpackDevServer>["sendStats"] | undefined;
+let old: InstanceType<typeof WebpackDevServer>['sendStats'] | undefined;
 
 function restoreDevServerPatch() {
-	// @ts-expect-error private API
-	WebpackDevServer.prototype.sendStats = old;
+  // @ts-expect-error private API
+  WebpackDevServer.prototype.sendStats = old;
 }
 
 // Patch webpack-dev-server to prevent it from failing to send stats.
 // See https://github.com/web-infra-dev/rspack/pull/4028 for details.
 function applyDevServerPatch() {
-	if (old) return restoreDevServerPatch;
+  if (old) return restoreDevServerPatch;
 
-	// @ts-expect-error private API
-	old = WebpackDevServer.prototype.sendStats;
+  // @ts-expect-error private API
+  old = WebpackDevServer.prototype.sendStats;
 
-	// @ts-expect-error private API
-	WebpackDevServer.prototype.sendStats = function sendStats__rspack_patched(
-		// @ts-expect-error
-		...args
-	) {
-		const stats = args[1];
+  // @ts-expect-error private API
+  WebpackDevServer.prototype.sendStats = function sendStats__rspack_patched(
+    // @ts-expect-error
+    ...args
+  ) {
+    const stats = args[1];
 
-		if (!stats) {
-			return;
-		}
+    if (!stats) {
+      return;
+    }
 
-		return old.apply(this, args);
-	};
+    return old.apply(this, args);
+  };
 
-	return restoreDevServerPatch;
+  return restoreDevServerPatch;
 }
 
 export { applyDevServerPatch };
diff --git a/src/server.ts b/src/server.ts
index 0176ded..36cf84f 100644
--- a/src/server.ts
+++ b/src/server.ts
@@ -7,116 +7,116 @@
  * Copyright (c) JS Foundation and other contributors
  * https://github.com/webpack/webpack-dev-server/blob/b0f15ace0123c125d5870609ef4691c141a6d187/LICENSE
  */
-import type { Server } from "node:http";
-import type { Socket } from "node:net";
-import type { Compiler, MultiCompiler } from "@rspack/core";
-import type { FSWatcher } from "chokidar";
-import WebpackDevServer from "webpack-dev-server";
+import type { Server } from 'node:http';
+import type { Socket } from 'node:net';
+import type { Compiler, MultiCompiler } from '@rspack/core';
+import type { FSWatcher } from 'chokidar';
+import WebpackDevServer from 'webpack-dev-server';
 // @ts-ignore 'package.json' is not under 'rootDir'
-import { version } from "../package.json";
+import { version } from '../package.json';
 
-import type { DevServer, ResolvedDevServer } from "./config";
-import { applyDevServerPatch } from "./patch";
+import type { DevServer, ResolvedDevServer } from './config';
+import { applyDevServerPatch } from './patch';
 
 applyDevServerPatch();
 
 const getFreePort = async function getFreePort(port: string, host: string) {
-	if (typeof port !== "undefined" && port !== null && port !== "auto") {
-		return port;
-	}
-
-	const { default: pRetry } = await import("p-retry");
-	const getPort = require("webpack-dev-server/lib/getPort");
-	const basePort =
-		typeof process.env.WEBPACK_DEV_SERVER_BASE_PORT !== "undefined"
-			? Number.parseInt(process.env.WEBPACK_DEV_SERVER_BASE_PORT, 10)
-			: 8080;
-
-	// Try to find unused port and listen on it for 3 times,
-	// if port is not specified in options.
-	const defaultPortRetry =
-		typeof process.env.WEBPACK_DEV_SERVER_PORT_RETRY !== "undefined"
-			? Number.parseInt(process.env.WEBPACK_DEV_SERVER_PORT_RETRY, 10)
-			: 3;
-
-	return pRetry(() => getPort(basePort, host), {
-		retries: defaultPortRetry
-	});
+  if (typeof port !== 'undefined' && port !== null && port !== 'auto') {
+    return port;
+  }
+
+  const { default: pRetry } = await import('p-retry');
+  const getPort = require('webpack-dev-server/lib/getPort');
+  const basePort =
+    typeof process.env.WEBPACK_DEV_SERVER_BASE_PORT !== 'undefined'
+      ? Number.parseInt(process.env.WEBPACK_DEV_SERVER_BASE_PORT, 10)
+      : 8080;
+
+  // Try to find unused port and listen on it for 3 times,
+  // if port is not specified in options.
+  const defaultPortRetry =
+    typeof process.env.WEBPACK_DEV_SERVER_PORT_RETRY !== 'undefined'
+      ? Number.parseInt(process.env.WEBPACK_DEV_SERVER_PORT_RETRY, 10)
+      : 3;
+
+  return pRetry(() => getPort(basePort, host), {
+    retries: defaultPortRetry,
+  });
 };
 
 WebpackDevServer.getFreePort = getFreePort;
 
 function isMultiCompiler(
-	compiler: Compiler | MultiCompiler
+  compiler: Compiler | MultiCompiler,
 ): compiler is MultiCompiler {
-	return Array.isArray((compiler as MultiCompiler).compilers);
+  return Array.isArray((compiler as MultiCompiler).compilers);
 }
 
 export class RspackDevServer extends WebpackDevServer {
-	static getFreePort = getFreePort;
-	/**
-	 * resolved after `normalizedOptions`
-	 */
-	/** @ts-ignore: types of path data of rspack is not compatible with webpack */
-	declare options: ResolvedDevServer;
-
-	declare staticWatchers: FSWatcher[];
-
-	declare sockets: Socket[];
-
-	declare server: Server;
-	// TODO: remove @ts-ignore here
-	/** @ts-ignore */
-	public compiler: Compiler | MultiCompiler;
-	public webSocketServer:
-		| WebpackDevServer.WebSocketServerImplementation
-		| undefined;
-	static version: string = version;
-
-	constructor(options: DevServer, compiler: Compiler | MultiCompiler) {
-		// biome-ignore lint/suspicious/noExplicitAny: _
-		super(options as WebpackDevServer.Configuration, compiler as any);
-		// override
-	}
-
-	async initialize() {
-		const compilers = isMultiCompiler(this.compiler)
-			? this.compiler.compilers
-			: [this.compiler];
-
-		for (const compiler of compilers) {
-			const mode = compiler.options.mode || process.env.NODE_ENV;
-			if (this.options.hot) {
-				if (mode === "production") {
-					this.logger.warn(
-						"Hot Module Replacement (HMR) is enabled for the production build. \n" +
-							"Make sure to disable HMR for production by setting `devServer.hot` to `false` in the configuration."
-					);
-				}
-
-				compiler.options.resolve.alias = {
-					"ansi-html-community": require.resolve(
-						"@rspack/dev-server/client/utils/ansiHTML"
-					),
-					...compiler.options.resolve.alias
-				};
-			}
-		}
-
-		// @ts-expect-error
-		await super.initialize();
-	}
-
-	getClientEntry(): string {
-		return require.resolve("@rspack/dev-server/client/index");
-	}
-
-	getClientHotEntry(): string | undefined {
-		if (this.options.hot === "only") {
-			return require.resolve("@rspack/core/hot/only-dev-server");
-		}
-		if (this.options.hot) {
-			return require.resolve("@rspack/core/hot/dev-server");
-		}
-	}
+  static getFreePort = getFreePort;
+  /**
+   * resolved after `normalizedOptions`
+   */
+  /** @ts-ignore: types of path data of rspack is not compatible with webpack */
+  declare options: ResolvedDevServer;
+
+  declare staticWatchers: FSWatcher[];
+
+  declare sockets: Socket[];
+
+  declare server: Server;
+  // TODO: remove @ts-ignore here
+  /** @ts-ignore */
+  public compiler: Compiler | MultiCompiler;
+  public webSocketServer:
+    | WebpackDevServer.WebSocketServerImplementation
+    | undefined;
+  static version: string = version;
+
+  constructor(options: DevServer, compiler: Compiler | MultiCompiler) {
+    // biome-ignore lint/suspicious/noExplicitAny: _
+    super(options as WebpackDevServer.Configuration, compiler as any);
+    // override
+  }
+
+  async initialize() {
+    const compilers = isMultiCompiler(this.compiler)
+      ? this.compiler.compilers
+      : [this.compiler];
+
+    for (const compiler of compilers) {
+      const mode = compiler.options.mode || process.env.NODE_ENV;
+      if (this.options.hot) {
+        if (mode === 'production') {
+          this.logger.warn(
+            'Hot Module Replacement (HMR) is enabled for the production build. \n' +
+              'Make sure to disable HMR for production by setting `devServer.hot` to `false` in the configuration.',
+          );
+        }
+
+        compiler.options.resolve.alias = {
+          'ansi-html-community': require.resolve(
+            '@rspack/dev-server/client/utils/ansiHTML',
+          ),
+          ...compiler.options.resolve.alias,
+        };
+      }
+    }
+
+    // @ts-expect-error
+    await super.initialize();
+  }
+
+  getClientEntry(): string {
+    return require.resolve('@rspack/dev-server/client/index');
+  }
+
+  getClientHotEntry(): string | undefined {
+    if (this.options.hot === 'only') {
+      return require.resolve('@rspack/core/hot/only-dev-server');
+    }
+    if (this.options.hot) {
+      return require.resolve('@rspack/core/hot/dev-server');
+    }
+  }
 }
diff --git a/tests/ansiHTML.test.ts b/tests/ansiHTML.test.ts
index 5fa24bb..2024d2d 100644
--- a/tests/ansiHTML.test.ts
+++ b/tests/ansiHTML.test.ts
@@ -1,30 +1,30 @@
-import ansiHTML from "../client-src/utils/ansiHTML";
+import ansiHTML from '../client-src/utils/ansiHTML';
 
-describe("ansi-html", () => {
-	it("should transform 24-bit rgb ansi colors", () => {
-		expect(ansiHTML("\u001b[38;2;255;30;30m×\u001b[0m")).toMatchInlineSnapshot(
-			`"<span style="color: rgb(255,30,30);">×</span><span style="font-weight:normal;opacity:1;color:#fff;background:#000;"></span>"`
-		);
-	});
+describe('ansi-html', () => {
+  it('should transform 24-bit rgb ansi colors', () => {
+    expect(ansiHTML('\u001b[38;2;255;30;30m×\u001b[0m')).toMatchInlineSnapshot(
+      `"<span style="color: rgb(255,30,30);">×</span><span style="font-weight:normal;opacity:1;color:#fff;background:#000;"></span>"`,
+    );
+  });
 
-	it("should transform 24-bit rgb ansi colors with additional properties", () => {
-		expect(
-			ansiHTML("[\u001b[38;2;92;157;255;1;4m/root/index.js\u001b[0m:1:1]")
-		).toMatchInlineSnapshot(
-			`"[<span style="color: rgb(92,157,255);"><span style="font-weight:bold;"><u>/root/index.js</u></span></span><span style="font-weight:normal;opacity:1;color:#fff;background:#000;">:1:1]</span>"`
-		);
-	});
+  it('should transform 24-bit rgb ansi colors with additional properties', () => {
+    expect(
+      ansiHTML('[\u001b[38;2;92;157;255;1;4m/root/index.js\u001b[0m:1:1]'),
+    ).toMatchInlineSnapshot(
+      `"[<span style="color: rgb(92,157,255);"><span style="font-weight:bold;"><u>/root/index.js</u></span></span><span style="font-weight:normal;opacity:1;color:#fff;background:#000;">:1:1]</span>"`,
+    );
+  });
 
-	it("should transform basic ansi colors", () => {
-		expect(ansiHTML("\u001b[0mcontent")).toMatchInlineSnapshot(
-			`"<span style="font-weight:normal;opacity:1;color:#fff;background:#000;">content</span>"`
-		);
-		expect(
-			ansiHTML(
-				"\u001b[33m<\u001b[39m\u001b[33mheader\u001b[39m\u001b[33m>\u001b[39m"
-			)
-		).toMatchInlineSnapshot(
-			`"<span style="color:#e8bf03;"><</span><span style="color:#e8bf03;">header</span><span style="color:#e8bf03;">></span>"`
-		);
-	});
+  it('should transform basic ansi colors', () => {
+    expect(ansiHTML('\u001b[0mcontent')).toMatchInlineSnapshot(
+      `"<span style="font-weight:normal;opacity:1;color:#fff;background:#000;">content</span>"`,
+    );
+    expect(
+      ansiHTML(
+        '\u001b[33m<\u001b[39m\u001b[33mheader\u001b[39m\u001b[33m>\u001b[39m',
+      ),
+    ).toMatchInlineSnapshot(
+      `"<span style="color:#e8bf03;"><</span><span style="color:#e8bf03;">header</span><span style="color:#e8bf03;">></span>"`,
+    );
+  });
 });
diff --git a/tests/e2e/allowed-hosts.test.js b/tests/e2e/allowed-hosts.test.js
index a2eaeb9..277acfe 100644
--- a/tests/e2e/allowed-hosts.test.js
+++ b/tests/e2e/allowed-hosts.test.js
@@ -1,1499 +1,1499 @@
-const express = require("express");
-const webpack = require("@rspack/core");
-const { createProxyMiddleware } = require("http-proxy-middleware");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const [port1, port2] = require("../helpers/ports-map")["allowed-hosts"];
-
-const webSocketServers = ["ws", "sockjs"];
-
-describe("allowed hosts", () => {
-	for (const webSocketServer of webSocketServers) {
-		it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "host" header ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("host", "my-test-host");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "host" header when "server: 'https'" is enabled ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2,
-						protocol: "ws"
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto",
-				server: "https"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("host", "my-test-host");
-						},
-						target: `https://${devServerHost}:${devServerPort}`,
-						secure: false,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "origin" header ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using localhost to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "localhost";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using "127.0.0.1" host to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using "[::1] host to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "::1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://[${devServerHost}]:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://[${proxyHost}]:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using "file:" protocol to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "file:///path/to/local/file.js");
-						},
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using "chrome-extension:" protocol to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "chrome-extension:///abcdef");
-						},
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom hostname to web socket server with the "all" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom hostname to web socket server with the "all" value in array ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: ["all"]
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom hostname to web socket server with the custom hostname value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "my-test-origin.com"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom hostname to web socket server with the custom hostname value starting with dot ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: ".my-test-origin.com"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom sub hostname to web socket server with the custom hostname value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: ".my-test-origin.com"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader(
-								"origin",
-								"http://foo.bar.baz.my-test-origin.com/"
-							);
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should connect web socket client using custom hostname to web socket server with the multiple custom hostname values ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: ["my-test-origin.com"]
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReqWs: proxyReq => {
-							proxyReq.setHeader("origin", "http://my-test-origin.com/");
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should disconnect web client using localhost to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port2
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "auto"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						// Emulation
-						onProxyReq: (proxyReq, req, res) => {
-							proxyReq.setHeader("host", "unknown");
-							res.setHeader("host", devServerHost);
-						},
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const html = await page.content();
-
-				expect(html).toMatchSnapshot("html");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
-
-	describe("check host headers", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(() => {
-			compiler = webpack(config);
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should always allow `localhost` if options.allowedHosts is auto", async () => {
-			const options = {
-				allowedHosts: "auto",
-				port: port1
-			};
-
-			const headers = {
-				host: "localhost"
-			};
-
-			server = new Server(options, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			if (!server.checkHeader(headers, "host")) {
-				throw new Error("Validation didn't fail");
-			}
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should always allow `localhost` subdomain if options.allowedHosts is auto", async () => {
-			const options = {
-				allowedHosts: "auto",
-				port: port1
-			};
-
-			const headers = {
-				host: "app.localhost"
-			};
-
-			server = new Server(options, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			if (!server.checkHeader(headers, "host")) {
-				throw new Error("Validation didn't fail");
-			}
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+const express = require('express');
+const webpack = require('@rspack/core');
+const { createProxyMiddleware } = require('http-proxy-middleware');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const [port1, port2] = require('../helpers/ports-map')['allowed-hosts'];
+
+const webSocketServers = ['ws', 'sockjs'];
+
+describe('allowed hosts', () => {
+  for (const webSocketServer of webSocketServers) {
+    it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "host" header ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('host', 'my-test-host');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "host" header when "server: 'https'" is enabled ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+            protocol: 'ws',
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+        server: 'https',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('host', 'my-test-host');
+            },
+            target: `https://${devServerHost}:${devServerPort}`,
+            secure: false,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should disconnect web socket client using custom hostname from web socket server with the "auto" value based on the "origin" header ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using localhost to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = 'localhost';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using "127.0.0.1" host to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using "[::1] host to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '::1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://[${devServerHost}]:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://[${proxyHost}]:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using "file:" protocol to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'file:///path/to/local/file.js');
+            },
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using "chrome-extension:" protocol to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'chrome-extension:///abcdef');
+            },
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom hostname to web socket server with the "all" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom hostname to web socket server with the "all" value in array ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: ['all'],
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom hostname to web socket server with the custom hostname value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'my-test-origin.com',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom hostname to web socket server with the custom hostname value starting with dot ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: '.my-test-origin.com',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom sub hostname to web socket server with the custom hostname value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: '.my-test-origin.com',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader(
+                'origin',
+                'http://foo.bar.baz.my-test-origin.com/',
+              );
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should connect web socket client using custom hostname to web socket server with the multiple custom hostname values ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: ['my-test-origin.com'],
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReqWs: (proxyReq) => {
+              proxyReq.setHeader('origin', 'http://my-test-origin.com/');
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should disconnect web client using localhost to web socket server with the "auto" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port2,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'auto',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            // Emulation
+            onProxyReq: (proxyReq, req, res) => {
+              proxyReq.setHeader('host', 'unknown');
+              res.setHeader('host', devServerHost);
+            },
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const html = await page.content();
+
+        expect(html).toMatchSnapshot('html');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
+
+  describe('check host headers', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(() => {
+      compiler = webpack(config);
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should always allow `localhost` if options.allowedHosts is auto', async () => {
+      const options = {
+        allowedHosts: 'auto',
+        port: port1,
+      };
+
+      const headers = {
+        host: 'localhost',
+      };
+
+      server = new Server(options, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      if (!server.checkHeader(headers, 'host')) {
+        throw new Error("Validation didn't fail");
+      }
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should always allow `localhost` subdomain if options.allowedHosts is auto', async () => {
+      const options = {
+        allowedHosts: 'auto',
+        port: port1,
+      };
+
+      const headers = {
+        host: 'app.localhost',
+      };
+
+      server = new Server(options, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      if (!server.checkHeader(headers, 'host')) {
+        throw new Error("Validation didn't fail");
+      }
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should always allow value from the `host` options if options.allowedHosts is auto", async () => {
-			const networkIP = Server.internalIPSync("v4");
-			const options = {
-				host: networkIP,
-				allowedHosts: "auto",
-				port: port1
-			};
+    it('should always allow value from the `host` options if options.allowedHosts is auto', async () => {
+      const networkIP = Server.internalIPSync('v4');
+      const options = {
+        host: networkIP,
+        allowedHosts: 'auto',
+        port: port1,
+      };
 
-			const headers = {
-				host: networkIP
-			};
+      const headers = {
+        host: networkIP,
+      };
 
-			server = new Server(options, compiler);
+      server = new Server(options, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://${networkIP}:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://${networkIP}:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			if (!server.checkHeader(headers, "host")) {
-				throw new Error("Validation didn't fail");
-			}
+      if (!server.checkHeader(headers, 'host')) {
+        throw new Error("Validation didn't fail");
+      }
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should always allow value of the `host` option from the `client.webSocketURL` option if options.allowedHosts is auto", async () => {
-			const options = {
-				allowedHosts: "auto",
-				port: port1,
-				client: {
-					webSocketURL: "ws://test.host:80"
-				}
-			};
+    it('should always allow value of the `host` option from the `client.webSocketURL` option if options.allowedHosts is auto', async () => {
+      const options = {
+        allowedHosts: 'auto',
+        port: port1,
+        client: {
+          webSocketURL: 'ws://test.host:80',
+        },
+      };
 
-			const headers = {
-				host: "test.host"
-			};
+      const headers = {
+        host: 'test.host',
+      };
 
-			server = new Server(options, compiler);
+      server = new Server(options, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			if (!server.checkHeader(headers, "host")) {
-				throw new Error("Validation didn't fail");
-			}
+      if (!server.checkHeader(headers, 'host')) {
+        throw new Error("Validation didn't fail");
+      }
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should always allow any host if options.allowedHosts is all", async () => {
-			const options = {
-				allowedHosts: "all",
-				port: port1
-			};
-			const headers = {
-				host: "bad.host"
-			};
+    it('should always allow any host if options.allowedHosts is all', async () => {
+      const options = {
+        allowedHosts: 'all',
+        port: port1,
+      };
+      const headers = {
+        host: 'bad.host',
+      };
 
-			server = new Server(options, compiler);
+      server = new Server(options, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			if (!server.checkHeader(headers, "host")) {
-				throw new Error("Validation didn't fail");
-			}
+      if (!server.checkHeader(headers, 'host')) {
+        throw new Error("Validation didn't fail");
+      }
 
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should allow hosts in allowedHosts", async () => {
-			const tests = ["test.host", "test2.host", "test3.host"];
-			const options = {
-				allowedHosts: tests,
-				port: port1
-			};
+    it('should allow hosts in allowedHosts', async () => {
+      const tests = ['test.host', 'test2.host', 'test3.host'];
+      const options = {
+        allowedHosts: tests,
+        port: port1,
+      };
 
-			server = new Server(options, compiler);
+      server = new Server(options, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			for (const test of tests) {
-				const headers = { host: test };
+      for (const test of tests) {
+        const headers = { host: test };
 
-				if (!server.checkHeader(headers, "host")) {
-					throw new Error("Validation didn't fail");
-				}
-			}
+        if (!server.checkHeader(headers, 'host')) {
+          throw new Error("Validation didn't fail");
+        }
+      }
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should allow hosts that pass a wildcard in allowedHosts", async () => {
-			const options = {
-				allowedHosts: [".example.com"],
-				port: port1
-			};
+    it('should allow hosts that pass a wildcard in allowedHosts', async () => {
+      const options = {
+        allowedHosts: ['.example.com'],
+        port: port1,
+      };
 
-			server = new Server(options, compiler);
+      server = new Server(options, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port1}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			const tests = [
-				"www.example.com",
-				"subdomain.example.com",
-				"example.com",
-				"subsubcomain.subdomain.example.com",
-				"example.com:80",
-				"subdomain.example.com:80"
-			];
+      const tests = [
+        'www.example.com',
+        'subdomain.example.com',
+        'example.com',
+        'subsubcomain.subdomain.example.com',
+        'example.com:80',
+        'subdomain.example.com:80',
+      ];
 
-			for (const test of tests) {
-				const headers = { host: test };
+      for (const test of tests) {
+        const headers = { host: test };
 
-				if (!server.checkHeader(headers, "host")) {
-					throw new Error("Validation didn't fail");
-				}
-			}
+        if (!server.checkHeader(headers, 'host')) {
+          throw new Error("Validation didn't fail");
+        }
+      }
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/api.test.js b/tests/e2e/api.test.js
index 21d4f11..2a33d7a 100644
--- a/tests/e2e/api.test.js
+++ b/tests/e2e/api.test.js
@@ -1,780 +1,780 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const sessionSubscribe = require("../helpers/session-subscribe");
-const port = require("../helpers/ports-map").api;
-
-describe("API", () => {
-	describe("WEBPACK_SERVE environment variable", () => {
-		const OLD_ENV = process.env;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			// this is important - it clears the cache
-			jest.resetModules();
-
-			process.env = { ...OLD_ENV };
-
-			process.env.WEBPACK_SERVE = undefined;
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			process.env = OLD_ENV;
-		});
-
-		it("should be present", async () => {
-			expect(process.env.WEBPACK_SERVE).toBeUndefined();
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const {
-				RspackDevServer: WebpackDevServer
-			} = require("@rspack/dev-server");
-
-			const compiler = webpack(config);
-			server = new WebpackDevServer({ port }, compiler);
-
-			await server.start();
-
-			expect(process.env.WEBPACK_SERVE).toBe("true");
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("latest async API", () => {
-		it("should work with async API", async () => {
-			const compiler = webpack(config);
-			const server = new Server({ port }, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it("should work with callback API", async () => {
-			const compiler = webpack(config);
-			const server = new Server({ port }, compiler);
-
-			await new Promise(resolve => {
-				server.startCallback(() => {
-					resolve();
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await new Promise(resolve => {
-					server.stopCallback(() => {
-						resolve();
-					});
-				});
-			}
-		});
-
-		it("should catch errors within startCallback", async () => {
-			const compiler = webpack(config);
-			const server = new Server(
-				{ port, static: "https://absolute-url.com/somewhere" },
-				compiler
-			);
-
-			await new Promise(resolve => {
-				server.startCallback(err => {
-					expect(err.message).toEqual(
-						"Using a URL as static.directory is not supported"
-					);
-					resolve();
-				});
-			});
-
-			await new Promise(resolve => {
-				server.stopCallback(() => {
-					resolve();
-				});
-			});
-		});
-
-		it("should work when using configured manually", async () => {
-			const compiler = webpack({
-				...config,
-				entry: [
-					"@rspack/core/hot/dev-server.js",
-					`@rspack/dev-server/client/index.js?hot=true&live-reload=true"`,
-					path.resolve(__dirname, "../fixtures/client-config/foo.js")
-				],
-				plugins: [...config.plugins, new webpack.HotModuleReplacementPlugin()]
-			});
-			const server = new Server({ port, hot: false, client: false }, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it("should work and allow to rerun dev server multiple times", async () => {
-			const compiler = webpack(config);
-			const server = new Server({ port }, compiler);
-
-			await server.start();
-
-			const { page: firstPage, browser } = await runBrowser();
-
-			try {
-				const firstPageErrors = [];
-				const firstConsoleMessages = [];
-
-				firstPage
-					.on("console", message => {
-						firstConsoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						firstPageErrors.push(error);
-					});
-
-				await firstPage.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					firstConsoleMessages.map(message => message.text())
-				).toMatchSnapshot("console messages");
-				expect(firstPageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await server.stop();
-			}
-
-			await server.start();
-
-			const secondPage = await runBrowser.runPage(browser);
-
-			try {
-				// const secondPageErrors = [];
-				// const secondConsoleMessages = [];
-				// secondPage
-				//   .on("console", (message) => {
-				//     secondConsoleMessages.push(message);
-				//   })
-				//   .on("pageerror", (error) => {
-				//     secondPageErrors.push(error);
-				//   });
-				// await secondPage.goto(`http://127.0.0.1:${port}/`, {
-				//   waitUntil: "networkidle0",
-				// });
-				// expect(
-				//   secondConsoleMessages.map((message) => message.text()),
-				// ).toMatchSnapshot("console messages");
-				// expect(secondPageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	});
-
-	describe("Invalidate callback", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			server = new Server({ port, static: false }, compiler);
-
-			await server.start();
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should use the default `noop` callback when invalidate is called without any callback", async () => {
-			const callback = jest.fn();
-
-			server.invalidate();
-			server.middleware.context.callbacks[0] = callback;
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(callback).toHaveBeenCalledTimes(1);
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should use the provided `callback` function", async () => {
-			const callback = jest.fn();
-
-			server.invalidate(callback);
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(callback).toHaveBeenCalledTimes(1);
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("Server.getFreePort", () => {
-		let dummyServers = [];
-		let devServerPort;
-
-		afterEach(() => {
-			process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = undefined;
-
-			return dummyServers
-				.reduce(
-					(p, server) =>
-						p.then(
-							() =>
-								new Promise(resolve => {
-									server.stopCallback(() => {
-										resolve();
-									});
-								})
-						),
-					Promise.resolve()
-				)
-				.then(() => {
-					dummyServers = [];
-				});
-		});
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const sessionSubscribe = require('../helpers/session-subscribe');
+const port = require('../helpers/ports-map').api;
+
+describe('API', () => {
+  describe('WEBPACK_SERVE environment variable', () => {
+    const OLD_ENV = process.env;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      // this is important - it clears the cache
+      jest.resetModules();
+
+      process.env = { ...OLD_ENV };
+
+      process.env.WEBPACK_SERVE = undefined;
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      process.env = OLD_ENV;
+    });
+
+    it('should be present', async () => {
+      expect(process.env.WEBPACK_SERVE).toBeUndefined();
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const {
+        RspackDevServer: WebpackDevServer,
+      } = require('@rspack/dev-server');
+
+      const compiler = webpack(config);
+      server = new WebpackDevServer({ port }, compiler);
+
+      await server.start();
+
+      expect(process.env.WEBPACK_SERVE).toBe('true');
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('latest async API', () => {
+    it('should work with async API', async () => {
+      const compiler = webpack(config);
+      const server = new Server({ port }, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it('should work with callback API', async () => {
+      const compiler = webpack(config);
+      const server = new Server({ port }, compiler);
+
+      await new Promise((resolve) => {
+        server.startCallback(() => {
+          resolve();
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await new Promise((resolve) => {
+          server.stopCallback(() => {
+            resolve();
+          });
+        });
+      }
+    });
+
+    it('should catch errors within startCallback', async () => {
+      const compiler = webpack(config);
+      const server = new Server(
+        { port, static: 'https://absolute-url.com/somewhere' },
+        compiler,
+      );
+
+      await new Promise((resolve) => {
+        server.startCallback((err) => {
+          expect(err.message).toEqual(
+            'Using a URL as static.directory is not supported',
+          );
+          resolve();
+        });
+      });
+
+      await new Promise((resolve) => {
+        server.stopCallback(() => {
+          resolve();
+        });
+      });
+    });
+
+    it('should work when using configured manually', async () => {
+      const compiler = webpack({
+        ...config,
+        entry: [
+          '@rspack/core/hot/dev-server.js',
+          `@rspack/dev-server/client/index.js?hot=true&live-reload=true"`,
+          path.resolve(__dirname, '../fixtures/client-config/foo.js'),
+        ],
+        plugins: [...config.plugins, new webpack.HotModuleReplacementPlugin()],
+      });
+      const server = new Server({ port, hot: false, client: false }, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it('should work and allow to rerun dev server multiple times', async () => {
+      const compiler = webpack(config);
+      const server = new Server({ port }, compiler);
+
+      await server.start();
+
+      const { page: firstPage, browser } = await runBrowser();
+
+      try {
+        const firstPageErrors = [];
+        const firstConsoleMessages = [];
+
+        firstPage
+          .on('console', (message) => {
+            firstConsoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            firstPageErrors.push(error);
+          });
+
+        await firstPage.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          firstConsoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(firstPageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await server.stop();
+      }
+
+      await server.start();
+
+      const secondPage = await runBrowser.runPage(browser);
+
+      try {
+        // const secondPageErrors = [];
+        // const secondConsoleMessages = [];
+        // secondPage
+        //   .on("console", (message) => {
+        //     secondConsoleMessages.push(message);
+        //   })
+        //   .on("pageerror", (error) => {
+        //     secondPageErrors.push(error);
+        //   });
+        // await secondPage.goto(`http://127.0.0.1:${port}/`, {
+        //   waitUntil: "networkidle0",
+        // });
+        // expect(
+        //   secondConsoleMessages.map((message) => message.text()),
+        // ).toMatchSnapshot("console messages");
+        // expect(secondPageErrors).toMatchSnapshot("page errors");
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  });
+
+  describe('Invalidate callback', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      server = new Server({ port, static: false }, compiler);
+
+      await server.start();
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should use the default `noop` callback when invalidate is called without any callback', async () => {
+      const callback = jest.fn();
+
+      server.invalidate();
+      server.middleware.context.callbacks[0] = callback;
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(callback).toHaveBeenCalledTimes(1);
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should use the provided `callback` function', async () => {
+      const callback = jest.fn();
+
+      server.invalidate(callback);
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(callback).toHaveBeenCalledTimes(1);
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('Server.getFreePort', () => {
+    let dummyServers = [];
+    let devServerPort;
+
+    afterEach(() => {
+      process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = undefined;
+
+      return dummyServers
+        .reduce(
+          (p, server) =>
+            p.then(
+              () =>
+                new Promise((resolve) => {
+                  server.stopCallback(() => {
+                    resolve();
+                  });
+                }),
+            ),
+          Promise.resolve(),
+        )
+        .then(() => {
+          dummyServers = [];
+        });
+    });
 
-		function createDummyServers(n) {
-			process.env.WEBPACK_DEV_SERVER_BASE_PORT = 60000;
+    function createDummyServers(n) {
+      process.env.WEBPACK_DEV_SERVER_BASE_PORT = 60000;
 
-			return (Array.isArray(n) ? n : [...new Array(n)]).reduce(
-				(p, _, i) =>
-					p.then(
-						() =>
-							new Promise(resolve => {
-								devServerPort = 60000 + i;
-								const compiler = webpack(config);
-								const server = new Server(
-									{ port: devServerPort, host: "0.0.0.0" },
-									compiler
-								);
+      return (Array.isArray(n) ? n : [...new Array(n)]).reduce(
+        (p, _, i) =>
+          p.then(
+            () =>
+              new Promise((resolve) => {
+                devServerPort = 60000 + i;
+                const compiler = webpack(config);
+                const server = new Server(
+                  { port: devServerPort, host: '0.0.0.0' },
+                  compiler,
+                );
 
-								dummyServers.push(server);
+                dummyServers.push(server);
 
-								server.startCallback(() => {
-									resolve();
-								});
-							})
-					),
-				Promise.resolve()
-			);
-		}
+                server.startCallback(() => {
+                  resolve();
+                });
+              }),
+          ),
+        Promise.resolve(),
+      );
+    }
 
-		it("should return the port when the port is specified", async () => {
-			const retryCount = 1;
+    it('should return the port when the port is specified', async () => {
+      const retryCount = 1;
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
 
-			const freePort = await Server.getFreePort(9082);
+      const freePort = await Server.getFreePort(9082);
 
-			expect(freePort).toEqual(9082);
-		});
+      expect(freePort).toEqual(9082);
+    });
 
-		it("should return the port when the port is `null`", async () => {
-			const retryCount = 2;
+    it('should return the port when the port is `null`', async () => {
+      const retryCount = 2;
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
 
-			await createDummyServers(retryCount);
+      await createDummyServers(retryCount);
 
-			const freePort = await Server.getFreePort(null);
+      const freePort = await Server.getFreePort(null);
 
-			expect(freePort).toEqual(60000 + retryCount);
+      expect(freePort).toEqual(60000 + retryCount);
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			const pageErrors = [];
-			const consoleMessages = [];
+      const pageErrors = [];
+      const consoleMessages = [];
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
+      expect(pageErrors).toMatchSnapshot('page errors');
 
-			await browser.close();
-		});
+      await browser.close();
+    });
 
-		it("should return the port when the port is undefined", async () => {
-			const retryCount = 3;
+    it('should return the port when the port is undefined', async () => {
+      const retryCount = 3;
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
 
-			await createDummyServers(retryCount);
+      await createDummyServers(retryCount);
 
-			// eslint-disable-next-line no-undefined
-			const freePort = await Server.getFreePort(undefined);
+      // eslint-disable-next-line no-undefined
+      const freePort = await Server.getFreePort(undefined);
 
-			expect(freePort).toEqual(60000 + retryCount);
+      expect(freePort).toEqual(60000 + retryCount);
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			const pageErrors = [];
-			const consoleMessages = [];
+      const pageErrors = [];
+      const consoleMessages = [];
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
+      expect(pageErrors).toMatchSnapshot('page errors');
 
-			await browser.close();
-		});
+      await browser.close();
+    });
 
-		it("should retry finding the port for up to defaultPortRetry times (number)", async () => {
-			const retryCount = 4;
+    it('should retry finding the port for up to defaultPortRetry times (number)', async () => {
+      const retryCount = 4;
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
 
-			await createDummyServers(retryCount);
+      await createDummyServers(retryCount);
 
-			const freePort = await Server.getFreePort();
+      const freePort = await Server.getFreePort();
 
-			expect(freePort).toEqual(60000 + retryCount);
+      expect(freePort).toEqual(60000 + retryCount);
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			const pageErrors = [];
-			const consoleMessages = [];
+      const pageErrors = [];
+      const consoleMessages = [];
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
+      expect(pageErrors).toMatchSnapshot('page errors');
 
-			await browser.close();
-		});
+      await browser.close();
+    });
 
-		it("should retry finding the port for up to defaultPortRetry times (string)", async () => {
-			const retryCount = 5;
+    it('should retry finding the port for up to defaultPortRetry times (string)', async () => {
+      const retryCount = 5;
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = retryCount;
 
-			await createDummyServers(retryCount);
+      await createDummyServers(retryCount);
 
-			const freePort = await Server.getFreePort();
+      const freePort = await Server.getFreePort();
 
-			expect(freePort).toEqual(60000 + retryCount);
+      expect(freePort).toEqual(60000 + retryCount);
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			const pageErrors = [];
-			const consoleMessages = [];
+      const pageErrors = [];
+      const consoleMessages = [];
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			expect(response.status()).toMatchSnapshot("response status");
+      expect(response.status()).toMatchSnapshot('response status');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
+      expect(pageErrors).toMatchSnapshot('page errors');
 
-			await browser.close();
-		});
+      await browser.close();
+    });
 
-		it("should retry finding the port when serial ports are busy", async () => {
-			const busyPorts = [60000, 60001, 60002, 60003, 60004, 60005];
+    it('should retry finding the port when serial ports are busy', async () => {
+      const busyPorts = [60000, 60001, 60002, 60003, 60004, 60005];
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = 1000;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = 1000;
 
-			await createDummyServers(busyPorts);
+      await createDummyServers(busyPorts);
 
-			const freePort = await Server.getFreePort();
+      const freePort = await Server.getFreePort();
 
-			expect(freePort).toBeGreaterThan(60005);
+      expect(freePort).toBeGreaterThan(60005);
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
 
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
 
-				const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
-					waitUntil: "networkidle0"
-				});
+        const response = await page.goto(`http://127.0.0.1:${devServerPort}/`, {
+          waitUntil: 'networkidle0',
+        });
 
-				expect(response.status()).toMatchSnapshot("response status");
+        expect(response.status()).toMatchSnapshot('response status');
 
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
 
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-			}
-		});
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+      }
+    });
 
-		it("should throw the error when the port isn't found", async () => {
-			expect.assertions(1);
+    it("should throw the error when the port isn't found", async () => {
+      expect.assertions(1);
 
-			jest.mock(
-				"webpack-dev-server/lib/getPort",
-				() => () => Promise.reject(new Error("busy"))
-			);
+      jest.mock(
+        'webpack-dev-server/lib/getPort',
+        () => () => Promise.reject(new Error('busy')),
+      );
 
-			process.env.WEBPACK_DEV_SERVER_PORT_RETRY = 1;
+      process.env.WEBPACK_DEV_SERVER_PORT_RETRY = 1;
 
-			try {
-				await Server.getFreePort();
-			} catch (error) {
-				expect(error.message).toMatchSnapshot();
-			}
-		});
-	});
+      try {
+        await Server.getFreePort();
+      } catch (error) {
+        expect(error.message).toMatchSnapshot();
+      }
+    });
+  });
 
-	describe("Server.checkHostHeader", () => {
-		it("should allow access for every requests using an IP", () => {
-			const options = {
-				allowedHosts: "all"
-			};
-
-			const tests = [
-				"192.168.1.123",
-				"192.168.1.2:8080",
-				"[::1]",
-				"[::1]:8080",
-				"[ad42::1de2:54c2:c2fa:1234]",
-				"[ad42::1de2:54c2:c2fa:1234]:8080"
-			];
-
-			const compiler = webpack(config);
-			const server = new Server(options, compiler);
-
-			for (const test of tests) {
-				const headers = { host: test };
-
-				if (!server.isValidHost(headers, "host")) {
-					throw new Error("Validation didn't pass");
-				}
-			}
-		});
-
-		it('should allow URLs with scheme for checking origin when the "option.client.webSocketURL" is object', async () => {
-			const options = {
-				port,
-				client: {
-					reconnect: false,
-					webSocketURL: {
-						hostname: "test.host"
-					}
-				},
-				webSocketServer: "ws"
-			};
-			const headers = {
-				origin: "https://test.host"
-			};
-
-			const compiler = webpack(config);
-			const server = new Server(options, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-				const session = await page.target().createCDPSession();
-
-				session.on("Network.webSocketCreated", test => {
-					webSocketRequests.push(test);
-				});
-
-				await session.send("Target.setAutoAttach", {
-					autoAttach: true,
-					flatten: true,
-					waitForDebuggerOnStart: true
-				});
-
-				sessionSubscribe(session);
-
-				try {
-					const response = await page.goto(`http://localhost:${port}/`, {
-						waitUntil: "networkidle0"
-					});
-
-					if (!server.isValidHost(headers, "origin")) {
-						throw new Error("Validation didn't fail");
-					}
-
-					await new Promise(resolve => {
-						const interval = setInterval(() => {
-							const needFinish = consoleMessages.filter(message =>
-								/Trying to reconnect/.test(message.text())
-							);
-
-							if (needFinish.length > 0) {
-								clearInterval(interval);
-								resolve();
-							}
-						}, 100);
-					});
-
-					expect(webSocketRequests[0].url).toMatchSnapshot("web socket URL");
-
-					expect(response.status()).toMatchSnapshot("response status");
-
-					// TODO: not stable on lynx linux ci
-					// expect(
-					//   // net::ERR_NAME_NOT_RESOLVED can be multiple times
-					//   consoleMessages.map(message => message.text()).slice(0, 7)
-					// ).toMatchSnapshot("console messages");
-
-					expect(pageErrors).toMatchSnapshot("page errors");
-				} catch (error) {
-					if (error.code === "EACCES") {
-						// Retry mechanism for EACCES errors
-						const maxRetries = 3;
-						const retryKey = `retry_${expect.getState().currentTestName}`;
-
-						// Get current retry count or initialize to 0
-						global[retryKey] = global[retryKey] || 0;
-						global[retryKey] += 1;
-
-						if (global[retryKey] < maxRetries) {
-							console.warn(
-								`EACCES error encountered (attempt ${global[retryKey]}/${maxRetries}): ${error.message}. Retrying...`
-							);
-							// Re-run the current test
-							return it.currentTest.fn();
-						}
-					}
-					throw error;
-				}
-			} catch (error) {
-				if (error.code === "EACCES") {
-					// Retry mechanism for EACCES errors
-					const maxRetries = 3;
-					const retryKey = `retry_${expect.getState().currentTestName}`;
-
-					// Get current retry count or initialize to 0
-					global[retryKey] = global[retryKey] || 0;
-					global[retryKey] += 1;
-
-					if (global[retryKey] < maxRetries) {
-						console.warn(
-							`EACCES error encountered (attempt ${global[retryKey]}/${maxRetries}): ${error.message}. Retrying...`
-						);
-						// Re-run the current test
-						return it.currentTest.fn();
-					}
-				}
-				throw error;
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	});
+  describe('Server.checkHostHeader', () => {
+    it('should allow access for every requests using an IP', () => {
+      const options = {
+        allowedHosts: 'all',
+      };
+
+      const tests = [
+        '192.168.1.123',
+        '192.168.1.2:8080',
+        '[::1]',
+        '[::1]:8080',
+        '[ad42::1de2:54c2:c2fa:1234]',
+        '[ad42::1de2:54c2:c2fa:1234]:8080',
+      ];
+
+      const compiler = webpack(config);
+      const server = new Server(options, compiler);
+
+      for (const test of tests) {
+        const headers = { host: test };
+
+        if (!server.isValidHost(headers, 'host')) {
+          throw new Error("Validation didn't pass");
+        }
+      }
+    });
+
+    it('should allow URLs with scheme for checking origin when the "option.client.webSocketURL" is object', async () => {
+      const options = {
+        port,
+        client: {
+          reconnect: false,
+          webSocketURL: {
+            hostname: 'test.host',
+          },
+        },
+        webSocketServer: 'ws',
+      };
+      const headers = {
+        origin: 'https://test.host',
+      };
+
+      const compiler = webpack(config);
+      const server = new Server(options, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+        const session = await page.target().createCDPSession();
+
+        session.on('Network.webSocketCreated', (test) => {
+          webSocketRequests.push(test);
+        });
+
+        await session.send('Target.setAutoAttach', {
+          autoAttach: true,
+          flatten: true,
+          waitForDebuggerOnStart: true,
+        });
+
+        sessionSubscribe(session);
+
+        try {
+          const response = await page.goto(`http://localhost:${port}/`, {
+            waitUntil: 'networkidle0',
+          });
+
+          if (!server.isValidHost(headers, 'origin')) {
+            throw new Error("Validation didn't fail");
+          }
+
+          await new Promise((resolve) => {
+            const interval = setInterval(() => {
+              const needFinish = consoleMessages.filter((message) =>
+                /Trying to reconnect/.test(message.text()),
+              );
+
+              if (needFinish.length > 0) {
+                clearInterval(interval);
+                resolve();
+              }
+            }, 100);
+          });
+
+          expect(webSocketRequests[0].url).toMatchSnapshot('web socket URL');
+
+          expect(response.status()).toMatchSnapshot('response status');
+
+          // TODO: not stable on lynx linux ci
+          // expect(
+          //   // net::ERR_NAME_NOT_RESOLVED can be multiple times
+          //   consoleMessages.map(message => message.text()).slice(0, 7)
+          // ).toMatchSnapshot("console messages");
+
+          expect(pageErrors).toMatchSnapshot('page errors');
+        } catch (error) {
+          if (error.code === 'EACCES') {
+            // Retry mechanism for EACCES errors
+            const maxRetries = 3;
+            const retryKey = `retry_${expect.getState().currentTestName}`;
+
+            // Get current retry count or initialize to 0
+            global[retryKey] = global[retryKey] || 0;
+            global[retryKey] += 1;
+
+            if (global[retryKey] < maxRetries) {
+              console.warn(
+                `EACCES error encountered (attempt ${global[retryKey]}/${maxRetries}): ${error.message}. Retrying...`,
+              );
+              // Re-run the current test
+              return it.currentTest.fn();
+            }
+          }
+          throw error;
+        }
+      } catch (error) {
+        if (error.code === 'EACCES') {
+          // Retry mechanism for EACCES errors
+          const maxRetries = 3;
+          const retryKey = `retry_${expect.getState().currentTestName}`;
+
+          // Get current retry count or initialize to 0
+          global[retryKey] = global[retryKey] || 0;
+          global[retryKey] += 1;
+
+          if (global[retryKey] < maxRetries) {
+            console.warn(
+              `EACCES error encountered (attempt ${global[retryKey]}/${maxRetries}): ${error.message}. Retrying...`,
+            );
+            // Re-run the current test
+            return it.currentTest.fn();
+          }
+        }
+        throw error;
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  });
 });
diff --git a/tests/e2e/app.test.js b/tests/e2e/app.test.js
index a185c71..a6bc3c6 100644
--- a/tests/e2e/app.test.js
+++ b/tests/e2e/app.test.js
@@ -1,179 +1,179 @@
-const fs = require("node:fs");
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const wdm = require("webpack-dev-middleware");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").app;
+const fs = require('node:fs');
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const wdm = require('webpack-dev-middleware');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').app;
 
 const staticDirectory = path.resolve(
-	__dirname,
-	"../fixtures/static-config/public"
+  __dirname,
+  '../fixtures/static-config/public',
 );
 
 const apps = [
-	["express", () => require("express")(), "http"],
-	["express", () => require("express")(), "https"],
-	["express", () => require("express")(), "spdy"],
-	["connect", () => require("connect")(), "http"],
-	["connect", () => require("connect")(), "https"],
-	["connect", () => require("connect")(), "spdy"],
-	["connect", () => require("connect")(), "http2"],
-	["connect (async)", () => require("connect")(), "http"],
-	[
-		"hono",
-		() => new (require("hono").Hono)(),
-		(options, app) =>
-			require("@hono/node-server").createAdaptorServer({
-				fetch: app.fetch
-			}),
-		(_, devServer) => [
-			{
-				name: "webpack-dev-middleware",
-				middleware: wdm.honoWrapper(devServer.compiler)
-			}
-		]
-	],
-	[
-		"hono",
-		() => new (require("hono").Hono)(),
-		(_, app) =>
-			require("@hono/node-server").createAdaptorServer({
-				fetch: app.fetch,
-				createServer: require("node:https").createServer,
-				serverOptions: {
-					key: fs.readFileSync(
-						path.resolve(__dirname, "../fixtures/ssl/localhost-privkey.pem")
-					),
-					cert: fs.readFileSync(
-						path.resolve(__dirname, "../fixtures/ssl/localhost-cert.pem")
-					)
-				}
-			}),
-		(_, devServer) => [
-			{
-				name: "webpack-dev-middleware",
-				middleware: wdm.honoWrapper(devServer.compiler)
-			}
-		]
-	],
-	[
-		"hono",
-		() => new (require("hono").Hono)(),
-		{
-			type: (options, app) =>
-				require("@hono/node-server").createAdaptorServer({
-					fetch: app.fetch,
-					createServer: require("node:http2").createSecureServer,
-					serverOptions: options
-				}),
-			options: {
-				allowHTTP1: true,
-				key: fs.readFileSync(
-					path.resolve(__dirname, "../fixtures/ssl/localhost-privkey.pem")
-				),
-				cert: fs.readFileSync(
-					path.resolve(__dirname, "../fixtures/ssl/localhost-cert.pem")
-				)
-			}
-		},
-		(_, devServer) => [
-			{
-				name: "webpack-dev-middleware",
-				middleware: wdm.honoWrapper(devServer.compiler)
-			}
-		]
-	]
+  ['express', () => require('express')(), 'http'],
+  ['express', () => require('express')(), 'https'],
+  ['express', () => require('express')(), 'spdy'],
+  ['connect', () => require('connect')(), 'http'],
+  ['connect', () => require('connect')(), 'https'],
+  ['connect', () => require('connect')(), 'spdy'],
+  ['connect', () => require('connect')(), 'http2'],
+  ['connect (async)', () => require('connect')(), 'http'],
+  [
+    'hono',
+    () => new (require('hono').Hono)(),
+    (options, app) =>
+      require('@hono/node-server').createAdaptorServer({
+        fetch: app.fetch,
+      }),
+    (_, devServer) => [
+      {
+        name: 'webpack-dev-middleware',
+        middleware: wdm.honoWrapper(devServer.compiler),
+      },
+    ],
+  ],
+  [
+    'hono',
+    () => new (require('hono').Hono)(),
+    (_, app) =>
+      require('@hono/node-server').createAdaptorServer({
+        fetch: app.fetch,
+        createServer: require('node:https').createServer,
+        serverOptions: {
+          key: fs.readFileSync(
+            path.resolve(__dirname, '../fixtures/ssl/localhost-privkey.pem'),
+          ),
+          cert: fs.readFileSync(
+            path.resolve(__dirname, '../fixtures/ssl/localhost-cert.pem'),
+          ),
+        },
+      }),
+    (_, devServer) => [
+      {
+        name: 'webpack-dev-middleware',
+        middleware: wdm.honoWrapper(devServer.compiler),
+      },
+    ],
+  ],
+  [
+    'hono',
+    () => new (require('hono').Hono)(),
+    {
+      type: (options, app) =>
+        require('@hono/node-server').createAdaptorServer({
+          fetch: app.fetch,
+          createServer: require('node:http2').createSecureServer,
+          serverOptions: options,
+        }),
+      options: {
+        allowHTTP1: true,
+        key: fs.readFileSync(
+          path.resolve(__dirname, '../fixtures/ssl/localhost-privkey.pem'),
+        ),
+        cert: fs.readFileSync(
+          path.resolve(__dirname, '../fixtures/ssl/localhost-cert.pem'),
+        ),
+      },
+    },
+    (_, devServer) => [
+      {
+        name: 'webpack-dev-middleware',
+        middleware: wdm.honoWrapper(devServer.compiler),
+      },
+    ],
+  ],
 ];
 
-describe("app option", () => {
-	for (const [appName, app, server, setupMiddlewares] of apps) {
-		let compiler;
-		let devServer;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
+describe('app option', () => {
+  for (const [appName, app, server, setupMiddlewares] of apps) {
+    let compiler;
+    let devServer;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
 
-		describe(`should work using "${appName}" application and "${typeof server === "function" ? "custom server" : server}" server`, () => {
-			beforeEach(async () => {
-				compiler = webpack(config);
+    describe(`should work using "${appName}" application and "${typeof server === 'function' ? 'custom server' : server}" server`, () => {
+      beforeEach(async () => {
+        compiler = webpack(config);
 
-				devServer = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						app,
-						server,
-						port,
-						setupMiddlewares:
-							typeof setupMiddlewares !== "undefined"
-								? setupMiddlewares
-								: // eslint-disable-next-line no-undefined
-									undefined
-					},
-					compiler
-				);
+        devServer = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            app,
+            server,
+            port,
+            setupMiddlewares:
+              typeof setupMiddlewares !== 'undefined'
+                ? setupMiddlewares
+                : // eslint-disable-next-line no-undefined
+                  undefined,
+          },
+          compiler,
+        );
 
-				await devServer.start();
+        await devServer.start();
 
-				({ page, browser } = await runBrowser());
+        ({ page, browser } = await runBrowser());
 
-				pageErrors = [];
-				consoleMessages = [];
-			});
+        pageErrors = [];
+        consoleMessages = [];
+      });
 
-			afterEach(async () => {
-				await browser.close();
-				await devServer.stop();
-				await new Promise(resolve => {
-					compiler.close(() => {
-						resolve();
-					});
-				});
-			});
+      afterEach(async () => {
+        await browser.close();
+        await devServer.stop();
+        await new Promise((resolve) => {
+          compiler.close(() => {
+            resolve();
+          });
+        });
+      });
 
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
 
-				const pageUrl = devServer.isTlsServer
-					? `https://127.0.0.1:${port}/`
-					: `http://127.0.0.1:${port}/`;
+        const pageUrl = devServer.isTlsServer
+          ? `https://127.0.0.1:${port}/`
+          : `http://127.0.0.1:${port}/`;
 
-				const response = await page.goto(pageUrl, {
-					waitUntil: "networkidle0"
-				});
+        const response = await page.goto(pageUrl, {
+          waitUntil: 'networkidle0',
+        });
 
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
 
-				if (
-					server === "spdy" ||
-					server === "http2" ||
-					server.options?.allowHTTP1
-				) {
-					expect(HTTPVersion).toEqual("h2");
-				} else {
-					expect(HTTPVersion).toEqual("http/1.1");
-				}
+        if (
+          server === 'spdy' ||
+          server === 'http2' ||
+          server.options?.allowHTTP1
+        ) {
+          expect(HTTPVersion).toEqual('h2');
+        } else {
+          expect(HTTPVersion).toEqual('http/1.1');
+        }
 
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-	}
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+  }
 });
diff --git a/tests/e2e/bonjour.test.js b/tests/e2e/bonjour.test.js
index c183e0e..e18f7b5 100644
--- a/tests/e2e/bonjour.test.js
+++ b/tests/e2e/bonjour.test.js
@@ -1,339 +1,339 @@
-const os = require("node:os");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").bonjour;
-
-describe("bonjour option", () => {
-	let mockPublish;
-	let mockUnpublishAll;
-	let mockDestroy;
-
-	beforeEach(() => {
-		mockPublish = jest.fn();
-		mockUnpublishAll = jest.fn(callback => {
-			callback();
-		});
-		mockDestroy = jest.fn();
-	});
-
-	describe("as true", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			jest.mock("bonjour-service", () => {
-				return {
-					Bonjour: jest.fn().mockImplementation(() => {
-						return {
-							publish: mockPublish,
-							unpublishAll: mockUnpublishAll,
-							destroy: mockDestroy
-						};
-					})
-				};
-			});
-
-			compiler = webpack(config);
-
-			server = new Server({ port, bonjour: true }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-
-			mockPublish.mockReset();
-			mockUnpublishAll.mockReset();
-			mockDestroy.mockReset();
-		});
-
-		it("should call bonjour with correct params", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(mockPublish).toHaveBeenCalledTimes(1);
-
-			expect(mockPublish).toHaveBeenCalledWith({
-				name: `Webpack Dev Server ${os.hostname()}:${port}`,
-				port,
-				type: "http",
-				subtypes: ["webpack"]
-			});
-
-			expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
-			expect(mockDestroy).toHaveBeenCalledTimes(0);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("with 'server' option", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			jest.mock("bonjour-service", () => {
-				return {
-					Bonjour: jest.fn().mockImplementation(() => {
-						return {
-							publish: mockPublish,
-							unpublishAll: mockUnpublishAll,
-							destroy: mockDestroy
-						};
-					})
-				};
-			});
-
-			compiler = webpack(config);
-
-			server = new Server({ bonjour: true, port, server: "https" }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should call bonjour with 'https' type", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`https://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(mockPublish).toHaveBeenCalledTimes(1);
-
-			expect(mockPublish).toHaveBeenCalledWith({
-				name: `Webpack Dev Server ${os.hostname()}:${port}`,
-				port,
-				type: "https",
-				subtypes: ["webpack"]
-			});
-
-			expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
-			expect(mockDestroy).toHaveBeenCalledTimes(0);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as object", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			jest.mock("bonjour-service", () => {
-				return {
-					Bonjour: jest.fn().mockImplementation(() => {
-						return {
-							publish: mockPublish,
-							unpublishAll: mockUnpublishAll,
-							destroy: mockDestroy
-						};
-					})
-				};
-			});
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					port,
-					bonjour: {
-						type: "https",
-						protocol: "udp"
-					}
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should apply bonjour options", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(mockPublish).toHaveBeenCalledTimes(1);
-
-			expect(mockPublish).toHaveBeenCalledWith({
-				name: `Webpack Dev Server ${os.hostname()}:${port}`,
-				port,
-				type: "https",
-				protocol: "udp",
-				subtypes: ["webpack"]
-			});
-
-			expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
-			expect(mockDestroy).toHaveBeenCalledTimes(0);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("bonjour object and 'server' option", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			jest.mock("bonjour-service", () => {
-				return {
-					Bonjour: jest.fn().mockImplementation(() => {
-						return {
-							publish: mockPublish,
-							unpublishAll: mockUnpublishAll,
-							destroy: mockDestroy
-						};
-					})
-				};
-			});
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					port,
-					bonjour: {
-						type: "http",
-						protocol: "udp"
-					},
-					server: {
-						type: "https"
-					}
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should apply bonjour options", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`https://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(mockPublish).toHaveBeenCalledTimes(1);
-
-			expect(mockPublish).toHaveBeenCalledWith({
-				name: `Webpack Dev Server ${os.hostname()}:${port}`,
-				port,
-				type: "http",
-				protocol: "udp",
-				subtypes: ["webpack"]
-			});
-
-			expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
-			expect(mockDestroy).toHaveBeenCalledTimes(0);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const os = require('node:os');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').bonjour;
+
+describe('bonjour option', () => {
+  let mockPublish;
+  let mockUnpublishAll;
+  let mockDestroy;
+
+  beforeEach(() => {
+    mockPublish = jest.fn();
+    mockUnpublishAll = jest.fn((callback) => {
+      callback();
+    });
+    mockDestroy = jest.fn();
+  });
+
+  describe('as true', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      jest.mock('bonjour-service', () => {
+        return {
+          Bonjour: jest.fn().mockImplementation(() => {
+            return {
+              publish: mockPublish,
+              unpublishAll: mockUnpublishAll,
+              destroy: mockDestroy,
+            };
+          }),
+        };
+      });
+
+      compiler = webpack(config);
+
+      server = new Server({ port, bonjour: true }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+
+      mockPublish.mockReset();
+      mockUnpublishAll.mockReset();
+      mockDestroy.mockReset();
+    });
+
+    it('should call bonjour with correct params', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(mockPublish).toHaveBeenCalledTimes(1);
+
+      expect(mockPublish).toHaveBeenCalledWith({
+        name: `Webpack Dev Server ${os.hostname()}:${port}`,
+        port,
+        type: 'http',
+        subtypes: ['webpack'],
+      });
+
+      expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
+      expect(mockDestroy).toHaveBeenCalledTimes(0);
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe("with 'server' option", () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      jest.mock('bonjour-service', () => {
+        return {
+          Bonjour: jest.fn().mockImplementation(() => {
+            return {
+              publish: mockPublish,
+              unpublishAll: mockUnpublishAll,
+              destroy: mockDestroy,
+            };
+          }),
+        };
+      });
+
+      compiler = webpack(config);
+
+      server = new Server({ bonjour: true, port, server: 'https' }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it("should call bonjour with 'https' type", async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`https://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(mockPublish).toHaveBeenCalledTimes(1);
+
+      expect(mockPublish).toHaveBeenCalledWith({
+        name: `Webpack Dev Server ${os.hostname()}:${port}`,
+        port,
+        type: 'https',
+        subtypes: ['webpack'],
+      });
+
+      expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
+      expect(mockDestroy).toHaveBeenCalledTimes(0);
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      jest.mock('bonjour-service', () => {
+        return {
+          Bonjour: jest.fn().mockImplementation(() => {
+            return {
+              publish: mockPublish,
+              unpublishAll: mockUnpublishAll,
+              destroy: mockDestroy,
+            };
+          }),
+        };
+      });
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          port,
+          bonjour: {
+            type: 'https',
+            protocol: 'udp',
+          },
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should apply bonjour options', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(mockPublish).toHaveBeenCalledTimes(1);
+
+      expect(mockPublish).toHaveBeenCalledWith({
+        name: `Webpack Dev Server ${os.hostname()}:${port}`,
+        port,
+        type: 'https',
+        protocol: 'udp',
+        subtypes: ['webpack'],
+      });
+
+      expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
+      expect(mockDestroy).toHaveBeenCalledTimes(0);
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe("bonjour object and 'server' option", () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      jest.mock('bonjour-service', () => {
+        return {
+          Bonjour: jest.fn().mockImplementation(() => {
+            return {
+              publish: mockPublish,
+              unpublishAll: mockUnpublishAll,
+              destroy: mockDestroy,
+            };
+          }),
+        };
+      });
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          port,
+          bonjour: {
+            type: 'http',
+            protocol: 'udp',
+          },
+          server: {
+            type: 'https',
+          },
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should apply bonjour options', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`https://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(mockPublish).toHaveBeenCalledTimes(1);
+
+      expect(mockPublish).toHaveBeenCalledWith({
+        name: `Webpack Dev Server ${os.hostname()}:${port}`,
+        port,
+        type: 'http',
+        protocol: 'udp',
+        subtypes: ['webpack'],
+      });
+
+      expect(mockUnpublishAll).toHaveBeenCalledTimes(0);
+      expect(mockDestroy).toHaveBeenCalledTimes(0);
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/built-in-routes.test.js b/tests/e2e/built-in-routes.test.js
index 98cf7ef..e9e707b 100644
--- a/tests/e2e/built-in-routes.test.js
+++ b/tests/e2e/built-in-routes.test.js
@@ -1,301 +1,301 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const multiConfig = require("../fixtures/multi-public-path-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").routes;
-
-describe("Built in routes", () => {
-	describe("with simple config", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-			server = new Server({ port }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handles GET request to sockjs bundle", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/__webpack_dev_server__/sockjs.bundle.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handles HEAD request to sockjs bundle", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-					interceptedRequest.continue({ method: "HEAD" }, 10);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/__webpack_dev_server__/sockjs.bundle.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle GET request to invalidate endpoint", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/webpack-dev-server/invalidate`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).not.toEqual("text/html");
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle GET request to directory index and list all middleware directories", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/webpack-dev-server/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("directory list");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle HEAD request to directory index", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-					interceptedRequest.continue({ method: "HEAD" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/webpack-dev-server/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("directory list");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle GET request to magic async chunk", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-		});
-
-		it("should handle HEAD request to magic async chunk", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-					interceptedRequest.continue({ method: "HEAD" });
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-		});
-	});
-
-	describe("with multi config", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(multiConfig);
-			server = new Server({ port }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to directory index and list all middleware directories", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/webpack-dev-server/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("directory list");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const multiConfig = require('../fixtures/multi-public-path-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').routes;
+
+describe('Built in routes', () => {
+  describe('with simple config', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+      server = new Server({ port }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handles GET request to sockjs bundle', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/__webpack_dev_server__/sockjs.bundle.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handles HEAD request to sockjs bundle', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+          interceptedRequest.continue({ method: 'HEAD' }, 10);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/__webpack_dev_server__/sockjs.bundle.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle GET request to invalidate endpoint', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/webpack-dev-server/invalidate`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).not.toEqual('text/html');
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle GET request to directory index and list all middleware directories', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/webpack-dev-server/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('directory list');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle HEAD request to directory index', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+          interceptedRequest.continue({ method: 'HEAD' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/webpack-dev-server/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('directory list');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle GET request to magic async chunk', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+    });
+
+    it('should handle HEAD request to magic async chunk', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+          interceptedRequest.continue({ method: 'HEAD' });
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+    });
+  });
+
+  describe('with multi config', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(multiConfig);
+      server = new Server({ port }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to directory index and list all middleware directories', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/webpack-dev-server/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('directory list');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/client-reconnect.test.js b/tests/e2e/client-reconnect.test.js
index cf6c645..3f8af26 100644
--- a/tests/e2e/client-reconnect.test.js
+++ b/tests/e2e/client-reconnect.test.js
@@ -1,197 +1,197 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["client-reconnect-option"];
-
-describe("client.reconnect option", () => {
-	describe("specified as true", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server({ port, client: { reconnect: true } }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-		});
-
-		it("should try to reconnect unlimited times", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			try {
-				expect(response.status()).toMatchSnapshot("response status");
-			} finally {
-				await server.stop();
-			}
-
-			let interval;
-
-			await new Promise(resolve => {
-				interval = setInterval(() => {
-					const retryingMessages = consoleMessages.filter(message =>
-						message.text().includes("Trying to reconnect...")
-					);
-
-					if (retryingMessages.length >= 5) {
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 1000);
-			});
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("specified as false", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server({ port, client: { reconnect: false } }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-		});
-
-		it("should not try to reconnect", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			try {
-				expect(response.status()).toMatchSnapshot("response status");
-			} finally {
-				await server.stop();
-			}
-
-			// Can't wait to check for unlimited times so wait only for couple retries
-			await new Promise(resolve =>
-				setTimeout(
-					() => {
-						resolve();
-					},
-					// eslint-disable-next-line no-restricted-properties
-					1000 * 2 ** 3
-				)
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("specified as number", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server({ port, client: { reconnect: 2 } }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-		});
-
-		it("should try to reconnect 2 times", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			try {
-				expect(response.status()).toMatchSnapshot("response status");
-			} finally {
-				await server.stop();
-			}
-
-			// Can't wait to check for unlimited times so wait only for couple retries
-			await new Promise(resolve =>
-				setTimeout(
-					() => {
-						resolve();
-					},
-					// eslint-disable-next-line no-restricted-properties
-					1000 * 2 ** 3
-				)
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['client-reconnect-option'];
+
+describe('client.reconnect option', () => {
+  describe('specified as true', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server({ port, client: { reconnect: true } }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+    });
+
+    it('should try to reconnect unlimited times', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      try {
+        expect(response.status()).toMatchSnapshot('response status');
+      } finally {
+        await server.stop();
+      }
+
+      let interval;
+
+      await new Promise((resolve) => {
+        interval = setInterval(() => {
+          const retryingMessages = consoleMessages.filter((message) =>
+            message.text().includes('Trying to reconnect...'),
+          );
+
+          if (retryingMessages.length >= 5) {
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 1000);
+      });
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('specified as false', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server({ port, client: { reconnect: false } }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+    });
+
+    it('should not try to reconnect', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      try {
+        expect(response.status()).toMatchSnapshot('response status');
+      } finally {
+        await server.stop();
+      }
+
+      // Can't wait to check for unlimited times so wait only for couple retries
+      await new Promise((resolve) =>
+        setTimeout(
+          () => {
+            resolve();
+          },
+          // eslint-disable-next-line no-restricted-properties
+          1000 * 2 ** 3,
+        ),
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('specified as number', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server({ port, client: { reconnect: 2 } }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+    });
+
+    it('should try to reconnect 2 times', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      try {
+        expect(response.status()).toMatchSnapshot('response status');
+      } finally {
+        await server.stop();
+      }
+
+      // Can't wait to check for unlimited times so wait only for couple retries
+      await new Promise((resolve) =>
+        setTimeout(
+          () => {
+            resolve();
+          },
+          // eslint-disable-next-line no-restricted-properties
+          1000 * 2 ** 3,
+        ),
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/client.test.js b/tests/e2e/client.test.js
index 9c4ef21..5292350 100644
--- a/tests/e2e/client.test.js
+++ b/tests/e2e/client.test.js
@@ -1,399 +1,399 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config-other/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["client-option"];
-
-describe("client option", () => {
-	describe("default behaviour", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					client: {
-						webSocketTransport: "sockjs"
-					},
-					webSocketServer: "sockjs",
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("responds with a 200 status code for /ws path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/ws`, {
-				waitUntil: "networkidle0"
-			});
-
-			// overlay should be true by default
-			expect(server.options.client.overlay).toBe(true);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("should respect path option", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					client: {
-						webSocketTransport: "sockjs"
-					},
-					webSocketServer: {
-						type: "sockjs",
-						options: {
-							host: "localhost",
-							port,
-							path: "/foo/test/bar"
-						}
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("responds with a 200 status code for /foo/test/bar path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/foo/test/bar`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("configure client entry", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					client: false,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should disable client entry", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).not.toMatch(/client\/index\.js/);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("configure client entry", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack({
-				...config,
-				devtool: false
-			});
-
-			server = new Server(
-				{
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should redirect client entry to rspack", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(await response.text()).toContain(
-				"/* Rspack dev server runtime client */"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("override client entry", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-
-		class OverrideServer extends Server {
-			// eslint-disable-next-line class-methods-use-this
-			getClientEntry() {
-				return require.resolve(
-					"../fixtures/custom-client/CustomClientEntry.js"
-				);
-			}
-			// eslint-disable-next-line class-methods-use-this
-			getClientHotEntry() {
-				return require.resolve(
-					"../fixtures/custom-client/CustomClientHotEntry.js"
-				);
-			}
-		}
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new OverrideServer(
-				{
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should disable client entry", async () => {
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			const content = await response.text();
-			expect(content).toContain("CustomClientEntry.js");
-			expect(content).toContain("CustomClientHotEntry.js");
-		});
-	});
-
-	describe("webSocketTransport", () => {
-		const clientModes = [
-			{
-				title: 'as a string ("sockjs")',
-				client: {
-					webSocketTransport: "sockjs"
-				},
-				webSocketServer: "sockjs",
-				shouldThrow: false
-			},
-			{
-				title: 'as a string ("ws")',
-				client: {
-					webSocketTransport: "ws"
-				},
-				webSocketServer: "ws",
-				shouldThrow: false
-			},
-			{
-				title: 'as a path ("sockjs")',
-				client: {
-					webSocketTransport: require.resolve(
-						"webpack-dev-server/client/clients/SockJSClient"
-					)
-				},
-				webSocketServer: "sockjs",
-				shouldThrow: false
-			},
-			{
-				title: 'as a path ("ws")',
-				client: {
-					webSocketTransport: require.resolve(
-						"webpack-dev-server/client/clients/WebSocketClient"
-					)
-				},
-				webSocketServer: "ws",
-				shouldThrow: false
-			},
-			{
-				title: "as a nonexistent path (sockjs)",
-				client: {
-					webSocketTransport: "/bad/path/to/implementation"
-				},
-				webSocketServer: "sockjs",
-				shouldThrow: true
-			},
-			{
-				title: "as a nonexistent path (ws)",
-				client: {
-					webSocketTransport: "/bad/path/to/implementation"
-				},
-				webSocketServer: "ws",
-				shouldThrow: true
-			}
-		];
-
-		describe("passed to server", () => {
-			for (const data of clientModes) {
-				it(`${data.title} ${
-					data.shouldThrow ? "should throw" : "should not throw"
-				}`, async () => {
-					const compiler = webpack(config);
-
-					const server = new Server(
-						{
-							client: data.client,
-							port
-						},
-						compiler
-					);
-
-					let thrownError;
-
-					try {
-						await server.start();
-					} catch (error) {
-						thrownError = error;
-					}
-
-					if (data.shouldThrow) {
-						expect(thrownError.message).toMatch(
-							/client\.webSocketTransport must be a string/
-						);
-					}
-
-					await server.stop();
-				});
-			}
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config-other/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['client-option'];
+
+describe('client option', () => {
+  describe('default behaviour', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          client: {
+            webSocketTransport: 'sockjs',
+          },
+          webSocketServer: 'sockjs',
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('responds with a 200 status code for /ws path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/ws`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // overlay should be true by default
+      expect(server.options.client.overlay).toBe(true);
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('should respect path option', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          client: {
+            webSocketTransport: 'sockjs',
+          },
+          webSocketServer: {
+            type: 'sockjs',
+            options: {
+              host: 'localhost',
+              port,
+              path: '/foo/test/bar',
+            },
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('responds with a 200 status code for /foo/test/bar path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/foo/test/bar`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('configure client entry', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          client: false,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should disable client entry', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).not.toMatch(/client\/index\.js/);
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('configure client entry', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack({
+        ...config,
+        devtool: false,
+      });
+
+      server = new Server(
+        {
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should redirect client entry to rspack', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(await response.text()).toContain(
+        '/* Rspack dev server runtime client */',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('override client entry', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+
+    class OverrideServer extends Server {
+      // eslint-disable-next-line class-methods-use-this
+      getClientEntry() {
+        return require.resolve(
+          '../fixtures/custom-client/CustomClientEntry.js',
+        );
+      }
+      // eslint-disable-next-line class-methods-use-this
+      getClientHotEntry() {
+        return require.resolve(
+          '../fixtures/custom-client/CustomClientHotEntry.js',
+        );
+      }
+    }
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new OverrideServer(
+        {
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should disable client entry', async () => {
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      const content = await response.text();
+      expect(content).toContain('CustomClientEntry.js');
+      expect(content).toContain('CustomClientHotEntry.js');
+    });
+  });
+
+  describe('webSocketTransport', () => {
+    const clientModes = [
+      {
+        title: 'as a string ("sockjs")',
+        client: {
+          webSocketTransport: 'sockjs',
+        },
+        webSocketServer: 'sockjs',
+        shouldThrow: false,
+      },
+      {
+        title: 'as a string ("ws")',
+        client: {
+          webSocketTransport: 'ws',
+        },
+        webSocketServer: 'ws',
+        shouldThrow: false,
+      },
+      {
+        title: 'as a path ("sockjs")',
+        client: {
+          webSocketTransport: require.resolve(
+            'webpack-dev-server/client/clients/SockJSClient',
+          ),
+        },
+        webSocketServer: 'sockjs',
+        shouldThrow: false,
+      },
+      {
+        title: 'as a path ("ws")',
+        client: {
+          webSocketTransport: require.resolve(
+            'webpack-dev-server/client/clients/WebSocketClient',
+          ),
+        },
+        webSocketServer: 'ws',
+        shouldThrow: false,
+      },
+      {
+        title: 'as a nonexistent path (sockjs)',
+        client: {
+          webSocketTransport: '/bad/path/to/implementation',
+        },
+        webSocketServer: 'sockjs',
+        shouldThrow: true,
+      },
+      {
+        title: 'as a nonexistent path (ws)',
+        client: {
+          webSocketTransport: '/bad/path/to/implementation',
+        },
+        webSocketServer: 'ws',
+        shouldThrow: true,
+      },
+    ];
+
+    describe('passed to server', () => {
+      for (const data of clientModes) {
+        it(`${data.title} ${
+          data.shouldThrow ? 'should throw' : 'should not throw'
+        }`, async () => {
+          const compiler = webpack(config);
+
+          const server = new Server(
+            {
+              client: data.client,
+              port,
+            },
+            compiler,
+          );
+
+          let thrownError;
+
+          try {
+            await server.start();
+          } catch (error) {
+            thrownError = error;
+          }
+
+          if (data.shouldThrow) {
+            expect(thrownError.message).toMatch(
+              /client\.webSocketTransport must be a string/,
+            );
+          }
+
+          await server.stop();
+        });
+      }
+    });
+  });
 });
diff --git a/tests/e2e/compress.test.js b/tests/e2e/compress.test.js
index 9892587..b7a7fb1 100644
--- a/tests/e2e/compress.test.js
+++ b/tests/e2e/compress.test.js
@@ -1,178 +1,178 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config-other/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["compress-option"];
-
-describe("compress option", () => {
-	describe("enabled by default when not specified", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server({ port }, compiler);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to bundle file", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-encoding"]).toMatchSnapshot(
-				"response headers content-encoding"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as true", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					compress: true,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to bundle file", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-encoding"]).toMatchSnapshot(
-				"response headers content-encoding"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as false", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					compress: false,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to bundle file", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-encoding"]).toMatchSnapshot(
-				"response headers content-encoding"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config-other/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['compress-option'];
+
+describe('compress option', () => {
+  describe('enabled by default when not specified', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server({ port }, compiler);
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to bundle file', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-encoding']).toMatchSnapshot(
+        'response headers content-encoding',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as true', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          compress: true,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to bundle file', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-encoding']).toMatchSnapshot(
+        'response headers content-encoding',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as false', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          compress: false,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to bundle file', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-encoding']).toMatchSnapshot(
+        'response headers content-encoding',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/entry.test.js b/tests/e2e/entry.test.js
index 795c4cf..b0779f8 100644
--- a/tests/e2e/entry.test.js
+++ b/tests/e2e/entry.test.js
@@ -1,415 +1,415 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").entry;
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').entry;
 
 const HOT_ENABLED_MESSAGE =
-	"[webpack-dev-server] Server started: Hot Module Replacement enabled, Live Reloading enabled, Progress disabled, Overlay enabled.";
-
-const waitForConsoleLogFinished = async consoleLogs => {
-	await new Promise(resolve => {
-		const interval = setInterval(() => {
-			if (consoleLogs.includes(HOT_ENABLED_MESSAGE)) {
-				clearInterval(interval);
-
-				resolve();
-			}
-		}, 100);
-	});
+  '[webpack-dev-server] Server started: Hot Module Replacement enabled, Live Reloading enabled, Progress disabled, Overlay enabled.';
+
+const waitForConsoleLogFinished = async (consoleLogs) => {
+  await new Promise((resolve) => {
+    const interval = setInterval(() => {
+      if (consoleLogs.includes(HOT_ENABLED_MESSAGE)) {
+        clearInterval(interval);
+
+        resolve();
+      }
+    }, 100);
+  });
 };
 
-describe("entry", () => {
-	const entryFirst = path.resolve(
-		__dirname,
-		"../fixtures/client-config/foo.js"
-	);
-	const entrySecond = path.resolve(
-		__dirname,
-		"../fixtures/client-config/bar.js"
-	);
-
-	it("should work with single entry", async () => {
-		const compiler = webpack({ ...config, entry: entryFirst });
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with single array entry", async () => {
-		const compiler = webpack({ ...config, entry: [entryFirst, entrySecond] });
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with object entry", async () => {
-		const compiler = webpack({
-			...config,
-			entry: {
-				main: { import: entryFirst }
-			}
-		});
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with dynamic entry", async () => {
-		const compiler = webpack({ ...config, entry: () => entryFirst });
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with dynamic async entry", async () => {
-		const compiler = webpack({
-			...config,
-			entry: () => new Promise(resolve => resolve([entryFirst]))
-		});
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with multiple entries", async () => {
-		const compiler = webpack({
-			...config,
-			entry: {
-				foo: entryFirst,
-				bar: entrySecond
-			},
-			optimization: {
-				runtimeChunk: {
-					name: "runtime"
-				}
-			}
-		});
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/test.html`, {
-				waitUntil: "networkidle0"
-			});
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/runtime.js` });
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/foo.js` });
-			await waitForConsoleLogFinished(consoleMessages);
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with multiple entries #2", async () => {
-		const compiler = webpack({
-			...config,
-			entry: {
-				foo: entryFirst,
-				bar: entrySecond
-			},
-			optimization: {
-				runtimeChunk: {
-					name: "runtime"
-				}
-			}
-		});
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/test.html`, {
-				waitUntil: "networkidle0"
-			});
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/runtime.js` });
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/bar.js` });
-			await waitForConsoleLogFinished(consoleMessages);
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should work with multiple entries and "dependOn"', async () => {
-		const compiler = webpack({
-			...config,
-			entry: {
-				foo: {
-					import: entryFirst,
-					dependOn: "bar"
-				},
-				bar: entrySecond
-			}
-		});
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/test.html`, {
-				waitUntil: "networkidle0"
-			});
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/bar.js` });
-			await page.addScriptTag({ url: `http://127.0.0.1:${port}/foo.js` });
-			await waitForConsoleLogFinished(consoleMessages);
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with empty", async () => {
-		const compiler = webpack({
-			...config,
-			entry: {}
-		});
-
-		new webpack.EntryPlugin(compiler.context, entryFirst, {
-			name: "main"
-		}).apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+describe('entry', () => {
+  const entryFirst = path.resolve(
+    __dirname,
+    '../fixtures/client-config/foo.js',
+  );
+  const entrySecond = path.resolve(
+    __dirname,
+    '../fixtures/client-config/bar.js',
+  );
+
+  it('should work with single entry', async () => {
+    const compiler = webpack({ ...config, entry: entryFirst });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with single array entry', async () => {
+    const compiler = webpack({ ...config, entry: [entryFirst, entrySecond] });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with object entry', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: {
+        main: { import: entryFirst },
+      },
+    });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with dynamic entry', async () => {
+    const compiler = webpack({ ...config, entry: () => entryFirst });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with dynamic async entry', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: () => new Promise((resolve) => resolve([entryFirst])),
+    });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with multiple entries', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: {
+        foo: entryFirst,
+        bar: entrySecond,
+      },
+      optimization: {
+        runtimeChunk: {
+          name: 'runtime',
+        },
+      },
+    });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/test.html`, {
+        waitUntil: 'networkidle0',
+      });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/runtime.js` });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/foo.js` });
+      await waitForConsoleLogFinished(consoleMessages);
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with multiple entries #2', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: {
+        foo: entryFirst,
+        bar: entrySecond,
+      },
+      optimization: {
+        runtimeChunk: {
+          name: 'runtime',
+        },
+      },
+    });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/test.html`, {
+        waitUntil: 'networkidle0',
+      });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/runtime.js` });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/bar.js` });
+      await waitForConsoleLogFinished(consoleMessages);
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with multiple entries and "dependOn"', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: {
+        foo: {
+          import: entryFirst,
+          dependOn: 'bar',
+        },
+        bar: entrySecond,
+      },
+    });
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/test.html`, {
+        waitUntil: 'networkidle0',
+      });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/bar.js` });
+      await page.addScriptTag({ url: `http://127.0.0.1:${port}/foo.js` });
+      await waitForConsoleLogFinished(consoleMessages);
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with empty', async () => {
+    const compiler = webpack({
+      ...config,
+      entry: {},
+    });
+
+    new webpack.EntryPlugin(compiler.context, entryFirst, {
+      name: 'main',
+    }).apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/e2e/headers.test.js b/tests/e2e/headers.test.js
index 936ff09..6bd2efd 100644
--- a/tests/e2e/headers.test.js
+++ b/tests/e2e/headers.test.js
@@ -1,456 +1,456 @@
-const request = require("supertest");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["headers-option"];
-
-describe("headers option", () => {
-	describe("as a string", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: { "X-Foo": "dev-server headers" },
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-foo"]).toMatchSnapshot(
-				"response headers x-foo"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as an array of objects", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: [
-						{
-							key: "X-Foo",
-							value: "value1"
-						},
-						{
-							key: "X-Bar",
-							value: "value2"
-						}
-					],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-foo"]).toMatchSnapshot(
-				"response headers x-foo"
-			);
-
-			expect(response.headers()["x-bar"]).toMatchSnapshot(
-				"response headers x-bar"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as an array", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: { "X-Bar": ["key1=value1", "key2=value2"] },
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers as an array", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-bar"]).toMatchSnapshot(
-				"response headers x-bar"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as a function", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: () => {
-						return { "X-Bar": ["key1=value1", "key2=value2"] };
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers as a function", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-bar"]).toMatchSnapshot(
-				"response headers x-bar"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as a function returning an array", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: () => [
-						{
-							key: "X-Foo",
-							value: "value1"
-						},
-						{
-							key: "X-Bar",
-							value: "value2"
-						}
-					],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-foo"]).toMatchSnapshot(
-				"response headers x-foo"
-			);
-
-			expect(response.headers()["x-bar"]).toMatchSnapshot(
-				"response headers x-bar"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("dev middleware headers take precedence for dev middleware output files", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: { "X-Foo": "dev-server-headers" },
-					devMiddleware: {
-						headers: { "X-Foo": "dev-middleware-headers" }
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request with headers as a function", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-foo"]).toMatchSnapshot(
-				"response headers x-foo"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as a string and support HEAD request", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-		let req;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					headers: { "X-Foo": "dev-server headers" },
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			req = request(server.app);
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle HEAD request with headers", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["x-foo"]).toMatchSnapshot(
-				"response headers x-foo"
-			);
-			expect(response.status()).toMatchSnapshot("response status");
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			const responseForHead = await req.get("/");
-
-			expect(responseForHead.headers["x-foo"]).toBe("dev-server headers");
-		});
-	});
+const request = require('supertest');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['headers-option'];
+
+describe('headers option', () => {
+  describe('as a string', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: { 'X-Foo': 'dev-server headers' },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-foo']).toMatchSnapshot(
+        'response headers x-foo',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as an array of objects', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: [
+            {
+              key: 'X-Foo',
+              value: 'value1',
+            },
+            {
+              key: 'X-Bar',
+              value: 'value2',
+            },
+          ],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-foo']).toMatchSnapshot(
+        'response headers x-foo',
+      );
+
+      expect(response.headers()['x-bar']).toMatchSnapshot(
+        'response headers x-bar',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as an array', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: { 'X-Bar': ['key1=value1', 'key2=value2'] },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers as an array', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-bar']).toMatchSnapshot(
+        'response headers x-bar',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as a function', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: () => {
+            return { 'X-Bar': ['key1=value1', 'key2=value2'] };
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers as a function', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-bar']).toMatchSnapshot(
+        'response headers x-bar',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as a function returning an array', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: () => [
+            {
+              key: 'X-Foo',
+              value: 'value1',
+            },
+            {
+              key: 'X-Bar',
+              value: 'value2',
+            },
+          ],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-foo']).toMatchSnapshot(
+        'response headers x-foo',
+      );
+
+      expect(response.headers()['x-bar']).toMatchSnapshot(
+        'response headers x-bar',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('dev middleware headers take precedence for dev middleware output files', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: { 'X-Foo': 'dev-server-headers' },
+          devMiddleware: {
+            headers: { 'X-Foo': 'dev-middleware-headers' },
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request with headers as a function', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-foo']).toMatchSnapshot(
+        'response headers x-foo',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as a string and support HEAD request', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+    let req;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          headers: { 'X-Foo': 'dev-server headers' },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      req = request(server.app);
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle HEAD request with headers', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['x-foo']).toMatchSnapshot(
+        'response headers x-foo',
+      );
+      expect(response.status()).toMatchSnapshot('response status');
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      const responseForHead = await req.get('/');
+
+      expect(responseForHead.headers['x-foo']).toBe('dev-server headers');
+    });
+  });
 });
diff --git a/tests/e2e/history-api-fallback.test.js b/tests/e2e/history-api-fallback.test.js
index 2ed94bf..8211e20 100644
--- a/tests/e2e/history-api-fallback.test.js
+++ b/tests/e2e/history-api-fallback.test.js
@@ -1,685 +1,685 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/historyapifallback-config/webpack.config");
-const config2 = require("../fixtures/historyapifallback-2-config/webpack.config");
-const config3 = require("../fixtures/historyapifallback-3-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["history-api-fallback-option"];
-
-describe("historyApiFallback option", () => {
-	describe("as boolean", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					historyApiFallback: true,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as object", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					historyApiFallback: {
-						index: "/bar.html"
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as object with static", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config2);
-
-			server = new Server(
-				{
-					static: path.resolve(
-						__dirname,
-						"../fixtures/historyapifallback-2-config"
-					),
-					historyApiFallback: {
-						index: "/bar.html"
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request to directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should prefer static file over historyApiFallback", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/random-file.txt`,
-				{
-					waitUntil: "networkidle2"
-				}
-			);
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as object with static set to false", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config3);
-
-			server = new Server(
-				{
-					static: false,
-					historyApiFallback: {
-						index: "/bar.html"
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("historyApiFallback should work and ignore static content", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as object with static and rewrites", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config2);
-
-			server = new Server(
-				{
-					port,
-					static: path.resolve(
-						__dirname,
-						"../fixtures/historyapifallback-2-config"
-					),
-					historyApiFallback: {
-						rewrites: [
-							{
-								from: /other/,
-								to: "/other.html"
-							},
-							{
-								from: /.*/,
-								to: "/bar.html"
-							}
-						]
-					}
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("historyApiFallback respect rewrites for index", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("historyApiFallback respect rewrites and shows index for unknown urls", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/acme`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("historyApiFallback respect any other specified rewrites", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/other`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe('as object with the "verbose" option', () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-		let consoleSpy;
-
-		beforeEach(async () => {
-			consoleSpy = jest.spyOn(global.console, "log");
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					historyApiFallback: {
-						index: "/bar.html",
-						verbose: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			consoleSpy.mockRestore();
-			await browser.close();
-			await server.stop();
-		});
-
-		it("request to directory and log", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleSpy).toHaveBeenCalledWith(
-				"Rewriting",
-				"GET",
-				"/foo",
-				"to",
-				"/bar.html"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe('as object with the "logger" option', () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-		let consoleSpy;
-
-		beforeEach(async () => {
-			consoleSpy = jest.spyOn(global.console, "log");
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					historyApiFallback: {
-						index: "/bar.html",
-						logger: consoleSpy
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			consoleSpy.mockRestore();
-			await browser.close();
-			await server.stop();
-		});
-
-		it("request to directory and log", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleSpy).toHaveBeenCalledWith(
-				"Rewriting",
-				"GET",
-				"/foo",
-				"to",
-				"/bar.html"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("in-memory files", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config3);
-
-			server = new Server(
-				{
-					static: path.resolve(
-						__dirname,
-						"../fixtures/historyapifallback-3-config"
-					),
-					historyApiFallback: true,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should take precedence over static files", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should perform HEAD request in same way as GET", async () => {
-			await page.goto(`http://127.0.0.1:${port}/foo`, {
-				waitUntil: "networkidle0"
-			});
-
-			const responseGet = await page.evaluate(async () => {
-				const response = await fetch("/foo", { method: "GET" });
-
-				return {
-					contentType: response.headers.get("content-type"),
-					statusText: response.statusText,
-					text: await response.text()
-				};
-			});
-
-			expect(responseGet.contentType).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(responseGet.statusText).toMatchSnapshot("response status");
-
-			expect(responseGet.text).toMatchSnapshot("response text");
-
-			const responseHead = await page.evaluate(async () => {
-				const response = await fetch("/foo", { method: "HEAD" });
-
-				return {
-					contentType: response.headers.get("content-type"),
-					statusText: response.statusText,
-					text: await response.text()
-				};
-			});
-
-			expect(responseHead).toMatchObject({
-				...responseGet,
-				// HEAD response has an empty body
-				text: ""
-			});
-		});
-	});
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/historyapifallback-config/webpack.config');
+const config2 = require('../fixtures/historyapifallback-2-config/webpack.config');
+const config3 = require('../fixtures/historyapifallback-3-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['history-api-fallback-option'];
+
+describe('historyApiFallback option', () => {
+  describe('as boolean', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          historyApiFallback: true,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          historyApiFallback: {
+            index: '/bar.html',
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object with static', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config2);
+
+      server = new Server(
+        {
+          static: path.resolve(
+            __dirname,
+            '../fixtures/historyapifallback-2-config',
+          ),
+          historyApiFallback: {
+            index: '/bar.html',
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request to directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should prefer static file over historyApiFallback', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/random-file.txt`,
+        {
+          waitUntil: 'networkidle2',
+        },
+      );
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object with static set to false', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config3);
+
+      server = new Server(
+        {
+          static: false,
+          historyApiFallback: {
+            index: '/bar.html',
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('historyApiFallback should work and ignore static content', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object with static and rewrites', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config2);
+
+      server = new Server(
+        {
+          port,
+          static: path.resolve(
+            __dirname,
+            '../fixtures/historyapifallback-2-config',
+          ),
+          historyApiFallback: {
+            rewrites: [
+              {
+                from: /other/,
+                to: '/other.html',
+              },
+              {
+                from: /.*/,
+                to: '/bar.html',
+              },
+            ],
+          },
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('historyApiFallback respect rewrites for index', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('historyApiFallback respect rewrites and shows index for unknown urls', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/acme`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('historyApiFallback respect any other specified rewrites', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/other`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object with the "verbose" option', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+    let consoleSpy;
+
+    beforeEach(async () => {
+      consoleSpy = jest.spyOn(global.console, 'log');
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          historyApiFallback: {
+            index: '/bar.html',
+            verbose: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      consoleSpy.mockRestore();
+      await browser.close();
+      await server.stop();
+    });
+
+    it('request to directory and log', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleSpy).toHaveBeenCalledWith(
+        'Rewriting',
+        'GET',
+        '/foo',
+        'to',
+        '/bar.html',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as object with the "logger" option', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+    let consoleSpy;
+
+    beforeEach(async () => {
+      consoleSpy = jest.spyOn(global.console, 'log');
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          historyApiFallback: {
+            index: '/bar.html',
+            logger: consoleSpy,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      consoleSpy.mockRestore();
+      await browser.close();
+      await server.stop();
+    });
+
+    it('request to directory and log', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleSpy).toHaveBeenCalledWith(
+        'Rewriting',
+        'GET',
+        '/foo',
+        'to',
+        '/bar.html',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('in-memory files', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config3);
+
+      server = new Server(
+        {
+          static: path.resolve(
+            __dirname,
+            '../fixtures/historyapifallback-3-config',
+          ),
+          historyApiFallback: true,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should take precedence over static files', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should perform HEAD request in same way as GET', async () => {
+      await page.goto(`http://127.0.0.1:${port}/foo`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const responseGet = await page.evaluate(async () => {
+        const response = await fetch('/foo', { method: 'GET' });
+
+        return {
+          contentType: response.headers.get('content-type'),
+          statusText: response.statusText,
+          text: await response.text(),
+        };
+      });
+
+      expect(responseGet.contentType).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(responseGet.statusText).toMatchSnapshot('response status');
+
+      expect(responseGet.text).toMatchSnapshot('response text');
+
+      const responseHead = await page.evaluate(async () => {
+        const response = await fetch('/foo', { method: 'HEAD' });
+
+        return {
+          contentType: response.headers.get('content-type'),
+          statusText: response.statusText,
+          text: await response.text(),
+        };
+      });
+
+      expect(responseHead).toMatchObject({
+        ...responseGet,
+        // HEAD response has an empty body
+        text: '',
+      });
+    });
+  });
 });
diff --git a/tests/e2e/host.test.js b/tests/e2e/host.test.js
index 5c9cb29..0d3ff9e 100644
--- a/tests/e2e/host.test.js
+++ b/tests/e2e/host.test.js
@@ -1,281 +1,281 @@
-const http = require("node:http");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").host;
+const http = require('node:http');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').host;
 
-const ipv4 = Server.findIp("v4", false);
-const ipv6 = Server.findIp("v6", false);
+const ipv4 = Server.findIp('v4', false);
+const ipv6 = Server.findIp('v6', false);
 
 async function getAddress(host, hostname) {
-	let address;
-
-	if (
-		typeof host === "undefined" ||
-		(typeof host === "string" && (host === "<not-specified>" || host === "::"))
-	) {
-		address = "::";
-	} else if (host === "0.0.0.0") {
-		address = "0.0.0.0";
-	} else if (host === "::1") {
-		address = "::1";
-	} else if (host === "localhost") {
-		// It can be `127.0.0.1` or `::1` on different OS
-		const server = http.createServer((req, res) => {
-			res.statusCode = 200;
-			res.setHeader("Content-Type", "text/plain");
-			res.end("Hello World\n");
-		});
-
-		await new Promise(resolve => {
-			server.listen({ host: "localhost", port: 23100 }, resolve);
-		});
-
-		address = server.address().address;
-
-		await new Promise((resolve, reject) => {
-			server.close(err => {
-				if (err) {
-					reject(err);
-					return;
-				}
-
-				resolve();
-			});
-		});
-	} else if (host === "local-ipv6") {
-		address = "::";
-	} else {
-		address = hostname;
-	}
-
-	return { address };
+  let address;
+
+  if (
+    typeof host === 'undefined' ||
+    (typeof host === 'string' && (host === '<not-specified>' || host === '::'))
+  ) {
+    address = '::';
+  } else if (host === '0.0.0.0') {
+    address = '0.0.0.0';
+  } else if (host === '::1') {
+    address = '::1';
+  } else if (host === 'localhost') {
+    // It can be `127.0.0.1` or `::1` on different OS
+    const server = http.createServer((req, res) => {
+      res.statusCode = 200;
+      res.setHeader('Content-Type', 'text/plain');
+      res.end('Hello World\n');
+    });
+
+    await new Promise((resolve) => {
+      server.listen({ host: 'localhost', port: 23100 }, resolve);
+    });
+
+    address = server.address().address;
+
+    await new Promise((resolve, reject) => {
+      server.close((err) => {
+        if (err) {
+          reject(err);
+          return;
+        }
+
+        resolve();
+      });
+    });
+  } else if (host === 'local-ipv6') {
+    address = '::';
+  } else {
+    address = hostname;
+  }
+
+  return { address };
 }
 
-describe("host", () => {
-	const hosts = [
-		"<not-specified>",
-		// eslint-disable-next-line no-undefined
-		undefined,
-		"0.0.0.0",
-		"::",
-		"::1",
-		"localhost",
-		"127.0.0.1",
-		"local-ip",
-		"local-ipv4",
-		"local-ipv6"
-	];
-
-	for (const host of hosts) {
-		it(`should work using "${host}" host and port as number`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = { port };
-
-			if (host !== "<not-specified>") {
-				devServerOptions.host = host;
-			}
-
-			const server = new Server(devServerOptions, compiler);
-
-			let hostname = host;
-
-			if (hostname === "<not-specified>" || typeof hostname === "undefined") {
-				// If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "0.0.0.0") {
-				hostname = ipv4;
-			} else if (hostname === "::") {
-				// In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "::1") {
-				hostname = "[::1]";
-			} else if (hostname === "local-ip" || hostname === "local-ipv4") {
-				hostname = ipv4;
-			} else if (hostname === "local-ipv6") {
-				// For test env where network ipv6 doesn't work
-				hostname = ipv6 ? `[${ipv6}]` : "[::1]";
-			}
-
-			await server.start();
-
-			expect(server.server.address()).toMatchObject(
-				await getAddress(host, hostname)
-			);
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${hostname}:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work using "${host}" host and port as string`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = { port: `${port}` };
-
-			if (host !== "<not-specified>") {
-				devServerOptions.host = host;
-			}
-
-			const server = new Server(devServerOptions, compiler);
-
-			let hostname = host;
-
-			if (hostname === "<not-specified>" || typeof hostname === "undefined") {
-				// If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "0.0.0.0") {
-				hostname = ipv4;
-			} else if (hostname === "::") {
-				// In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "::1") {
-				hostname = "[::1]";
-			} else if (hostname === "local-ip" || hostname === "local-ipv4") {
-				hostname = ipv4;
-			} else if (hostname === "local-ipv6") {
-				// For test env where network ipv6 doesn't work
-				hostname = ipv6 ? `[${ipv6}]` : "[::1]";
-			}
-
-			await server.start();
-
-			expect(server.server.address()).toMatchObject(
-				await getAddress(host, hostname)
-			);
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${hostname}:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work using "${host}" host and "auto" port`, async () => {
-			const compiler = webpack(config);
-
-			process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
-
-			const devServerOptions = { port: "auto" };
-
-			if (host !== "<not-specified>") {
-				devServerOptions.host = host;
-			}
-
-			const server = new Server(devServerOptions, compiler);
-
-			let hostname = host;
-
-			if (hostname === "<not-specified>" || typeof hostname === "undefined") {
-				// If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "0.0.0.0") {
-				hostname = ipv4;
-			} else if (hostname === "::") {
-				// In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
-				hostname = ipv6 ? `[${ipv6}]` : ipv4;
-			} else if (hostname === "::1") {
-				hostname = "[::1]";
-			} else if (hostname === "local-ip" || hostname === "local-ipv4") {
-				hostname = ipv4;
-			} else if (hostname === "local-ipv6") {
-				// For test env where network ipv6 doesn't work
-				hostname = ipv6 ? `[${ipv6}]` : "[::1]";
-			}
-
-			await server.start();
-
-			expect(server.server.address()).toMatchObject(
-				await getAddress(host, hostname)
-			);
-
-			const address = server.server.address();
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://${hostname}:${address.port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
-
-	// TODO need test on error
-	// it(`should throw an error on invalid host`, async () => {
-	//   const compiler = webpack(config);
-	//   const server = new Server({ port, host: "unknown.unknown" }, compiler);
-	//   const runDevServer = async () => {
-	//     await server.start();
-	//   };
-	//
-	//   return expect(runDevServer()).toBeDefined();
-	// });
+describe('host', () => {
+  const hosts = [
+    '<not-specified>',
+    // eslint-disable-next-line no-undefined
+    undefined,
+    '0.0.0.0',
+    '::',
+    '::1',
+    'localhost',
+    '127.0.0.1',
+    'local-ip',
+    'local-ipv4',
+    'local-ipv6',
+  ];
+
+  for (const host of hosts) {
+    it(`should work using "${host}" host and port as number`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = { port };
+
+      if (host !== '<not-specified>') {
+        devServerOptions.host = host;
+      }
+
+      const server = new Server(devServerOptions, compiler);
+
+      let hostname = host;
+
+      if (hostname === '<not-specified>' || typeof hostname === 'undefined') {
+        // If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '0.0.0.0') {
+        hostname = ipv4;
+      } else if (hostname === '::') {
+        // In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '::1') {
+        hostname = '[::1]';
+      } else if (hostname === 'local-ip' || hostname === 'local-ipv4') {
+        hostname = ipv4;
+      } else if (hostname === 'local-ipv6') {
+        // For test env where network ipv6 doesn't work
+        hostname = ipv6 ? `[${ipv6}]` : '[::1]';
+      }
+
+      await server.start();
+
+      expect(server.server.address()).toMatchObject(
+        await getAddress(host, hostname),
+      );
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${hostname}:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work using "${host}" host and port as string`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = { port: `${port}` };
+
+      if (host !== '<not-specified>') {
+        devServerOptions.host = host;
+      }
+
+      const server = new Server(devServerOptions, compiler);
+
+      let hostname = host;
+
+      if (hostname === '<not-specified>' || typeof hostname === 'undefined') {
+        // If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '0.0.0.0') {
+        hostname = ipv4;
+      } else if (hostname === '::') {
+        // In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '::1') {
+        hostname = '[::1]';
+      } else if (hostname === 'local-ip' || hostname === 'local-ipv4') {
+        hostname = ipv4;
+      } else if (hostname === 'local-ipv6') {
+        // For test env where network ipv6 doesn't work
+        hostname = ipv6 ? `[${ipv6}]` : '[::1]';
+      }
+
+      await server.start();
+
+      expect(server.server.address()).toMatchObject(
+        await getAddress(host, hostname),
+      );
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${hostname}:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work using "${host}" host and "auto" port`, async () => {
+      const compiler = webpack(config);
+
+      process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
+
+      const devServerOptions = { port: 'auto' };
+
+      if (host !== '<not-specified>') {
+        devServerOptions.host = host;
+      }
+
+      const server = new Server(devServerOptions, compiler);
+
+      let hostname = host;
+
+      if (hostname === '<not-specified>' || typeof hostname === 'undefined') {
+        // If host is omitted, the server will accept connections on the unspecified IPv6 address (::) when IPv6 is available, or the unspecified IPv4 address (0.0.0.0) otherwise.
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '0.0.0.0') {
+        hostname = ipv4;
+      } else if (hostname === '::') {
+        // In most operating systems, listening to the unspecified IPv6 address (::) may cause the net.Server to also listen on the unspecified IPv4 address (0.0.0.0).
+        hostname = ipv6 ? `[${ipv6}]` : ipv4;
+      } else if (hostname === '::1') {
+        hostname = '[::1]';
+      } else if (hostname === 'local-ip' || hostname === 'local-ipv4') {
+        hostname = ipv4;
+      } else if (hostname === 'local-ipv6') {
+        // For test env where network ipv6 doesn't work
+        hostname = ipv6 ? `[${ipv6}]` : '[::1]';
+      }
+
+      await server.start();
+
+      expect(server.server.address()).toMatchObject(
+        await getAddress(host, hostname),
+      );
+
+      const address = server.server.address();
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://${hostname}:${address.port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
+
+  // TODO need test on error
+  // it(`should throw an error on invalid host`, async () => {
+  //   const compiler = webpack(config);
+  //   const server = new Server({ port, host: "unknown.unknown" }, compiler);
+  //   const runDevServer = async () => {
+  //     await server.start();
+  //   };
+  //
+  //   return expect(runDevServer()).toBeDefined();
+  // });
 });
diff --git a/tests/e2e/hot-and-live-reload.test.js b/tests/e2e/hot-and-live-reload.test.js
index 650893a..3cb9161 100644
--- a/tests/e2e/hot-and-live-reload.test.js
+++ b/tests/e2e/hot-and-live-reload.test.js
@@ -1,567 +1,569 @@
-const path = require("node:path");
-const WebSocket = require("ws");
-const SockJS = require("sockjs-client");
-const webpack = require("@rspack/core");
-const fs = require("graceful-fs");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const HTMLGeneratorPlugin = require("../helpers/html-generator-plugin");
-const reloadConfig = require("../fixtures/reload-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["hot-and-live-reload"];
-const config = require("../fixtures/client-config/webpack.config");
-const multiCompilerConfig = require("../fixtures/multi-compiler-one-configuration/webpack.config");
-require("../helpers/normalize");
+const path = require('node:path');
+const WebSocket = require('ws');
+const SockJS = require('sockjs-client');
+const webpack = require('@rspack/core');
+const fs = require('graceful-fs');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const HTMLGeneratorPlugin = require('../helpers/html-generator-plugin');
+const reloadConfig = require('../fixtures/reload-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['hot-and-live-reload'];
+const config = require('../fixtures/client-config/webpack.config');
+const multiCompilerConfig = require('../fixtures/multi-compiler-one-configuration/webpack.config');
+require('../helpers/normalize');
 
 const cssFilePath = path.resolve(
-	__dirname,
-	"../fixtures/reload-config/main.css"
+  __dirname,
+  '../fixtures/reload-config/main.css',
 );
 
-const INVALID_MESSAGE = "[webpack-dev-server] App updated. Recompiling...";
-
-describe("hot and live reload", () => {
-	// "sockjs" client cannot add additional headers
-	const modes = [
-		{
-			title: "should work and refresh content using hot module replacement"
-		},
-		{
-			title: "should work and do nothing when web socket server disabled",
-			options: {
-				webSocketServer: false
-			}
-		},
-		// Default web socket serve ("ws")
-		{
-			title:
-				"should work and refresh content using hot module replacement when hot enabled",
-			options: {
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload enabled",
-			options: {
-				liveReload: true
-			}
-		},
-		{
-			title: "should not refresh content when hot and no live reload disabled",
-			options: {
-				hot: false,
-				liveReload: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload disabled and hot enabled",
-			options: {
-				liveReload: false,
-				hot: true
-			}
-		},
-		{
-			title: "should work and refresh content using live reload",
-			options: {
-				liveReload: true,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload enabled and hot disabled",
-			options: {
-				liveReload: true,
-				hot: true
-			}
-		},
-		// "ws" web socket serve
-		{
-			title:
-				"should work and refresh content using hot module replacement when hot enabled",
-			options: {
-				webSocketServer: "ws",
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload enabled",
-			options: {
-				webSocketServer: "ws",
-				liveReload: true
-			}
-		},
-		{
-			title: "should not refresh content when hot and no live reload disabled",
-			options: {
-				webSocketServer: "ws",
-				hot: false,
-				liveReload: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload disabled and hot enabled",
-			options: {
-				webSocketServer: "ws",
-				liveReload: false,
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work and refresh content using live reload when live reload enabled and hot disabled",
-			options: {
-				webSocketServer: "ws",
-				liveReload: true,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload and hot enabled",
-			options: {
-				webSocketServer: "ws",
-				liveReload: true,
-				hot: true
-			}
-		},
-		// "sockjs" web socket serve
-		{
-			title:
-				"should work and refresh content using hot module replacement when hot enabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload enabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				liveReload: true
-			}
-		},
-		{
-			title: "should not refresh content when hot and no live reload disabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				hot: false,
-				liveReload: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload disabled and hot enabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				liveReload: false,
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work and refresh content using live reload when live reload disabled and hot enabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				liveReload: true,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work and refresh content using hot module replacement when live reload and hot enabled",
-			options: {
-				allowedHosts: "all",
-
-				webSocketServer: "sockjs",
-				liveReload: true,
-				hot: true
-			}
-		},
-		{
-			title:
-				'should work and allow to disable hot module replacement using the "webpack-dev-server-hot=false"',
-			query: "?webpack-dev-server-hot=false",
-			options: {
-				liveReload: true,
-				hot: true
-			}
-		},
-		{
-			title:
-				'should work and allow to disable live reload using the "webpack-dev-server-live-reload=false"',
-			query: "?webpack-dev-server-live-reload=false",
-			options: {
-				liveReload: true,
-				hot: false
-			}
-		},
-		{
-			title:
-				'should work and allow to disable hot module replacement and live reload using the "webpack-dev-server-hot=false&webpack-dev-server-live-reload=false"',
-			query:
-				"?webpack-dev-server-hot=false&webpack-dev-server-live-reload=false",
-			options: {
-				liveReload: true,
-				hot: true
-			}
-		},
-		{
-			title: "should work with manual client setup",
-			webpackOptions: {
-				entry: [
-					require.resolve("@rspack/dev-server/client/index.js"),
-					require.resolve("../fixtures/reload-config/foo.js")
-				]
-			},
-			options: {
-				client: false,
-				liveReload: true,
-				hot: true
-			}
-		},
-		// TODO we still output logs from webpack, need to improve this
-		{
-			title:
-				"should work with manual client setup and allow to enable hot module replacement",
-			webpackOptions: {
-				entry: [
-					"@rspack/core/hot/dev-server",
-					`${require.resolve("@rspack/dev-server/client/index.js")}?hot=true`,
-					require.resolve("../fixtures/reload-config/foo.js")
-				],
-				plugins: [
-					new webpack.HotModuleReplacementPlugin(),
-					new HTMLGeneratorPlugin()
-				]
-			},
-			options: {
-				client: false,
-				liveReload: false,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work with manual client setup and allow to disable hot module replacement",
-			webpackOptions: {
-				entry: [
-					`${require.resolve("@rspack/dev-server/client/index.js")}?hot=false`,
-					require.resolve("../fixtures/reload-config/foo.js")
-				]
-			},
-			options: {
-				client: false,
-				liveReload: true,
-				hot: true
-			}
-		},
-		{
-			title:
-				"should work with manual client setup and allow to enable live reload",
-			webpackOptions: {
-				entry: [
-					`${require.resolve("@rspack/dev-server/client/index.js")}?live-reload=true`,
-					require.resolve("../fixtures/reload-config/foo.js")
-				]
-			},
-			options: {
-				client: false,
-				liveReload: false,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work with manual client setup and allow to disable live reload",
-			webpackOptions: {
-				entry: [
-					`${require.resolve("@rspack/dev-server/client/index.js")}?live-reload=false`,
-					require.resolve("../fixtures/reload-config/foo.js")
-				]
-			},
-			options: {
-				client: false,
-				liveReload: true,
-				hot: false
-			}
-		}
-	];
-
-	let browser;
-	let server;
-
-	beforeEach(() => {
-		fs.writeFileSync(cssFilePath, "body { background-color: rgb(0, 0, 255); }");
-	});
-
-	afterEach(async () => {
-		if (browser) {
-			await browser.close();
-		}
-
-		if (server) {
-			await server.stop();
-		}
-
-		fs.unlinkSync(cssFilePath);
-	});
-
-	for (const mode of modes) {
-		const webSocketServerTitle = mode.options?.webSocketServer
-			? mode.options.webSocketServer
-			: "default";
-
-		it(`${mode.title} (${webSocketServerTitle})`, async () => {
-			const webpackOptions = { ...reloadConfig, ...mode.webpackOptions };
-			const compiler = webpack(webpackOptions);
-			const testDevServerOptions = mode.options || {};
-			const devServerOptions = { port, ...testDevServerOptions };
-
-			server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const webSocketServerLaunched =
-				testDevServerOptions.webSocketServer !== false;
-
-			await new Promise(resolve => {
-				const webSocketTransport =
-					typeof testDevServerOptions.webSocketServer !== "undefined" &&
-					testDevServerOptions.webSocketServer !== false
-						? testDevServerOptions.webSocketServer
-						: "ws";
-
-				if (webSocketTransport === "ws") {
-					const ws = new WebSocket(
-						`ws://127.0.0.1:${devServerOptions.port}/ws`,
-						{
-							headers: {
-								host: `127.0.0.1:${devServerOptions.port}`,
-								origin: `http://127.0.0.1:${devServerOptions.port}`
-							}
-						}
-					);
-
-					let opened = false;
-					let received = false;
-					let errored = false;
-
-					ws.on("error", error => {
-						if (!webSocketServerLaunched && /404/.test(error)) {
-							errored = true;
-						} else {
-							errored = true;
-						}
-
-						ws.close();
-					});
-
-					ws.on("open", () => {
-						opened = true;
-					});
-
-					ws.on("message", data => {
-						const message = JSON.parse(data.toString());
-
-						if (message.type === "ok") {
-							received = true;
-
-							ws.close();
-						}
-					});
-
-					ws.on("close", () => {
-						if (opened && received && !errored) {
-							resolve();
-						} else if (!webSocketServerLaunched && errored) {
-							resolve();
-						}
-					});
-				} else {
-					const sockjs = new SockJS(
-						`http://127.0.0.1:${devServerOptions.port}/ws`
-					);
-
-					let opened = false;
-					let received = false;
-					let errored = false;
-
-					sockjs.onerror = () => {
-						errored = true;
-					};
-
-					sockjs.onopen = () => {
-						opened = true;
-					};
-
-					sockjs.onmessage = ({ data }) => {
-						const message = JSON.parse(data.toString());
-
-						if (message.type === "ok") {
-							received = true;
-
-							sockjs.close();
-						}
-					};
-
-					sockjs.onclose = event => {
-						if (opened && received && !errored) {
-							resolve();
-						} else if (event && event.reason === "Cannot connect to server") {
-							resolve();
-						}
-					};
-				}
-			});
-
-			const launched = await runBrowser();
-
-			({ browser } = launched);
-
-			const page = launched.page;
-
-			const consoleMessages = [];
-			const pageErrors = [];
-
-			let doneHotUpdate = false;
-			let hasDisconnectedMessage = false;
-
-			page
-				.on("console", message => {
-					if (!hasDisconnectedMessage) {
-						const text = message.text();
-
-						hasDisconnectedMessage = /Disconnected!/.test(text);
-						consoleMessages.push(text);
-					}
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", requestObj => {
-					if (/\.hot-update\.json$/.test(requestObj.url())) {
-						doneHotUpdate = true;
-					}
-				});
-
-			await page.goto(`http://localhost:${port}/${mode.query || ""}`, {
-				waitUntil: "networkidle0"
-			});
-
-			const backgroundColorBefore = await page.evaluate(() => {
-				const body = document.body;
-
-				return getComputedStyle(body)["background-color"];
-			});
-
-			expect(backgroundColorBefore).toEqual("rgb(0, 0, 255)");
-
-			fs.writeFileSync(
-				cssFilePath,
-				"body { background-color: rgb(255, 0, 0); }"
-			);
-
-			let waitHot =
-				typeof testDevServerOptions.hot !== "undefined"
-					? testDevServerOptions.hot
-					: true;
-			let waitLiveReload =
-				typeof testDevServerOptions.liveReload !== "undefined"
-					? testDevServerOptions.liveReload
-					: true;
-
-			if (webSocketServerLaunched === false) {
-				waitHot = false;
-				waitLiveReload = false;
-			}
-
-			if (Array.isArray(webpackOptions.entry)) {
-				if (webpackOptions.entry.some(item => item.includes("hot=true"))) {
-					waitHot = true;
-				} else if (
-					webpackOptions.entry.some(item => item.includes("hot=false"))
-				) {
-					waitHot = false;
-				}
-			}
-
-			if (Array.isArray(webpackOptions.entry)) {
-				if (
-					webpackOptions.entry.some(item => item.includes("live-reload=true"))
-				) {
-					waitLiveReload = true;
-				} else if (
-					webpackOptions.entry.some(item => item.includes("live-reload=false"))
-				) {
-					waitLiveReload = false;
-				}
-			}
-
-			const query = mode.query || "";
-
-			if (query.includes("webpack-dev-server-hot=false")) {
-				waitHot = false;
-			}
-
-			if (query.includes("webpack-dev-server-live-reload=false")) {
-				waitLiveReload = false;
-			}
-
-			if (waitHot) {
-				await page.waitForFunction(
-					() =>
-						getComputedStyle(document.body)["background-color"] ===
-						"rgb(255, 0, 0)"
-				);
-
-				expect(doneHotUpdate).toBe(true);
-			} else if (waitLiveReload) {
-				await page.waitForNavigation({
-					waitUntil: "networkidle0"
-				});
-			} else if (webSocketServerLaunched) {
-				await new Promise(resolve => {
-					const interval = setInterval(() => {
-						if (consoleMessages.includes(INVALID_MESSAGE)) {
-							clearInterval(interval);
-
-							resolve();
-						}
-					}, 100);
-				});
-			}
-
-			const backgroundColorAfter = await page.evaluate(() => {
-				const body = document.body;
-
-				return getComputedStyle(body)["background-color"];
-			});
-
-			if (!waitHot && !waitLiveReload) {
-				expect(backgroundColorAfter).toEqual("rgb(0, 0, 255)");
-			} else {
-				expect(backgroundColorAfter).toEqual("rgb(255, 0, 0)");
-			}
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	}
+const INVALID_MESSAGE = '[webpack-dev-server] App updated. Recompiling...';
+
+describe('hot and live reload', () => {
+  // "sockjs" client cannot add additional headers
+  const modes = [
+    {
+      title: 'should work and refresh content using hot module replacement',
+    },
+    {
+      title: 'should work and do nothing when web socket server disabled',
+      options: {
+        webSocketServer: false,
+      },
+    },
+    // Default web socket serve ("ws")
+    {
+      title:
+        'should work and refresh content using hot module replacement when hot enabled',
+      options: {
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload enabled',
+      options: {
+        liveReload: true,
+      },
+    },
+    {
+      title: 'should not refresh content when hot and no live reload disabled',
+      options: {
+        hot: false,
+        liveReload: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload disabled and hot enabled',
+      options: {
+        liveReload: false,
+        hot: true,
+      },
+    },
+    {
+      title: 'should work and refresh content using live reload',
+      options: {
+        liveReload: true,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload enabled and hot disabled',
+      options: {
+        liveReload: true,
+        hot: true,
+      },
+    },
+    // "ws" web socket serve
+    {
+      title:
+        'should work and refresh content using hot module replacement when hot enabled',
+      options: {
+        webSocketServer: 'ws',
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload enabled',
+      options: {
+        webSocketServer: 'ws',
+        liveReload: true,
+      },
+    },
+    {
+      title: 'should not refresh content when hot and no live reload disabled',
+      options: {
+        webSocketServer: 'ws',
+        hot: false,
+        liveReload: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload disabled and hot enabled',
+      options: {
+        webSocketServer: 'ws',
+        liveReload: false,
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using live reload when live reload enabled and hot disabled',
+      options: {
+        webSocketServer: 'ws',
+        liveReload: true,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload and hot enabled',
+      options: {
+        webSocketServer: 'ws',
+        liveReload: true,
+        hot: true,
+      },
+    },
+    // "sockjs" web socket serve
+    {
+      title:
+        'should work and refresh content using hot module replacement when hot enabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload enabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        liveReload: true,
+      },
+    },
+    {
+      title: 'should not refresh content when hot and no live reload disabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        hot: false,
+        liveReload: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload disabled and hot enabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        liveReload: false,
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using live reload when live reload disabled and hot enabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        liveReload: true,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and refresh content using hot module replacement when live reload and hot enabled',
+      options: {
+        allowedHosts: 'all',
+
+        webSocketServer: 'sockjs',
+        liveReload: true,
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and allow to disable hot module replacement using the "webpack-dev-server-hot=false"',
+      query: '?webpack-dev-server-hot=false',
+      options: {
+        liveReload: true,
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work and allow to disable live reload using the "webpack-dev-server-live-reload=false"',
+      query: '?webpack-dev-server-live-reload=false',
+      options: {
+        liveReload: true,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and allow to disable hot module replacement and live reload using the "webpack-dev-server-hot=false&webpack-dev-server-live-reload=false"',
+      query:
+        '?webpack-dev-server-hot=false&webpack-dev-server-live-reload=false',
+      options: {
+        liveReload: true,
+        hot: true,
+      },
+    },
+    {
+      title: 'should work with manual client setup',
+      webpackOptions: {
+        entry: [
+          require.resolve('@rspack/dev-server/client/index.js'),
+          require.resolve('../fixtures/reload-config/foo.js'),
+        ],
+      },
+      options: {
+        client: false,
+        liveReload: true,
+        hot: true,
+      },
+    },
+    // TODO we still output logs from webpack, need to improve this
+    {
+      title:
+        'should work with manual client setup and allow to enable hot module replacement',
+      webpackOptions: {
+        entry: [
+          '@rspack/core/hot/dev-server',
+          `${require.resolve('@rspack/dev-server/client/index.js')}?hot=true`,
+          require.resolve('../fixtures/reload-config/foo.js'),
+        ],
+        plugins: [
+          new webpack.HotModuleReplacementPlugin(),
+          new HTMLGeneratorPlugin(),
+        ],
+      },
+      options: {
+        client: false,
+        liveReload: false,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work with manual client setup and allow to disable hot module replacement',
+      webpackOptions: {
+        entry: [
+          `${require.resolve('@rspack/dev-server/client/index.js')}?hot=false`,
+          require.resolve('../fixtures/reload-config/foo.js'),
+        ],
+      },
+      options: {
+        client: false,
+        liveReload: true,
+        hot: true,
+      },
+    },
+    {
+      title:
+        'should work with manual client setup and allow to enable live reload',
+      webpackOptions: {
+        entry: [
+          `${require.resolve('@rspack/dev-server/client/index.js')}?live-reload=true`,
+          require.resolve('../fixtures/reload-config/foo.js'),
+        ],
+      },
+      options: {
+        client: false,
+        liveReload: false,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work with manual client setup and allow to disable live reload',
+      webpackOptions: {
+        entry: [
+          `${require.resolve('@rspack/dev-server/client/index.js')}?live-reload=false`,
+          require.resolve('../fixtures/reload-config/foo.js'),
+        ],
+      },
+      options: {
+        client: false,
+        liveReload: true,
+        hot: false,
+      },
+    },
+  ];
+
+  let browser;
+  let server;
+
+  beforeEach(() => {
+    fs.writeFileSync(cssFilePath, 'body { background-color: rgb(0, 0, 255); }');
+  });
+
+  afterEach(async () => {
+    if (browser) {
+      await browser.close();
+    }
+
+    if (server) {
+      await server.stop();
+    }
+
+    fs.unlinkSync(cssFilePath);
+  });
+
+  for (const mode of modes) {
+    const webSocketServerTitle = mode.options?.webSocketServer
+      ? mode.options.webSocketServer
+      : 'default';
+
+    it(`${mode.title} (${webSocketServerTitle})`, async () => {
+      const webpackOptions = { ...reloadConfig, ...mode.webpackOptions };
+      const compiler = webpack(webpackOptions);
+      const testDevServerOptions = mode.options || {};
+      const devServerOptions = { port, ...testDevServerOptions };
+
+      server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const webSocketServerLaunched =
+        testDevServerOptions.webSocketServer !== false;
+
+      await new Promise((resolve) => {
+        const webSocketTransport =
+          typeof testDevServerOptions.webSocketServer !== 'undefined' &&
+          testDevServerOptions.webSocketServer !== false
+            ? testDevServerOptions.webSocketServer
+            : 'ws';
+
+        if (webSocketTransport === 'ws') {
+          const ws = new WebSocket(
+            `ws://127.0.0.1:${devServerOptions.port}/ws`,
+            {
+              headers: {
+                host: `127.0.0.1:${devServerOptions.port}`,
+                origin: `http://127.0.0.1:${devServerOptions.port}`,
+              },
+            },
+          );
+
+          let opened = false;
+          let received = false;
+          let errored = false;
+
+          ws.on('error', (error) => {
+            if (!webSocketServerLaunched && /404/.test(error)) {
+              errored = true;
+            } else {
+              errored = true;
+            }
+
+            ws.close();
+          });
+
+          ws.on('open', () => {
+            opened = true;
+          });
+
+          ws.on('message', (data) => {
+            const message = JSON.parse(data.toString());
+
+            if (message.type === 'ok') {
+              received = true;
+
+              ws.close();
+            }
+          });
+
+          ws.on('close', () => {
+            if (opened && received && !errored) {
+              resolve();
+            } else if (!webSocketServerLaunched && errored) {
+              resolve();
+            }
+          });
+        } else {
+          const sockjs = new SockJS(
+            `http://127.0.0.1:${devServerOptions.port}/ws`,
+          );
+
+          let opened = false;
+          let received = false;
+          let errored = false;
+
+          sockjs.onerror = () => {
+            errored = true;
+          };
+
+          sockjs.onopen = () => {
+            opened = true;
+          };
+
+          sockjs.onmessage = ({ data }) => {
+            const message = JSON.parse(data.toString());
+
+            if (message.type === 'ok') {
+              received = true;
+
+              sockjs.close();
+            }
+          };
+
+          sockjs.onclose = (event) => {
+            if (opened && received && !errored) {
+              resolve();
+            } else if (event && event.reason === 'Cannot connect to server') {
+              resolve();
+            }
+          };
+        }
+      });
+
+      const launched = await runBrowser();
+
+      ({ browser } = launched);
+
+      const page = launched.page;
+
+      const consoleMessages = [];
+      const pageErrors = [];
+
+      let doneHotUpdate = false;
+      let hasDisconnectedMessage = false;
+
+      page
+        .on('console', (message) => {
+          if (!hasDisconnectedMessage) {
+            const text = message.text();
+
+            hasDisconnectedMessage = /Disconnected!/.test(text);
+            consoleMessages.push(text);
+          }
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (requestObj) => {
+          if (/\.hot-update\.json$/.test(requestObj.url())) {
+            doneHotUpdate = true;
+          }
+        });
+
+      await page.goto(`http://localhost:${port}/${mode.query || ''}`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const backgroundColorBefore = await page.evaluate(() => {
+        const body = document.body;
+
+        return getComputedStyle(body)['background-color'];
+      });
+
+      expect(backgroundColorBefore).toEqual('rgb(0, 0, 255)');
+
+      fs.writeFileSync(
+        cssFilePath,
+        'body { background-color: rgb(255, 0, 0); }',
+      );
+
+      let waitHot =
+        typeof testDevServerOptions.hot !== 'undefined'
+          ? testDevServerOptions.hot
+          : true;
+      let waitLiveReload =
+        typeof testDevServerOptions.liveReload !== 'undefined'
+          ? testDevServerOptions.liveReload
+          : true;
+
+      if (webSocketServerLaunched === false) {
+        waitHot = false;
+        waitLiveReload = false;
+      }
+
+      if (Array.isArray(webpackOptions.entry)) {
+        if (webpackOptions.entry.some((item) => item.includes('hot=true'))) {
+          waitHot = true;
+        } else if (
+          webpackOptions.entry.some((item) => item.includes('hot=false'))
+        ) {
+          waitHot = false;
+        }
+      }
+
+      if (Array.isArray(webpackOptions.entry)) {
+        if (
+          webpackOptions.entry.some((item) => item.includes('live-reload=true'))
+        ) {
+          waitLiveReload = true;
+        } else if (
+          webpackOptions.entry.some((item) =>
+            item.includes('live-reload=false'),
+          )
+        ) {
+          waitLiveReload = false;
+        }
+      }
+
+      const query = mode.query || '';
+
+      if (query.includes('webpack-dev-server-hot=false')) {
+        waitHot = false;
+      }
+
+      if (query.includes('webpack-dev-server-live-reload=false')) {
+        waitLiveReload = false;
+      }
+
+      if (waitHot) {
+        await page.waitForFunction(
+          () =>
+            getComputedStyle(document.body)['background-color'] ===
+            'rgb(255, 0, 0)',
+        );
+
+        expect(doneHotUpdate).toBe(true);
+      } else if (waitLiveReload) {
+        await page.waitForNavigation({
+          waitUntil: 'networkidle0',
+        });
+      } else if (webSocketServerLaunched) {
+        await new Promise((resolve) => {
+          const interval = setInterval(() => {
+            if (consoleMessages.includes(INVALID_MESSAGE)) {
+              clearInterval(interval);
+
+              resolve();
+            }
+          }, 100);
+        });
+      }
+
+      const backgroundColorAfter = await page.evaluate(() => {
+        const body = document.body;
+
+        return getComputedStyle(body)['background-color'];
+      });
+
+      if (!waitHot && !waitLiveReload) {
+        expect(backgroundColorAfter).toEqual('rgb(0, 0, 255)');
+      } else {
+        expect(backgroundColorAfter).toEqual('rgb(255, 0, 0)');
+      }
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  }
 });
 
 // the following cases check to make sure that the HMR
diff --git a/tests/e2e/ipc.test.js b/tests/e2e/ipc.test.js
index 74be729..8e2871c 100644
--- a/tests/e2e/ipc.test.js
+++ b/tests/e2e/ipc.test.js
@@ -1,346 +1,346 @@
-const os = require("node:os");
-const net = require("node:net");
-const path = require("node:path");
-const http = require("node:http");
-const webpack = require("@rspack/core");
-const httpProxy = require("http-proxy");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const sessionSubscribe = require("../helpers/session-subscribe");
-const port1 = require("../helpers/ports-map").ipc;
-
-const webSocketServers = ["ws", "sockjs"];
-
-describe("web socket server URL", () => {
-	for (const webSocketServer of webSocketServers) {
-		const websocketURLProtocol = webSocketServer === "ws" ? "ws" : "http";
-
-		it(`should work with the "ipc" option using "true" value ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const proxyHost = devServerHost;
-			const proxyPort = port1;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				ipc: true
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const proxy = httpProxy.createProxyServer({
-					target: { socketPath: server.options.ipc }
-				});
-
-				const proxyServer = http.createServer((request, response) => {
-					// You can define here your custom logic to handle the request
-					// and then proxy the request.
-					proxy.web(request, response);
-				});
-
-				proxyServer.on("upgrade", (request, socket, head) => {
-					proxy.ws(request, socket, head);
-				});
-
-				return proxyServer.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "ipc" option using "string" value ("${webSocketServer}")`, async () => {
-			const isWindows = process.platform === "win32";
-			const pipePrefix = isWindows ? "\\\\.\\pipe\\" : os.tmpdir();
-			const pipeName = `webpack-dev-server.${process.pid}-1.sock`;
-			const ipc = path.join(pipePrefix, pipeName);
-
-			const devServerHost = "127.0.0.1";
-			const proxyHost = devServerHost;
-			const proxyPort = port1;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				ipc
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const proxy = httpProxy.createProxyServer({
-					target: { socketPath: ipc }
-				});
-
-				const proxyServer = http.createServer((request, response) => {
-					// You can define here your custom logic to handle the request
-					// and then proxy the request.
-					proxy.web(request, response);
-				});
-
-				proxyServer.on("upgrade", (request, socket, head) => {
-					proxy.ws(request, socket, head);
-				});
-
-				return proxyServer.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		// TODO un skip after implement new API
-		it.skip(`should work with the "ipc" option using "string" value and remove old ("${webSocketServer}")`, async () => {
-			const isWindows = process.platform === "win32";
-			const localRelative = path.relative(process.cwd(), `${os.tmpdir()}/`);
-			const pipePrefix = isWindows ? "\\\\.\\pipe\\" : localRelative;
-			const pipeName = `webpack-dev-server.${process.pid}-2.sock`;
-			const ipc = path.join(pipePrefix, pipeName);
-
-			const ipcServer = await new Promise((resolve, reject) => {
-				const server = net.Server();
-
-				server.on("error", error => {
-					reject(error);
-				});
-
-				return server.listen(ipc, () => {
-					resolve();
-				});
-			});
-
-			const devServerHost = "127.0.0.1";
-			const proxyHost = devServerHost;
-			const proxyPort = port1;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				host: devServerHost,
-				ipc
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const proxy = httpProxy.createProxyServer({
-					target: { socketPath: ipc }
-				});
-
-				const proxyServer = http.createServer((request, response) => {
-					// You can define here your custom logic to handle the request
-					// and then proxy the request.
-					proxy.web(request, response);
-				});
-
-				proxyServer.on("upgrade", (request, socket, head) => {
-					proxy.ws(request, socket, head);
-				});
-
-				return proxyServer.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await new Promise((resolve, reject) => {
-					ipcServer.close(error => {
-						if (error) {
-							reject(error);
-
-							return;
-						}
-
-						resolve();
-					});
-				});
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
+const os = require('node:os');
+const net = require('node:net');
+const path = require('node:path');
+const http = require('node:http');
+const webpack = require('@rspack/core');
+const httpProxy = require('http-proxy');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const sessionSubscribe = require('../helpers/session-subscribe');
+const port1 = require('../helpers/ports-map').ipc;
+
+const webSocketServers = ['ws', 'sockjs'];
+
+describe('web socket server URL', () => {
+  for (const webSocketServer of webSocketServers) {
+    const websocketURLProtocol = webSocketServer === 'ws' ? 'ws' : 'http';
+
+    it(`should work with the "ipc" option using "true" value ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const proxyHost = devServerHost;
+      const proxyPort = port1;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        ipc: true,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const proxy = httpProxy.createProxyServer({
+          target: { socketPath: server.options.ipc },
+        });
+
+        const proxyServer = http.createServer((request, response) => {
+          // You can define here your custom logic to handle the request
+          // and then proxy the request.
+          proxy.web(request, response);
+        });
+
+        proxyServer.on('upgrade', (request, socket, head) => {
+          proxy.ws(request, socket, head);
+        });
+
+        return proxyServer.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "ipc" option using "string" value ("${webSocketServer}")`, async () => {
+      const isWindows = process.platform === 'win32';
+      const pipePrefix = isWindows ? '\\\\.\\pipe\\' : os.tmpdir();
+      const pipeName = `webpack-dev-server.${process.pid}-1.sock`;
+      const ipc = path.join(pipePrefix, pipeName);
+
+      const devServerHost = '127.0.0.1';
+      const proxyHost = devServerHost;
+      const proxyPort = port1;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        ipc,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const proxy = httpProxy.createProxyServer({
+          target: { socketPath: ipc },
+        });
+
+        const proxyServer = http.createServer((request, response) => {
+          // You can define here your custom logic to handle the request
+          // and then proxy the request.
+          proxy.web(request, response);
+        });
+
+        proxyServer.on('upgrade', (request, socket, head) => {
+          proxy.ws(request, socket, head);
+        });
+
+        return proxyServer.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    // TODO un skip after implement new API
+    it.skip(`should work with the "ipc" option using "string" value and remove old ("${webSocketServer}")`, async () => {
+      const isWindows = process.platform === 'win32';
+      const localRelative = path.relative(process.cwd(), `${os.tmpdir()}/`);
+      const pipePrefix = isWindows ? '\\\\.\\pipe\\' : localRelative;
+      const pipeName = `webpack-dev-server.${process.pid}-2.sock`;
+      const ipc = path.join(pipePrefix, pipeName);
+
+      const ipcServer = await new Promise((resolve, reject) => {
+        const server = net.Server();
+
+        server.on('error', (error) => {
+          reject(error);
+        });
+
+        return server.listen(ipc, () => {
+          resolve();
+        });
+      });
+
+      const devServerHost = '127.0.0.1';
+      const proxyHost = devServerHost;
+      const proxyPort = port1;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        host: devServerHost,
+        ipc,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const proxy = httpProxy.createProxyServer({
+          target: { socketPath: ipc },
+        });
+
+        const proxyServer = http.createServer((request, response) => {
+          // You can define here your custom logic to handle the request
+          // and then proxy the request.
+          proxy.web(request, response);
+        });
+
+        proxyServer.on('upgrade', (request, socket, head) => {
+          proxy.ws(request, socket, head);
+        });
+
+        return proxyServer.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${proxyPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await new Promise((resolve, reject) => {
+          ipcServer.close((error) => {
+            if (error) {
+              reject(error);
+
+              return;
+            }
+
+            resolve();
+          });
+        });
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
 });
diff --git a/tests/e2e/lazy-compilation.test.js b/tests/e2e/lazy-compilation.test.js
index 4851385..36d838d 100644
--- a/tests/e2e/lazy-compilation.test.js
+++ b/tests/e2e/lazy-compilation.test.js
@@ -1,106 +1,106 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const lazyCompilationSingleEntryConfig = require("../fixtures/lazy-compilation-single-entry/webpack.config");
-const lazyCompilationMultipleEntriesConfig = require("../fixtures/lazy-compilation-multiple-entries/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["lazy-compilation"];
-
-describe("lazy compilation", () => {
-	// TODO jest freeze due webpack do not close `eventsource`, we should uncomment this after fix it on webpack side
-	it.skip("should work with single entry", async () => {
-		const compiler = webpack(lazyCompilationSingleEntryConfig);
-		const server = new Server({ port }, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/test.html`, {
-				waitUntil: "domcontentloaded"
-			});
-			await new Promise(resolve => {
-				const interval = setInterval(() => {
-					if (consoleMessages.includes("Hey.")) {
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 100);
-			});
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it.skip("should work with multiple entries", async () => {
-		const compiler = webpack(lazyCompilationMultipleEntriesConfig);
-		const server = new Server({ port }, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/test-one.html`, {
-				waitUntil: "domcontentloaded"
-			});
-			await new Promise(resolve => {
-				const interval = setInterval(() => {
-					console.log(consoleMessages);
-					if (consoleMessages.includes("One.")) {
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 100);
-			});
-
-			await page.goto(`http://127.0.0.1:${port}/test-two.html`, {
-				waitUntil: "domcontentloaded"
-			});
-			await new Promise(resolve => {
-				const interval = setInterval(() => {
-					console.log(consoleMessages);
-					if (consoleMessages.includes("Two.")) {
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 100);
-			});
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const lazyCompilationSingleEntryConfig = require('../fixtures/lazy-compilation-single-entry/webpack.config');
+const lazyCompilationMultipleEntriesConfig = require('../fixtures/lazy-compilation-multiple-entries/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['lazy-compilation'];
+
+describe('lazy compilation', () => {
+  // TODO jest freeze due webpack do not close `eventsource`, we should uncomment this after fix it on webpack side
+  it.skip('should work with single entry', async () => {
+    const compiler = webpack(lazyCompilationSingleEntryConfig);
+    const server = new Server({ port }, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/test.html`, {
+        waitUntil: 'domcontentloaded',
+      });
+      await new Promise((resolve) => {
+        const interval = setInterval(() => {
+          if (consoleMessages.includes('Hey.')) {
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 100);
+      });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it.skip('should work with multiple entries', async () => {
+    const compiler = webpack(lazyCompilationMultipleEntriesConfig);
+    const server = new Server({ port }, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/test-one.html`, {
+        waitUntil: 'domcontentloaded',
+      });
+      await new Promise((resolve) => {
+        const interval = setInterval(() => {
+          console.log(consoleMessages);
+          if (consoleMessages.includes('One.')) {
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 100);
+      });
+
+      await page.goto(`http://127.0.0.1:${port}/test-two.html`, {
+        waitUntil: 'domcontentloaded',
+      });
+      await new Promise((resolve) => {
+        const interval = setInterval(() => {
+          console.log(consoleMessages);
+          if (consoleMessages.includes('Two.')) {
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 100);
+      });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/e2e/logging.test.js b/tests/e2e/logging.test.js
index 4365de0..848de58 100644
--- a/tests/e2e/logging.test.js
+++ b/tests/e2e/logging.test.js
@@ -1,238 +1,240 @@
-const path = require("node:path");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const HTMLGeneratorPlugin = require("../helpers/html-generator-plugin");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").logging;
-require("../helpers/normalize");
+const path = require('node:path');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const HTMLGeneratorPlugin = require('../helpers/html-generator-plugin');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').logging;
+require('../helpers/normalize');
 
-describe("logging", () => {
-	const webSocketServers = [
-		{ webSocketServer: "ws" },
-		{ webSocketServer: "sockjs" }
-	];
+describe('logging', () => {
+  const webSocketServers = [
+    { webSocketServer: 'ws' },
+    { webSocketServer: 'sockjs' },
+  ];
 
-	const cases = [
-		{
-			title: "should work and log message about live reloading is enabled",
-			devServerOptions: {
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work and log messages about hot and live reloading is enabled",
-			devServerOptions: {
-				hot: true
-			}
-		},
-		{
-			title: "should work and log messages about hot is enabled",
-			devServerOptions: {
-				liveReload: false
-			}
-		},
-		{
-			title:
-				"should work and log messages about hot and live reloading is enabled",
-			devServerOptions: {
-				liveReload: true
-			}
-		},
-		{
-			title:
-				"should work and do not log messages about hot and live reloading is enabled",
-			devServerOptions: {
-				liveReload: false,
-				hot: false
-			}
-		},
-		{
-			title:
-				"should work and log messages about hot and live reloading is enabled",
-			devServerOptions: {
-				liveReload: true,
-				hot: true
-			}
-		},
-		{
-			title: "should work and log warnings by default",
-			webpackOptions: {
-				plugins: [
-					{
-						apply(compiler) {
-							compiler.hooks.thisCompilation.tap(
-								"warnings-webpack-plugin",
-								compilation => {
-									compilation.warnings.push(
-										new Error("Warning from compilation")
-									);
-								}
-							);
-						}
-					},
-					new HTMLGeneratorPlugin()
-				]
-			}
-		},
-		{
-			title: "should work and log errors by default",
-			webpackOptions: {
-				plugins: [
-					{
-						apply(compiler) {
-							compiler.hooks.thisCompilation.tap(
-								"warnings-webpack-plugin",
-								compilation => {
-									compilation.errors.push(new Error("Error from compilation"));
-								}
-							);
-						}
-					},
-					new HTMLGeneratorPlugin()
-				]
-			}
-		},
-		{
-			title: 'should work when the "client.logging" is "info"',
-			devServerOptions: {
-				client: {
-					logging: "info"
-				}
-			}
-		},
-		{
-			title: 'should work when the "client.logging" is "log"',
-			devServerOptions: {
-				client: {
-					logging: "log"
-				}
-			}
-		},
-		{
-			title: 'should work when the "client.logging" is "verbose"',
-			devServerOptions: {
-				client: {
-					logging: "verbose"
-				}
-			}
-		},
-		{
-			title: 'should work when the "client.logging" is "none"',
-			devServerOptions: {
-				client: {
-					logging: "none"
-				}
-			}
-		},
-		{
-			title: "should work and log only error",
-			webpackOptions: {
-				plugins: [
-					{
-						apply(compiler) {
-							compiler.hooks.thisCompilation.tap(
-								"warnings-webpack-plugin",
-								compilation => {
-									compilation.warnings.push(
-										new Error("Warning from compilation")
-									);
-									compilation.errors.push(new Error("Error from compilation"));
-								}
-							);
-						}
-					},
-					new HTMLGeneratorPlugin()
-				]
-			},
-			devServerOptions: {
-				client: {
-					logging: "error"
-				}
-			}
-		},
-		{
-			title: "should work and log warning and errors",
-			webpackOptions: {
-				plugins: [
-					{
-						apply(compiler) {
-							compiler.hooks.thisCompilation.tap(
-								"warnings-webpack-plugin",
-								compilation => {
-									compilation.warnings.push(
-										new Error("Warning from compilation")
-									);
-									compilation.errors.push(new Error("Error from compilation"));
-								}
-							);
-						}
-					},
-					new HTMLGeneratorPlugin()
-				]
-			},
-			devServerOptions: {
-				client: {
-					logging: "warn"
-				}
-			}
-		},
-		{
-			title: "should work and log static changes",
-			devServerOptions: {
-				static: path.resolve(__dirname, "../fixtures/client-config/static")
-			}
-		}
-	];
+  const cases = [
+    {
+      title: 'should work and log message about live reloading is enabled',
+      devServerOptions: {
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and log messages about hot and live reloading is enabled',
+      devServerOptions: {
+        hot: true,
+      },
+    },
+    {
+      title: 'should work and log messages about hot is enabled',
+      devServerOptions: {
+        liveReload: false,
+      },
+    },
+    {
+      title:
+        'should work and log messages about hot and live reloading is enabled',
+      devServerOptions: {
+        liveReload: true,
+      },
+    },
+    {
+      title:
+        'should work and do not log messages about hot and live reloading is enabled',
+      devServerOptions: {
+        liveReload: false,
+        hot: false,
+      },
+    },
+    {
+      title:
+        'should work and log messages about hot and live reloading is enabled',
+      devServerOptions: {
+        liveReload: true,
+        hot: true,
+      },
+    },
+    {
+      title: 'should work and log warnings by default',
+      webpackOptions: {
+        plugins: [
+          {
+            apply(compiler) {
+              compiler.hooks.thisCompilation.tap(
+                'warnings-webpack-plugin',
+                (compilation) => {
+                  compilation.warnings.push(
+                    new Error('Warning from compilation'),
+                  );
+                },
+              );
+            },
+          },
+          new HTMLGeneratorPlugin(),
+        ],
+      },
+    },
+    {
+      title: 'should work and log errors by default',
+      webpackOptions: {
+        plugins: [
+          {
+            apply(compiler) {
+              compiler.hooks.thisCompilation.tap(
+                'warnings-webpack-plugin',
+                (compilation) => {
+                  compilation.errors.push(new Error('Error from compilation'));
+                },
+              );
+            },
+          },
+          new HTMLGeneratorPlugin(),
+        ],
+      },
+    },
+    {
+      title: 'should work when the "client.logging" is "info"',
+      devServerOptions: {
+        client: {
+          logging: 'info',
+        },
+      },
+    },
+    {
+      title: 'should work when the "client.logging" is "log"',
+      devServerOptions: {
+        client: {
+          logging: 'log',
+        },
+      },
+    },
+    {
+      title: 'should work when the "client.logging" is "verbose"',
+      devServerOptions: {
+        client: {
+          logging: 'verbose',
+        },
+      },
+    },
+    {
+      title: 'should work when the "client.logging" is "none"',
+      devServerOptions: {
+        client: {
+          logging: 'none',
+        },
+      },
+    },
+    {
+      title: 'should work and log only error',
+      webpackOptions: {
+        plugins: [
+          {
+            apply(compiler) {
+              compiler.hooks.thisCompilation.tap(
+                'warnings-webpack-plugin',
+                (compilation) => {
+                  compilation.warnings.push(
+                    new Error('Warning from compilation'),
+                  );
+                  compilation.errors.push(new Error('Error from compilation'));
+                },
+              );
+            },
+          },
+          new HTMLGeneratorPlugin(),
+        ],
+      },
+      devServerOptions: {
+        client: {
+          logging: 'error',
+        },
+      },
+    },
+    {
+      title: 'should work and log warning and errors',
+      webpackOptions: {
+        plugins: [
+          {
+            apply(compiler) {
+              compiler.hooks.thisCompilation.tap(
+                'warnings-webpack-plugin',
+                (compilation) => {
+                  compilation.warnings.push(
+                    new Error('Warning from compilation'),
+                  );
+                  compilation.errors.push(new Error('Error from compilation'));
+                },
+              );
+            },
+          },
+          new HTMLGeneratorPlugin(),
+        ],
+      },
+      devServerOptions: {
+        client: {
+          logging: 'warn',
+        },
+      },
+    },
+    {
+      title: 'should work and log static changes',
+      devServerOptions: {
+        static: path.resolve(__dirname, '../fixtures/client-config/static'),
+      },
+    },
+  ];
 
-	for (const webSocketServer of webSocketServers) {
-		for (const testCase of cases) {
-			it(`${testCase.title} (${
-				webSocketServer.webSocketServer || "default"
-			})`, async () => {
-				const compiler = webpack({ ...config, ...testCase.webpackOptions });
-				const devServerOptions = {
-					port,
-					...testCase.devServerOptions
-				};
-				const server = new Server(devServerOptions, compiler);
+  for (const webSocketServer of webSocketServers) {
+    for (const testCase of cases) {
+      it(`${testCase.title} (${
+        webSocketServer.webSocketServer || 'default'
+      })`, async () => {
+        const compiler = webpack({ ...config, ...testCase.webpackOptions });
+        const devServerOptions = {
+          port,
+          ...testCase.devServerOptions,
+        };
+        const server = new Server(devServerOptions, compiler);
 
-				await server.start();
+        await server.start();
 
-				const { page, browser } = await runBrowser();
+        const { page, browser } = await runBrowser();
 
-				try {
-					const consoleMessages = [];
+        try {
+          const consoleMessages = [];
 
-					page.on("console", message => {
-						consoleMessages.push(message);
-					});
+          page.on('console', (message) => {
+            consoleMessages.push(message);
+          });
 
-					await page.goto(`http://localhost:${port}/`, {
-						waitUntil: "networkidle0"
-					});
+          await page.goto(`http://localhost:${port}/`, {
+            waitUntil: 'networkidle0',
+          });
 
-					if (testCase.devServerOptions?.static) {
-						fs.writeFileSync(
-							path.join(testCase.devServerOptions.static, "./foo.txt"),
-							"Text"
-						);
+          if (testCase.devServerOptions?.static) {
+            fs.writeFileSync(
+              path.join(testCase.devServerOptions.static, './foo.txt'),
+              'Text',
+            );
 
-						await page.waitForNavigation({
-							waitUntil: "networkidle0"
-						});
-					}
+            await page.waitForNavigation({
+              waitUntil: 'networkidle0',
+            });
+          }
 
-					expect(
-						consoleMessages.map(message => message.text().replace(/\\/g, "/"))
-					).toMatchSnapshot();
-				} finally {
-					await browser.close();
-					await server.stop();
-				}
-			});
-		}
-	}
+          expect(
+            consoleMessages.map((message) =>
+              message.text().replace(/\\/g, '/'),
+            ),
+          ).toMatchSnapshot();
+        } finally {
+          await browser.close();
+          await server.stop();
+        }
+      });
+    }
+  }
 });
diff --git a/tests/e2e/mime-types.test.js b/tests/e2e/mime-types.test.js
index f3462d3..134cf10 100644
--- a/tests/e2e/mime-types.test.js
+++ b/tests/e2e/mime-types.test.js
@@ -1,133 +1,133 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/mime-types-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["mime-types-option"];
-
-describe("mimeTypes option", () => {
-	describe("as an object with a remapped type", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					devMiddleware: {
-						mimeTypes: {
-							js: "text/plain"
-						}
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should request file with different js mime type", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("as an object with a custom type", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					devMiddleware: {
-						mimeTypes: {
-							custom: "text/html"
-						}
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should request file with different js mime type", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/file.custom`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response headers content-type"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/mime-types-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['mime-types-option'];
+
+describe('mimeTypes option', () => {
+  describe('as an object with a remapped type', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          devMiddleware: {
+            mimeTypes: {
+              js: 'text/plain',
+            },
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should request file with different js mime type', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('as an object with a custom type', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          devMiddleware: {
+            mimeTypes: {
+              custom: 'text/html',
+            },
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should request file with different js mime type', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/file.custom`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response headers content-type',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/module-federation.test.js b/tests/e2e/module-federation.test.js
index 15b973e..899c64a 100644
--- a/tests/e2e/module-federation.test.js
+++ b/tests/e2e/module-federation.test.js
@@ -1,298 +1,298 @@
-const requireFromString = require("require-from-string");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const simpleConfig = require("../fixtures/module-federation-config/webpack.config");
-const objectEntryConfig = require("../fixtures/module-federation-config/webpack.object-entry.config");
-const multiConfig = require("../fixtures/module-federation-config/webpack.multi.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["module-federation"];
-const pluginConfig = require("../fixtures/module-federation-config/webpack.plugin");
-
-describe("Module federation", () => {
-	describe("should work with simple multi-entry config", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
+const requireFromString = require('require-from-string');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const simpleConfig = require('../fixtures/module-federation-config/webpack.config');
+const objectEntryConfig = require('../fixtures/module-federation-config/webpack.object-entry.config');
+const multiConfig = require('../fixtures/module-federation-config/webpack.multi.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['module-federation'];
+const pluginConfig = require('../fixtures/module-federation-config/webpack.plugin');
+
+describe('Module federation', () => {
+  describe('should work with simple multi-entry config', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
 
-		beforeEach(async () => {
-			compiler = webpack(simpleConfig);
-			server = new Server({ port }, compiler);
+    beforeEach(async () => {
+      compiler = webpack(simpleConfig);
+      server = new Server({ port }, compiler);
 
-			await server.start();
-
-			({ page, browser } = await runBrowser());
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
 
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should use the last entry export", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should use the last entry export', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			const textContent = await response.text();
+      const textContent = await response.text();
 
-			expect(textContent).toContain("entry1");
+      expect(textContent).toContain('entry1');
 
-			let exports;
+      let exports;
 
-			expect(() => {
-				exports = requireFromString(textContent);
-			}).not.toThrow();
+      expect(() => {
+        exports = requireFromString(textContent);
+      }).not.toThrow();
 
-			expect(exports).toEqual("entry2");
+      expect(exports).toEqual('entry2');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("should work with object multi-entry config", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('should work with object multi-entry config', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
 
-		beforeEach(async () => {
-			compiler = webpack(objectEntryConfig);
-			server = new Server({ port }, compiler);
+    beforeEach(async () => {
+      compiler = webpack(objectEntryConfig);
+      server = new Server({ port }, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should use the last entry export", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should use the last entry export', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			const textContent = await response.text();
+      const textContent = await response.text();
 
-			expect(textContent).toContain("entry1");
+      expect(textContent).toContain('entry1');
 
-			let exports;
+      let exports;
 
-			expect(() => {
-				exports = requireFromString(textContent);
-			}).not.toThrow();
+      expect(() => {
+        exports = requireFromString(textContent);
+      }).not.toThrow();
 
-			expect(exports).toEqual("entry2");
+      expect(exports).toEqual('entry2');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should support the named entry export", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+    it('should support the named entry export', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port}/foo.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port}/foo.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			const textContent = await response.text();
+      const textContent = await response.text();
 
-			expect(textContent).not.toContain("entry2");
+      expect(textContent).not.toContain('entry2');
 
-			let exports;
+      let exports;
 
-			expect(() => {
-				exports = requireFromString(textContent);
-			}).not.toThrow();
+      expect(() => {
+        exports = requireFromString(textContent);
+      }).not.toThrow();
 
-			expect(exports).toEqual("entry1");
+      expect(exports).toEqual('entry1');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 
-	describe("should work with multi compiler config", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
+  describe('should work with multi compiler config', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
 
-		beforeEach(async () => {
-			compiler = webpack(multiConfig);
-			server = new Server({ port }, compiler);
+    beforeEach(async () => {
+      compiler = webpack(multiConfig);
+      server = new Server({ port }, compiler);
 
-			await server.start();
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			pageErrors = [];
-			consoleMessages = [];
-		});
+      pageErrors = [];
+      consoleMessages = [];
+    });
 
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
 
-		it("should use the last entry export", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+    it('should use the last entry export', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
 
-			const textContent = await response.text();
+      const textContent = await response.text();
 
-			expect(textContent).toContain("entry1");
+      expect(textContent).toContain('entry1');
 
-			let exports;
+      let exports;
 
-			expect(() => {
-				exports = requireFromString(textContent);
-			}).not.toThrow();
+      expect(() => {
+        exports = requireFromString(textContent);
+      }).not.toThrow();
 
-			expect(exports).toEqual("entry2");
+      expect(exports).toEqual('entry2');
 
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
 
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 
-	describe("should use plugin", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(pluginConfig);
-			server = new Server({ port }, compiler);
-
-			await server.start();
+  describe('should use plugin', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(pluginConfig);
+      server = new Server({ port }, compiler);
+
+      await server.start();
 
-			({ page, browser } = await runBrowser());
+      ({ page, browser } = await runBrowser());
 
-			pageErrors = [];
-			consoleMessages = [];
-		});
+      pageErrors = [];
+      consoleMessages = [];
+    });
 
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should contain hot script in remoteEntry.js", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}/remoteEntry.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const remoteEntryTextContent = await response.text();
-
-			expect(remoteEntryTextContent).toMatch(
-				/@rspack(-canary)?\/core\/hot\/dev-server\.js/
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should contain hot script in remoteEntry.js', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}/remoteEntry.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const remoteEntryTextContent = await response.text();
+
+      expect(remoteEntryTextContent).toMatch(
+        /@rspack(-canary)?\/core\/hot\/dev-server\.js/,
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
 
-		it("should contain hot script in main.js", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			const mainEntryTextContent = await response.text();
-
-			expect(mainEntryTextContent).toMatch(
-				/@rspack(-canary)?\/core\/hot\/dev-server\.js/
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+    it('should contain hot script in main.js', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const mainEntryTextContent = await response.text();
+
+      expect(mainEntryTextContent).toMatch(
+        /@rspack(-canary)?\/core\/hot\/dev-server\.js/,
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/multi-compiler.test.js b/tests/e2e/multi-compiler.test.js
index 5518b1a..9a1cd9e 100644
--- a/tests/e2e/multi-compiler.test.js
+++ b/tests/e2e/multi-compiler.test.js
@@ -1,754 +1,754 @@
-const path = require("node:path");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const oneWebTargetConfiguration = require("../fixtures/multi-compiler-one-configuration/webpack.config");
-const twoWebTargetConfiguration = require("../fixtures/multi-compiler-two-configurations/webpack.config");
-const universalConfiguration = require("../fixtures/universal-compiler-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["multi-compiler"];
-
-describe("multi compiler", () => {
-	it("should work with one web target configuration and do nothing", async () => {
-		const compiler = webpack(oneWebTargetConfiguration);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with web target configurations and do nothing", async () => {
-		const compiler = webpack(twoWebTargetConfiguration);
-		const devServerOptions = {
-			port
-		};
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work with web target configurations when hot and live reloads are enabled, and do hot reload by default when changing own entries", async () => {
-		const compiler = webpack(twoWebTargetConfiguration);
-		const devServerOptions = {
-			port,
-			hot: true,
-			liveReload: true
-		};
-		const pathToOneEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/one.js"
-		);
-		const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
-		const pathToTwoEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/two.js"
-		);
-		const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					let text = message.text();
-
-					if (/Error: Aborted because/.test(text)) {
-						const splittedText = text.split("\n");
-
-						text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
-					}
-
-					consoleMessages.push(text);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
-			fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
-		}
-	});
-
-	it("should work with web target configurations when only hot reload is enabled, and do hot reload when changing own entries", async () => {
-		const compiler = webpack(twoWebTargetConfiguration);
-		const devServerOptions = {
-			port,
-			hot: true,
-			liveReload: false
-		};
-		const pathToOneEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/one.js"
-		);
-		const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
-		const pathToTwoEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/two.js"
-		);
-		const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					let text = message.text();
+const path = require('node:path');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const oneWebTargetConfiguration = require('../fixtures/multi-compiler-one-configuration/webpack.config');
+const twoWebTargetConfiguration = require('../fixtures/multi-compiler-two-configurations/webpack.config');
+const universalConfiguration = require('../fixtures/universal-compiler-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['multi-compiler'];
+
+describe('multi compiler', () => {
+  it('should work with one web target configuration and do nothing', async () => {
+    const compiler = webpack(oneWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with web target configurations and do nothing', async () => {
+    const compiler = webpack(twoWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+    };
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work with web target configurations when hot and live reloads are enabled, and do hot reload by default when changing own entries', async () => {
+    const compiler = webpack(twoWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+      hot: true,
+      liveReload: true,
+    };
+    const pathToOneEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/one.js',
+    );
+    const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
+    const pathToTwoEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/two.js',
+    );
+    const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          let text = message.text();
+
+          if (/Error: Aborted because/.test(text)) {
+            const splittedText = text.split('\n');
+
+            text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
+          }
+
+          consoleMessages.push(text);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
+      fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
+    }
+  });
+
+  it('should work with web target configurations when only hot reload is enabled, and do hot reload when changing own entries', async () => {
+    const compiler = webpack(twoWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+      hot: true,
+      liveReload: false,
+    };
+    const pathToOneEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/one.js',
+    );
+    const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
+    const pathToTwoEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/two.js',
+    );
+    const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          let text = message.text();
 
-					if (/Error: Aborted because/.test(text)) {
-						const splittedText = text.split("\n");
+          if (/Error: Aborted because/.test(text)) {
+            const splittedText = text.split('\n');
 
-						text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
-					}
+            text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
+          }
 
-					consoleMessages.push(text);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+          consoleMessages.push(text);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
-				waitUntil: "networkidle0"
-			});
+      await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
+        waitUntil: 'networkidle0',
+      });
 
-			fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
+      fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
 
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
-			fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
-		}
-	});
-
-	it("should work with web target configurations when only live reload is enabled, and do live reload when changing own entries", async () => {
-		const compiler = webpack(twoWebTargetConfiguration);
-		const devServerOptions = {
-			port,
-			hot: false,
-			liveReload: true
-		};
-		const pathToOneEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/one.js"
-		);
-		const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
-		const pathToTwoEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/two.js"
-		);
-		const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
+      fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
+    }
+  });
+
+  it('should work with web target configurations when only live reload is enabled, and do live reload when changing own entries', async () => {
+    const compiler = webpack(twoWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+      hot: false,
+      liveReload: true,
+    };
+    const pathToOneEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/one.js',
+    );
+    const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
+    const pathToTwoEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/two.js',
+    );
+    const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
-				waitUntil: "networkidle0"
-			});
+      await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
+        waitUntil: 'networkidle0',
+      });
 
-			fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
+      fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
 
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
 
-			pageErrors = [];
-			consoleMessages = [];
+      pageErrors = [];
+      consoleMessages = [];
 
-			await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
-			fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
-		}
-	});
-
-	it("should work with web target configurations when only live reload is enabled and do live reload when changing other entries", async () => {
-		const compiler = webpack(twoWebTargetConfiguration);
-		const devServerOptions = {
-			port,
-			hot: false,
-			liveReload: true
-		};
-		const pathToOneEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/one.js"
-		);
-		const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
-		const pathToTwoEntry = path.resolve(
-			__dirname,
-			"../fixtures/multi-compiler-two-configurations/two.js"
-		);
-		const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
-			fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
-		}
-	});
-
-	it("should work with universal configuration and do nothing", async () => {
-		const compiler = webpack(universalConfiguration);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		const pageErrors = [];
-		const consoleMessages = [];
-		try {
-			const serverResponse = await page.goto(
-				`http://127.0.0.1:${port}/server.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const serverResponseText = await serverResponse.text();
-
-			expect(serverResponseText).toContain("Hello from the server");
-			expect(serverResponseText).not.toContain("WebsocketServer");
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-
-		expect(consoleMessages).toMatchSnapshot("console messages");
-		expect(pageErrors).toMatchSnapshot("page errors");
-	});
-
-	it("should work with universal configuration when hot and live reloads are enabled, and do hot reload for browser compiler by default when browser entry changed", async () => {
-		const compiler = webpack(universalConfiguration);
-		const devServerOptions = {
-			port,
-			hot: true,
-			liveReload: true
-		};
-		const pathToBrowserEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/browser.js"
-		);
-		const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
-		const pathToServerEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/server.js"
-		);
-		const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const serverResponse = await page.goto(
-				`http://127.0.0.1:${port}/server.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const serverResponseText = await serverResponse.text();
-
-			expect(serverResponseText).toContain("Hello from the server");
-			expect(serverResponseText).not.toContain("WebsocketServer");
-
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					let text = message.text();
-
-					if (/Error: Aborted because/.test(text)) {
-						const splittedText = text.split("\n");
-
-						text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
-					}
-
-					consoleMessages.push(text);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToBrowserEntry,
-				`${originalBrowserEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
-			fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
-		}
-	});
-
-	it("should work with universal configuration when only hot reload is enabled, and do hot reload for browser compiler when browser entry changed", async () => {
-		const compiler = webpack(universalConfiguration);
-		const devServerOptions = {
-			port,
-			hot: true,
-			liveReload: false
-		};
-		const pathToBrowserEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/browser.js"
-		);
-		const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const serverResponse = await page.goto(
-				`http://127.0.0.1:${port}/server.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const serverResponseText = await serverResponse.text();
-
-			expect(serverResponseText).toContain("Hello from the server");
-			expect(serverResponseText).not.toContain("WebsocketServer");
-
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					let text = message.text();
-
-					if (/Error: Aborted because/.test(text)) {
-						const splittedText = text.split("\n");
-
-						text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
-					}
-
-					consoleMessages.push(text);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToBrowserEntry,
-				`${originalBrowserEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
-		}
-	});
-
-	it("should work with universal configuration when only live reload is enabled, and do live reload for browser compiler when changing browser and server entries", async () => {
-		const compiler = webpack(universalConfiguration);
-		const devServerOptions = {
-			port,
-			hot: false,
-			liveReload: true
-		};
-		const pathToBrowserEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/browser.js"
-		);
-		const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
-		const pathToServerEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/server.js"
-		);
-		const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const serverResponse = await page.goto(
-				`http://127.0.0.1:${port}/server.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const serverResponseText = await serverResponse.text();
-
-			expect(serverResponseText).toContain("Hello from the server");
-			expect(serverResponseText).not.toContain("WebsocketServer");
-
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToBrowserEntry,
-				`${originalBrowserEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToServerEntry,
-				`${originalServerEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
-			fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
-		}
-	});
-
-	it("should work with universal configuration when only live reload is enabled, and do live reload for browser compiler when changing server and browser entries", async () => {
-		const compiler = webpack(universalConfiguration);
-		const devServerOptions = {
-			port,
-			hot: false,
-			liveReload: true
-		};
-		const pathToBrowserEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/browser.js"
-		);
-		const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
-		const pathToServerEntry = path.resolve(
-			__dirname,
-			"../fixtures/universal-compiler-config/server.js"
-		);
-		const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
-
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const serverResponse = await page.goto(
-				`http://127.0.0.1:${port}/server.js`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			const serverResponseText = await serverResponse.text();
-
-			expect(serverResponseText).toContain("Hello from the server");
-			expect(serverResponseText).not.toContain("WebsocketServer");
-
-			let pageErrors = [];
-			let consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message.text());
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToServerEntry,
-				`${originalServerEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			pageErrors = [];
-			consoleMessages = [];
-
-			await page.goto(`http://127.0.0.1:${port}/browser.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			fs.writeFileSync(
-				pathToBrowserEntry,
-				`${originalBrowserEntryContent}// comment`
-			);
-
-			await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-			expect(consoleMessages).toMatchSnapshot("console messages");
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-
-			fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
-			fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
-		}
-	});
+      await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
+      fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
+    }
+  });
+
+  it('should work with web target configurations when only live reload is enabled and do live reload when changing other entries', async () => {
+    const compiler = webpack(twoWebTargetConfiguration);
+    const devServerOptions = {
+      port,
+      hot: false,
+      liveReload: true,
+    };
+    const pathToOneEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/one.js',
+    );
+    const originalOneEntryContent = fs.readFileSync(pathToOneEntry);
+    const pathToTwoEntry = path.resolve(
+      __dirname,
+      '../fixtures/multi-compiler-two-configurations/two.js',
+    );
+    const originalTwoEntryContent = fs.readFileSync(pathToTwoEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/one-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToTwoEntry, `${originalTwoEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/two-main.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(pathToOneEntry, `${originalOneEntryContent}// comment`);
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToOneEntry, originalOneEntryContent);
+      fs.writeFileSync(pathToTwoEntry, originalTwoEntryContent);
+    }
+  });
+
+  it('should work with universal configuration and do nothing', async () => {
+    const compiler = webpack(universalConfiguration);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    const pageErrors = [];
+    const consoleMessages = [];
+    try {
+      const serverResponse = await page.goto(
+        `http://127.0.0.1:${port}/server.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const serverResponseText = await serverResponse.text();
+
+      expect(serverResponseText).toContain('Hello from the server');
+      expect(serverResponseText).not.toContain('WebsocketServer');
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+
+    expect(consoleMessages).toMatchSnapshot('console messages');
+    expect(pageErrors).toMatchSnapshot('page errors');
+  });
+
+  it('should work with universal configuration when hot and live reloads are enabled, and do hot reload for browser compiler by default when browser entry changed', async () => {
+    const compiler = webpack(universalConfiguration);
+    const devServerOptions = {
+      port,
+      hot: true,
+      liveReload: true,
+    };
+    const pathToBrowserEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/browser.js',
+    );
+    const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
+    const pathToServerEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/server.js',
+    );
+    const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const serverResponse = await page.goto(
+        `http://127.0.0.1:${port}/server.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const serverResponseText = await serverResponse.text();
+
+      expect(serverResponseText).toContain('Hello from the server');
+      expect(serverResponseText).not.toContain('WebsocketServer');
+
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          let text = message.text();
+
+          if (/Error: Aborted because/.test(text)) {
+            const splittedText = text.split('\n');
+
+            text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
+          }
+
+          consoleMessages.push(text);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToBrowserEntry,
+        `${originalBrowserEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
+      fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
+    }
+  });
+
+  it('should work with universal configuration when only hot reload is enabled, and do hot reload for browser compiler when browser entry changed', async () => {
+    const compiler = webpack(universalConfiguration);
+    const devServerOptions = {
+      port,
+      hot: true,
+      liveReload: false,
+    };
+    const pathToBrowserEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/browser.js',
+    );
+    const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const serverResponse = await page.goto(
+        `http://127.0.0.1:${port}/server.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const serverResponseText = await serverResponse.text();
+
+      expect(serverResponseText).toContain('Hello from the server');
+      expect(serverResponseText).not.toContain('WebsocketServer');
+
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          let text = message.text();
+
+          if (/Error: Aborted because/.test(text)) {
+            const splittedText = text.split('\n');
+
+            text = `${splittedText[0]}\n${splittedText[1]}\n    <stack>`;
+          }
+
+          consoleMessages.push(text);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToBrowserEntry,
+        `${originalBrowserEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
+    }
+  });
+
+  it('should work with universal configuration when only live reload is enabled, and do live reload for browser compiler when changing browser and server entries', async () => {
+    const compiler = webpack(universalConfiguration);
+    const devServerOptions = {
+      port,
+      hot: false,
+      liveReload: true,
+    };
+    const pathToBrowserEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/browser.js',
+    );
+    const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
+    const pathToServerEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/server.js',
+    );
+    const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const serverResponse = await page.goto(
+        `http://127.0.0.1:${port}/server.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const serverResponseText = await serverResponse.text();
+
+      expect(serverResponseText).toContain('Hello from the server');
+      expect(serverResponseText).not.toContain('WebsocketServer');
+
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToBrowserEntry,
+        `${originalBrowserEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToServerEntry,
+        `${originalServerEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
+      fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
+    }
+  });
+
+  it('should work with universal configuration when only live reload is enabled, and do live reload for browser compiler when changing server and browser entries', async () => {
+    const compiler = webpack(universalConfiguration);
+    const devServerOptions = {
+      port,
+      hot: false,
+      liveReload: true,
+    };
+    const pathToBrowserEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/browser.js',
+    );
+    const originalBrowserEntryContent = fs.readFileSync(pathToBrowserEntry);
+    const pathToServerEntry = path.resolve(
+      __dirname,
+      '../fixtures/universal-compiler-config/server.js',
+    );
+    const originalServerEntryContent = fs.readFileSync(pathToServerEntry);
+
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const serverResponse = await page.goto(
+        `http://127.0.0.1:${port}/server.js`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      const serverResponseText = await serverResponse.text();
+
+      expect(serverResponseText).toContain('Hello from the server');
+      expect(serverResponseText).not.toContain('WebsocketServer');
+
+      let pageErrors = [];
+      let consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message.text());
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToServerEntry,
+        `${originalServerEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      pageErrors = [];
+      consoleMessages = [];
+
+      await page.goto(`http://127.0.0.1:${port}/browser.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      fs.writeFileSync(
+        pathToBrowserEntry,
+        `${originalBrowserEntryContent}// comment`,
+      );
+
+      await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+      expect(consoleMessages).toMatchSnapshot('console messages');
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+
+      fs.writeFileSync(pathToBrowserEntry, originalBrowserEntryContent);
+      fs.writeFileSync(pathToServerEntry, originalServerEntryContent);
+    }
+  });
 });
diff --git a/tests/e2e/on-listening.test.js b/tests/e2e/on-listening.test.js
index ba21725..89e0e10 100644
--- a/tests/e2e/on-listening.test.js
+++ b/tests/e2e/on-listening.test.js
@@ -1,125 +1,125 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["on-listening-option"];
-
-describe("onListening option", () => {
-	let compiler;
-	let server;
-	let page;
-	let browser;
-	let pageErrors;
-	let consoleMessages;
-	let onListeningIsRunning = false;
-
-	beforeEach(async () => {
-		compiler = webpack(config);
-		server = new Server(
-			{
-				onListening: devServer => {
-					if (!devServer) {
-						throw new Error("webpack-dev-server is not defined");
-					}
-
-					onListeningIsRunning = true;
-
-					devServer.app.get("/listening/some/path", (_, response) => {
-						response.send("listening");
-					});
-
-					devServer.app.post("/listening/some/path", (_, response) => {
-						response.send("listening POST");
-					});
-				},
-				port
-			},
-			compiler
-		);
-
-		await server.start();
-
-		({ page, browser } = await runBrowser());
-
-		pageErrors = [];
-		consoleMessages = [];
-	});
-
-	afterEach(async () => {
-		await browser.close();
-		await server.stop();
-	});
-
-	it("should handle GET request to /listening/some/path route", async () => {
-		page
-			.on("console", message => {
-				consoleMessages.push(message);
-			})
-			.on("pageerror", error => {
-				pageErrors.push(error);
-			});
-
-		const response = await page.goto(
-			`http://127.0.0.1:${port}/listening/some/path`,
-			{
-				waitUntil: "networkidle0"
-			}
-		);
-
-		expect(onListeningIsRunning).toBe(true);
-
-		expect(response.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-
-		expect(response.status()).toMatchSnapshot("response status");
-
-		expect(await response.text()).toMatchSnapshot("response text");
-
-		expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-			"console messages"
-		);
-
-		expect(pageErrors).toMatchSnapshot("page errors");
-	});
-
-	it("should handle POST request to /listening/some/path route", async () => {
-		await page.setRequestInterception(true);
-
-		page
-			.on("console", message => {
-				consoleMessages.push(message);
-			})
-			.on("pageerror", error => {
-				pageErrors.push(error);
-			})
-			.on("request", interceptedRequest => {
-				if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-				interceptedRequest.continue({ method: "POST" });
-			});
-
-		const response = await page.goto(
-			`http://127.0.0.1:${port}/listening/some/path`,
-			{
-				waitUntil: "networkidle0"
-			}
-		);
-
-		expect(onListeningIsRunning).toBe(true);
-
-		expect(response.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-
-		expect(response.status()).toMatchSnapshot("response status");
-
-		expect(await response.text()).toMatchSnapshot("response text");
-
-		expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-			"console messages"
-		);
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['on-listening-option'];
+
+describe('onListening option', () => {
+  let compiler;
+  let server;
+  let page;
+  let browser;
+  let pageErrors;
+  let consoleMessages;
+  let onListeningIsRunning = false;
+
+  beforeEach(async () => {
+    compiler = webpack(config);
+    server = new Server(
+      {
+        onListening: (devServer) => {
+          if (!devServer) {
+            throw new Error('webpack-dev-server is not defined');
+          }
+
+          onListeningIsRunning = true;
+
+          devServer.app.get('/listening/some/path', (_, response) => {
+            response.send('listening');
+          });
+
+          devServer.app.post('/listening/some/path', (_, response) => {
+            response.send('listening POST');
+          });
+        },
+        port,
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    ({ page, browser } = await runBrowser());
+
+    pageErrors = [];
+    consoleMessages = [];
+  });
+
+  afterEach(async () => {
+    await browser.close();
+    await server.stop();
+  });
+
+  it('should handle GET request to /listening/some/path route', async () => {
+    page
+      .on('console', (message) => {
+        consoleMessages.push(message);
+      })
+      .on('pageerror', (error) => {
+        pageErrors.push(error);
+      });
+
+    const response = await page.goto(
+      `http://127.0.0.1:${port}/listening/some/path`,
+      {
+        waitUntil: 'networkidle0',
+      },
+    );
+
+    expect(onListeningIsRunning).toBe(true);
+
+    expect(response.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+
+    expect(response.status()).toMatchSnapshot('response status');
+
+    expect(await response.text()).toMatchSnapshot('response text');
+
+    expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+      'console messages',
+    );
+
+    expect(pageErrors).toMatchSnapshot('page errors');
+  });
+
+  it('should handle POST request to /listening/some/path route', async () => {
+    await page.setRequestInterception(true);
+
+    page
+      .on('console', (message) => {
+        consoleMessages.push(message);
+      })
+      .on('pageerror', (error) => {
+        pageErrors.push(error);
+      })
+      .on('request', (interceptedRequest) => {
+        if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+        interceptedRequest.continue({ method: 'POST' });
+      });
+
+    const response = await page.goto(
+      `http://127.0.0.1:${port}/listening/some/path`,
+      {
+        waitUntil: 'networkidle0',
+      },
+    );
+
+    expect(onListeningIsRunning).toBe(true);
+
+    expect(response.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+
+    expect(response.status()).toMatchSnapshot('response status');
+
+    expect(await response.text()).toMatchSnapshot('response text');
+
+    expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+      'console messages',
+    );
 
-		expect(pageErrors).toMatchSnapshot("page errors");
-	});
+    expect(pageErrors).toMatchSnapshot('page errors');
+  });
 });
diff --git a/tests/e2e/overlay.test.js b/tests/e2e/overlay.test.js
index 68e3554..5e2a9cc 100644
--- a/tests/e2e/overlay.test.js
+++ b/tests/e2e/overlay.test.js
@@ -1,1921 +1,1924 @@
-const path = require("node:path");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const waitForExpect = require("wait-for-expect");
-const config = require("../fixtures/overlay-config/webpack.config");
-const trustedTypesConfig = require("../fixtures/overlay-config/trusted-types.webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").overlay;
-require("../helpers/normalize");
+const path = require('node:path');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const waitForExpect = require('wait-for-expect');
+const config = require('../fixtures/overlay-config/webpack.config');
+const trustedTypesConfig = require('../fixtures/overlay-config/trusted-types.webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').overlay;
+require('../helpers/normalize');
 
 class ErrorPlugin {
-	constructor(message, skipCounter) {
-		this.message =
-			message || "Error from compilation. Can't find 'test' module.";
-		this.skipCounter = skipCounter;
-		this.counter = 0;
-	}
-
-	apply(compiler) {
-		compiler.hooks.thisCompilation.tap("errors-webpack-plugin", compilation => {
-			if (
-				typeof this.skipCounter !== "undefined" &&
-				this.counter !== this.skipCounter
-			) {
-				this.counter += 1;
-
-				return;
-			}
-
-			compilation.errors.push(new Error(this.message));
-		});
-	}
+  constructor(message, skipCounter) {
+    this.message =
+      message || "Error from compilation. Can't find 'test' module.";
+    this.skipCounter = skipCounter;
+    this.counter = 0;
+  }
+
+  apply(compiler) {
+    compiler.hooks.thisCompilation.tap(
+      'errors-webpack-plugin',
+      (compilation) => {
+        if (
+          typeof this.skipCounter !== 'undefined' &&
+          this.counter !== this.skipCounter
+        ) {
+          this.counter += 1;
+
+          return;
+        }
+
+        compilation.errors.push(new Error(this.message));
+      },
+    );
+  }
 }
 
 class WarningPlugin {
-	constructor(message, skipCounter) {
-		this.message = message || "Warning from compilation";
-		this.skipCounter = skipCounter;
-		this.counter = 0;
-	}
-
-	apply(compiler) {
-		compiler.hooks.thisCompilation.tap(
-			"warnings-webpack-plugin",
-			compilation => {
-				if (
-					typeof this.skipCounter !== "undefined" &&
-					this.counter !== this.skipCounter
-				) {
-					this.counter += 1;
-
-					return;
-				}
-
-				compilation.warnings.push(new Error(this.message));
-			}
-		);
-	}
+  constructor(message, skipCounter) {
+    this.message = message || 'Warning from compilation';
+    this.skipCounter = skipCounter;
+    this.counter = 0;
+  }
+
+  apply(compiler) {
+    compiler.hooks.thisCompilation.tap(
+      'warnings-webpack-plugin',
+      (compilation) => {
+        if (
+          typeof this.skipCounter !== 'undefined' &&
+          this.counter !== this.skipCounter
+        ) {
+          this.counter += 1;
+
+          return;
+        }
+
+        compilation.warnings.push(new Error(this.message));
+      },
+    );
+  }
 }
 
-const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
+const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 
 let prettier;
 let prettierHTML;
 let prettierCSS;
 
-describe("overlay", () => {
-	beforeAll(async () => {
-		// Due problems with ESM modules for Node.js@18
-		// TODO replace it on import/require when Node.js@18 will be dropped
-		prettier = require("../../node_modules/prettier/standalone");
-		prettierHTML = require("../../node_modules/prettier/plugins/html");
-		prettierCSS = require("../../node_modules/prettier/plugins/postcss");
-	});
-
-	it("should show a warning for initial compilation", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show an error for initial compilation", async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show a warning and error for initial compilation", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-		new WarningPlugin().apply(compiler);
-		new ErrorPlugin().apply(compiler);
-		new ErrorPlugin().apply(compiler);
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show an ansi formatted error for initial compilation", async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin(
-			"  18 |           Render ansi formatted text"
-		).apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show a warning and error for initial compilation and protects against xss", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin("<strong>strong</strong>").apply(compiler);
-		new ErrorPlugin("<strong>strong</strong>").apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show initially, then show on an error, then hide on fix", async () => {
-		const compiler = webpack(config);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			let pageHtml = await page.evaluate(() => document.body.outerHTML);
-			let overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html initial");
-
-			const pathToFile = path.resolve(
-				__dirname,
-				"../fixtures/overlay-config/foo.js"
-			);
-			const originalCode = fs.readFileSync(pathToFile);
-
-			fs.writeFileSync(pathToFile, "`;");
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html with error");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-
-			fs.writeFileSync(pathToFile, originalCode);
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay", {
-				hidden: true
-			});
-
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html after fix error");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show initially, then show on an error, then show other error, then hide on fix", async () => {
-		const compiler = webpack(config);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			let pageHtml = await page.evaluate(() => document.body.outerHTML);
-			let overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html initial");
-
-			const pathToFile = path.resolve(
-				__dirname,
-				"../fixtures/overlay-config/foo.js"
-			);
-			const originalCode = fs.readFileSync(pathToFile);
-
-			fs.writeFileSync(pathToFile, "`;");
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-
-			let overlayFrame = await overlayHandle.contentFrame();
-			let overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html with error");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-
-			fs.writeFileSync(pathToFile, "`;a");
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay", {
-				hidden: true
-			});
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-
-			overlayFrame = await overlayHandle.contentFrame();
-			overlayHtml = await overlayFrame.evaluate(() => document.body.outerHTML);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html with other error");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-
-			fs.writeFileSync(pathToFile, originalCode);
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay", {
-				hidden: true
-			});
-
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html after fix error");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show initially, then show on an error and allow to close", async () => {
-		const compiler = webpack(config);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			let pageHtml = await page.evaluate(() => document.body.outerHTML);
-			let overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html initial");
-
-			const pathToFile = path.resolve(
-				__dirname,
-				"../fixtures/overlay-config/foo.js"
-			);
-			const originalCode = fs.readFileSync(pathToFile);
-
-			fs.writeFileSync(pathToFile, "`;");
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html with error");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-
-			const frame = await page
-				.frames()
-				.find(item => item.name() === "webpack-dev-server-client-overlay");
-
-			const buttonHandle = await frame.$("button");
-
-			await buttonHandle.click();
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay", {
-				hidden: true
-			});
-
-			pageHtml = await page.evaluate(() => document.body.outerHTML);
-			overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html after close");
-
-			fs.writeFileSync(pathToFile, originalCode);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should open editor when error with file info is clicked", async () => {
-		const mockLaunchEditorCb = jest.fn();
-		jest.mock("launch-editor", () => mockLaunchEditorCb);
-
-		const compiler = webpack(config);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const pathToFile = path.resolve(
-				__dirname,
-				"../fixtures/overlay-config/foo.js"
-			);
-			const originalCode = fs.readFileSync(pathToFile);
-
-			fs.writeFileSync(pathToFile, "`;");
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			const frame = page
-				.frames()
-				.find(item => item.name() === "webpack-dev-server-client-overlay");
-
-			const errorHandle = await frame.$("[data-can-open]");
-
-			await errorHandle.click();
-
-			await waitForExpect(() => {
-				expect(mockLaunchEditorCb).toHaveBeenCalledTimes(1);
-			});
-
-			fs.writeFileSync(pathToFile, originalCode);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should not show a warning when "client.overlay" is "false"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: false
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should not show a warning when "client.overlay.warnings" is "false"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					warnings: false
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show warning when it is filtered", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin("My special warning").apply(compiler);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						warnings: error => {
-							// error is string in webpack 4
-							const message = typeof error === "string" ? error : error.message;
-							return !message.includes("My special warning");
-						}
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show warning when it is not filtered", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin("Unfiltered warning").apply(compiler);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						warnings: () => true
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show a warning when "client.overlay" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: true
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show a warning when "client.overlay.warnings" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					warnings: true
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show a warning when "client.overlay.errors" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					errors: true
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should not show an error when "client.overlay" is "false"', async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: false
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should not show an error when "client.overlay.errors" is "false"', async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					errors: false
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show error when it is filtered", async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin("My special error").apply(compiler);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						errors: error => {
-							// error is string in webpack 4
-							const message = typeof error === "string" ? error : error.message;
-
-							return !message.includes("My special error");
-						}
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show error when it is not filtered", async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin("Unfiltered error").apply(compiler);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						errors: () => true
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show an error when "client.overlay" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: true
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show overlay when Trusted Types are enabled", async () => {
-		const compiler = webpack(trustedTypesConfig);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					trustedTypesPolicyName: "webpack#dev-overlay"
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message.text());
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				consoleMessages.filter(item =>
-					/requires 'TrustedHTML' assignment/.test(item)
-				)
-			).toHaveLength(0);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show overlay when Trusted Types are enabled and the \"require-trusted-types-for 'script'\" header was used", async () => {
-		const compiler = webpack(trustedTypesConfig);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			headers: [
-				{
-					key: "Content-Security-Policy",
-					value: "require-trusted-types-for 'script'"
-				}
-			],
-			client: {
-				overlay: {
-					trustedTypesPolicyName: "webpack#dev-overlay"
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message.text());
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(
-				consoleMessages.filter(item =>
-					/requires 'TrustedHTML' assignment/.test(item)
-				)
-			).toHaveLength(0);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show overlay when Trusted Types are enabled, but policy is not allowed", async () => {
-		const compiler = webpack(trustedTypesConfig);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					trustedTypesPolicyName: "disallowed-policy"
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			expect(overlayHandle).toBe(null);
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show an error when "client.overlay.errors" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					errors: true
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show an error when "client.overlay.warnings" is "true"', async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			client: {
-				overlay: {
-					warnings: true
-				}
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show a warning and hide them after closing connection", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin().apply(compiler);
-
-		const devServerOptions = { port };
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message.text());
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-
-			await server.stop();
-
-			await new Promise(resolve => {
-				const interval = setInterval(() => {
-					if (consoleMessages.includes("[webpack-dev-server] Disconnected!")) {
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 100);
-			});
-
-			const pageHtmlAfterClose = await page.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtmlAfterClose, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-		} finally {
-			await browser.close();
-		}
-	});
-
-	it("should show an error after invalidation", async () => {
-		const compiler = webpack(config);
-
-		new ErrorPlugin("Error from compilation", 1).apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			await new Promise(resolve => {
-				server.middleware.invalidate(() => {
-					resolve();
-				});
-			});
-
-			await new Promise(resolve => {
-				server.middleware.waitUntilValid(() => {
-					resolve();
-				});
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show a warning after invalidation", async () => {
-		const compiler = webpack(config);
-
-		new WarningPlugin("Warning from compilation", 1).apply(compiler);
-
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			await new Promise(resolve => {
-				server.middleware.invalidate(() => {
-					resolve();
-				});
-			});
-
-			await new Promise(resolve => {
-				server.middleware.waitUntilValid(() => {
-					resolve();
-				});
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			await page.waitForSelector("#webpack-dev-server-client-overlay");
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should show error for uncaught runtime error", async () => {
-		const compiler = webpack(config);
-
-		const server = new Server(
-			{
-				port
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			await page.addScriptTag({
-				content: `(function throwError() {
+describe('overlay', () => {
+  beforeAll(async () => {
+    // Due problems with ESM modules for Node.js@18
+    // TODO replace it on import/require when Node.js@18 will be dropped
+    prettier = require('../../node_modules/prettier/standalone');
+    prettierHTML = require('../../node_modules/prettier/plugins/html');
+    prettierCSS = require('../../node_modules/prettier/plugins/postcss');
+  });
+
+  it('should show a warning for initial compilation', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show an error for initial compilation', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning and error for initial compilation', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+    new WarningPlugin().apply(compiler);
+    new ErrorPlugin().apply(compiler);
+    new ErrorPlugin().apply(compiler);
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show an ansi formatted error for initial compilation', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin(
+      '  18 |           Render ansi formatted text',
+    ).apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning and error for initial compilation and protects against xss', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin('<strong>strong</strong>').apply(compiler);
+    new ErrorPlugin('<strong>strong</strong>').apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show initially, then show on an error, then hide on fix', async () => {
+    const compiler = webpack(config);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      let pageHtml = await page.evaluate(() => document.body.outerHTML);
+      let overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html initial');
+
+      const pathToFile = path.resolve(
+        __dirname,
+        '../fixtures/overlay-config/foo.js',
+      );
+      const originalCode = fs.readFileSync(pathToFile);
+
+      fs.writeFileSync(pathToFile, '`;');
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html with error');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+
+      fs.writeFileSync(pathToFile, originalCode);
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay', {
+        hidden: true,
+      });
+
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html after fix error');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show initially, then show on an error, then show other error, then hide on fix', async () => {
+    const compiler = webpack(config);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      let pageHtml = await page.evaluate(() => document.body.outerHTML);
+      let overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html initial');
+
+      const pathToFile = path.resolve(
+        __dirname,
+        '../fixtures/overlay-config/foo.js',
+      );
+      const originalCode = fs.readFileSync(pathToFile);
+
+      fs.writeFileSync(pathToFile, '`;');
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+
+      let overlayFrame = await overlayHandle.contentFrame();
+      let overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html with error');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+
+      fs.writeFileSync(pathToFile, '`;a');
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay', {
+        hidden: true,
+      });
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+
+      overlayFrame = await overlayHandle.contentFrame();
+      overlayHtml = await overlayFrame.evaluate(() => document.body.outerHTML);
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html with other error');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+
+      fs.writeFileSync(pathToFile, originalCode);
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay', {
+        hidden: true,
+      });
+
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html after fix error');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show initially, then show on an error and allow to close', async () => {
+    const compiler = webpack(config);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      let pageHtml = await page.evaluate(() => document.body.outerHTML);
+      let overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html initial');
+
+      const pathToFile = path.resolve(
+        __dirname,
+        '../fixtures/overlay-config/foo.js',
+      );
+      const originalCode = fs.readFileSync(pathToFile);
+
+      fs.writeFileSync(pathToFile, '`;');
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html with error');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+
+      const frame = await page
+        .frames()
+        .find((item) => item.name() === 'webpack-dev-server-client-overlay');
+
+      const buttonHandle = await frame.$('button');
+
+      await buttonHandle.click();
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay', {
+        hidden: true,
+      });
+
+      pageHtml = await page.evaluate(() => document.body.outerHTML);
+      overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html after close');
+
+      fs.writeFileSync(pathToFile, originalCode);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should open editor when error with file info is clicked', async () => {
+    const mockLaunchEditorCb = jest.fn();
+    jest.mock('launch-editor', () => mockLaunchEditorCb);
+
+    const compiler = webpack(config);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const pathToFile = path.resolve(
+        __dirname,
+        '../fixtures/overlay-config/foo.js',
+      );
+      const originalCode = fs.readFileSync(pathToFile);
+
+      fs.writeFileSync(pathToFile, '`;');
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      const frame = page
+        .frames()
+        .find((item) => item.name() === 'webpack-dev-server-client-overlay');
+
+      const errorHandle = await frame.$('[data-can-open]');
+
+      await errorHandle.click();
+
+      await waitForExpect(() => {
+        expect(mockLaunchEditorCb).toHaveBeenCalledTimes(1);
+      });
+
+      fs.writeFileSync(pathToFile, originalCode);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show a warning when "client.overlay" is "false"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: false,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show a warning when "client.overlay.warnings" is "false"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          warnings: false,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show warning when it is filtered', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin('My special warning').apply(compiler);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            warnings: (error) => {
+              // error is string in webpack 4
+              const message = typeof error === 'string' ? error : error.message;
+              return !message.includes('My special warning');
+            },
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show warning when it is not filtered', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin('Unfiltered warning').apply(compiler);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            warnings: () => true,
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning when "client.overlay" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: true,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning when "client.overlay.warnings" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          warnings: true,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning when "client.overlay.errors" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          errors: true,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show an error when "client.overlay" is "false"', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: false,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show an error when "client.overlay.errors" is "false"', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          errors: false,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show error when it is filtered', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin('My special error').apply(compiler);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            errors: (error) => {
+              // error is string in webpack 4
+              const message = typeof error === 'string' ? error : error.message;
+
+              return !message.includes('My special error');
+            },
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show error when it is not filtered', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin('Unfiltered error').apply(compiler);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            errors: () => true,
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show an error when "client.overlay" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: true,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show overlay when Trusted Types are enabled', async () => {
+    const compiler = webpack(trustedTypesConfig);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          trustedTypesPolicyName: 'webpack#dev-overlay',
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message.text());
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        consoleMessages.filter((item) =>
+          /requires 'TrustedHTML' assignment/.test(item),
+        ),
+      ).toHaveLength(0);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show overlay when Trusted Types are enabled and the "require-trusted-types-for \'script\'" header was used', async () => {
+    const compiler = webpack(trustedTypesConfig);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      headers: [
+        {
+          key: 'Content-Security-Policy',
+          value: "require-trusted-types-for 'script'",
+        },
+      ],
+      client: {
+        overlay: {
+          trustedTypesPolicyName: 'webpack#dev-overlay',
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message.text());
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(
+        consoleMessages.filter((item) =>
+          /requires 'TrustedHTML' assignment/.test(item),
+        ),
+      ).toHaveLength(0);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show overlay when Trusted Types are enabled, but policy is not allowed', async () => {
+    const compiler = webpack(trustedTypesConfig);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          trustedTypesPolicyName: 'disallowed-policy',
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      expect(overlayHandle).toBe(null);
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show an error when "client.overlay.errors" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          errors: true,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show an error when "client.overlay.warnings" is "true"', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      client: {
+        overlay: {
+          warnings: true,
+        },
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning and hide them after closing connection', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin().apply(compiler);
+
+    const devServerOptions = { port };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message.text());
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+
+      await server.stop();
+
+      await new Promise((resolve) => {
+        const interval = setInterval(() => {
+          if (consoleMessages.includes('[webpack-dev-server] Disconnected!')) {
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 100);
+      });
+
+      const pageHtmlAfterClose = await page.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtmlAfterClose, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+    } finally {
+      await browser.close();
+    }
+  });
+
+  it('should show an error after invalidation', async () => {
+    const compiler = webpack(config);
+
+    new ErrorPlugin('Error from compilation', 1).apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      await new Promise((resolve) => {
+        server.middleware.invalidate(() => {
+          resolve();
+        });
+      });
+
+      await new Promise((resolve) => {
+        server.middleware.waitUntilValid(() => {
+          resolve();
+        });
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show a warning after invalidation', async () => {
+    const compiler = webpack(config);
+
+    new WarningPlugin('Warning from compilation', 1).apply(compiler);
+
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      await new Promise((resolve) => {
+        server.middleware.invalidate(() => {
+          resolve();
+        });
+      });
+
+      await new Promise((resolve) => {
+        server.middleware.waitUntilValid(() => {
+          resolve();
+        });
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      await page.waitForSelector('#webpack-dev-server-client-overlay');
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show error for uncaught runtime error', async () => {
+    const compiler = webpack(config);
+
+    const server = new Server(
+      {
+        port,
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      await page.addScriptTag({
+        content: `(function throwError() {
         throw new Error('Injected error');
-      })();`
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show filtered runtime error", async () => {
-		const compiler = webpack(config);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						runtimeErrors: error => error && !/Injected/.test(error.message)
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			await page.addScriptTag({
-				content: `(function throwError() {
+      })();`,
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show filtered runtime error', async () => {
+    const compiler = webpack(config);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            runtimeErrors: (error) => error && !/Injected/.test(error.message),
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      await page.addScriptTag({
+        content: `(function throwError() {
         throw new Error('Injected error');
-      })();`
-			});
+      })();`,
+      });
 
-			// Delay for the overlay to appear
-			await delay(1000);
+      // Delay for the overlay to appear
+      await delay(1000);
 
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
 
-			expect(overlayHandle).toBe(null);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+      expect(overlayHandle).toBe(null);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 
-	it("should show error for uncaught promise rejection", async () => {
-		const compiler = webpack(config);
+  it('should show error for uncaught promise rejection', async () => {
+    const compiler = webpack(config);
 
-		const server = new Server(
-			{
-				port
-			},
-			compiler
-		);
+    const server = new Server(
+      {
+        port,
+      },
+      compiler,
+    );
 
-		await server.start();
+    await server.start();
 
-		const { page, browser } = await runBrowser();
+    const { page, browser } = await runBrowser();
 
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			await page.addScriptTag({
-				content: `(function throwError() {
+      await page.addScriptTag({
+        content: `(function throwError() {
         setTimeout(function () {
           Promise.reject(new Error('Async error'));
         }, 0);
-      })();`
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should not show filtered promise rejection", async () => {
-		const compiler = webpack(config);
-
-		const server = new Server(
-			{
-				port,
-				client: {
-					overlay: {
-						runtimeErrors: error => !/Injected/.test(error.message)
-					}
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			await page.addScriptTag({
-				content: `(function throwError() {
+      })();`,
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should not show filtered promise rejection', async () => {
+    const compiler = webpack(config);
+
+    const server = new Server(
+      {
+        port,
+        client: {
+          overlay: {
+            runtimeErrors: (error) => !/Injected/.test(error.message),
+          },
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      await page.addScriptTag({
+        content: `(function throwError() {
         setTimeout(function () {
           Promise.reject(new Error('Injected async error'));
         }, 0);
-      })();`
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-
-			expect(overlayHandle).toBe(null);
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should show overlay when "Content-Security-Policy" is "default-src \'self\'" was used', async () => {
-		const compiler = webpack({ ...config, devtool: false });
-
-		new ErrorPlugin().apply(compiler);
-
-		const devServerOptions = {
-			port,
-			headers: [
-				{
-					key: "Content-Security-Policy",
-					value: "default-src 'self'"
-				}
-			]
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message.text());
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			// Delay for the overlay to appear
-			await delay(1000);
-
-			const pageHtml = await page.evaluate(() => document.body.outerHTML);
-			const overlayHandle = await page.$("#webpack-dev-server-client-overlay");
-			const overlayFrame = await overlayHandle.contentFrame();
-			const overlayHtml = await overlayFrame.evaluate(
-				() => document.body.outerHTML
-			);
-
-			expect(
-				await prettier.format(pageHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("page html");
-			expect(
-				await prettier.format(overlayHtml, {
-					parser: "html",
-					plugins: [prettierHTML, prettierCSS]
-				})
-			).toMatchSnapshot("overlay html");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+      })();`,
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+
+      expect(overlayHandle).toBe(null);
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should show overlay when "Content-Security-Policy" is "default-src \'self\'" was used', async () => {
+    const compiler = webpack({ ...config, devtool: false });
+
+    new ErrorPlugin().apply(compiler);
+
+    const devServerOptions = {
+      port,
+      headers: [
+        {
+          key: 'Content-Security-Policy',
+          value: "default-src 'self'",
+        },
+      ],
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message.text());
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      // Delay for the overlay to appear
+      await delay(1000);
+
+      const pageHtml = await page.evaluate(() => document.body.outerHTML);
+      const overlayHandle = await page.$('#webpack-dev-server-client-overlay');
+      const overlayFrame = await overlayHandle.contentFrame();
+      const overlayHtml = await overlayFrame.evaluate(
+        () => document.body.outerHTML,
+      );
+
+      expect(
+        await prettier.format(pageHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('page html');
+      expect(
+        await prettier.format(overlayHtml, {
+          parser: 'html',
+          plugins: [prettierHTML, prettierCSS],
+        }),
+      ).toMatchSnapshot('overlay html');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/e2e/port.test.js b/tests/e2e/port.test.js
index cdae92b..2502653 100644
--- a/tests/e2e/port.test.js
+++ b/tests/e2e/port.test.js
@@ -1,107 +1,107 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").port;
-
-describe("port", () => {
-	const ports = [
-		"<not-specified>",
-		// eslint-disable-next-line no-undefined
-		undefined,
-		"auto",
-		port,
-		`${port}`,
-		0,
-		"-1",
-		"99999"
-	];
-
-	for (const testedPort of ports) {
-		it(`should work using "${testedPort}" port `, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {};
-
-			let usedPort;
-
-			if (
-				testedPort === "<not-specified>" ||
-				typeof testedPort === "undefined"
-			) {
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
-				usedPort = port;
-			} else if (testedPort === "auto") {
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
-				devServerOptions.port = testedPort;
-				usedPort = port;
-			} else {
-				devServerOptions.port = testedPort;
-				usedPort = testedPort;
-			}
-
-			const server = new Server(devServerOptions, compiler);
-
-			let errored;
-
-			try {
-				await server.start();
-			} catch (error) {
-				errored = error;
-			}
-
-			if (testedPort === "-1" || testedPort === "99999") {
-				const errorMessageRegExp = /options.port should be >= 0 and < 65536/;
-
-				try {
-					expect(errored.message).toMatch(errorMessageRegExp);
-				} finally {
-					await server.stop();
-				}
-
-				return;
-			}
-
-			const address = server.server.address();
-
-			if (testedPort === 0) {
-				expect(typeof address.port).toBe("number");
-			} else {
-				expect(address.port).toBe(Number(usedPort));
-			}
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${address.port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-
-			if (
-				testedPort === "<not-specified>" ||
-				typeof testedPort === "undefined"
-			) {
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
-			}
-		});
-	}
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').port;
+
+describe('port', () => {
+  const ports = [
+    '<not-specified>',
+    // eslint-disable-next-line no-undefined
+    undefined,
+    'auto',
+    port,
+    `${port}`,
+    0,
+    '-1',
+    '99999',
+  ];
+
+  for (const testedPort of ports) {
+    it(`should work using "${testedPort}" port `, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {};
+
+      let usedPort;
+
+      if (
+        testedPort === '<not-specified>' ||
+        typeof testedPort === 'undefined'
+      ) {
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
+        usedPort = port;
+      } else if (testedPort === 'auto') {
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = port;
+        devServerOptions.port = testedPort;
+        usedPort = port;
+      } else {
+        devServerOptions.port = testedPort;
+        usedPort = testedPort;
+      }
+
+      const server = new Server(devServerOptions, compiler);
+
+      let errored;
+
+      try {
+        await server.start();
+      } catch (error) {
+        errored = error;
+      }
+
+      if (testedPort === '-1' || testedPort === '99999') {
+        const errorMessageRegExp = /options.port should be >= 0 and < 65536/;
+
+        try {
+          expect(errored.message).toMatch(errorMessageRegExp);
+        } finally {
+          await server.stop();
+        }
+
+        return;
+      }
+
+      const address = server.server.address();
+
+      if (testedPort === 0) {
+        expect(typeof address.port).toBe('number');
+      } else {
+        expect(address.port).toBe(Number(usedPort));
+      }
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${address.port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+
+      if (
+        testedPort === '<not-specified>' ||
+        typeof testedPort === 'undefined'
+      ) {
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
+      }
+    });
+  }
 });
diff --git a/tests/e2e/progress.test.js b/tests/e2e/progress.test.js
index 816f1e5..f12a44b 100644
--- a/tests/e2e/progress.test.js
+++ b/tests/e2e/progress.test.js
@@ -1,84 +1,84 @@
-const path = require("node:path");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const reloadConfig = require("../fixtures/reload-config-2/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").progress;
+const path = require('node:path');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const reloadConfig = require('../fixtures/reload-config-2/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').progress;
 
 const cssFilePath = path.resolve(
-	__dirname,
-	"../fixtures/reload-config-2/main.css"
+  __dirname,
+  '../fixtures/reload-config-2/main.css',
 );
 
-describe("progress", () => {
-	it("should work and log progress in a browser console", async () => {
-		fs.writeFileSync(cssFilePath, "body { background-color: rgb(0, 0, 255); }");
-
-		const compiler = webpack(reloadConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				progress: true
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		try {
-			const { page, browser } = await runBrowser();
-
-			const consoleMessages = [];
-
-			try {
-				let doHotUpdate = false;
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("request", interceptedRequest => {
-						if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-						if (/\.hot-update\.(json|js)$/.test(interceptedRequest.url())) {
-							doHotUpdate = true;
-						}
-					});
-
-				await page.goto(`http://localhost:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				fs.writeFileSync(
-					cssFilePath,
-					"body { background-color: rgb(255, 0, 0); }"
-				);
-
-				await new Promise(resolve => {
-					const timer = setInterval(() => {
-						if (doHotUpdate) {
-							clearInterval(timer);
-
-							resolve();
-						}
-					}, 100);
-				});
-			} finally {
-				await browser.close();
-			}
-
-			const progressConsoleMessage = consoleMessages.filter(message =>
-				/^\[webpack-dev-server\] (\[[a-zA-Z]+\] )?[0-9]{1,3}% - /.test(
-					message.text()
-				)
-			);
-
-			expect(progressConsoleMessage.length > 0).toBe(true);
-		} finally {
-			fs.unlinkSync(cssFilePath);
-
-			await server.stop();
-		}
-	});
+describe('progress', () => {
+  it('should work and log progress in a browser console', async () => {
+    fs.writeFileSync(cssFilePath, 'body { background-color: rgb(0, 0, 255); }');
+
+    const compiler = webpack(reloadConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        progress: true,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    try {
+      const { page, browser } = await runBrowser();
+
+      const consoleMessages = [];
+
+      try {
+        let doHotUpdate = false;
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('request', (interceptedRequest) => {
+            if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+            if (/\.hot-update\.(json|js)$/.test(interceptedRequest.url())) {
+              doHotUpdate = true;
+            }
+          });
+
+        await page.goto(`http://localhost:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        fs.writeFileSync(
+          cssFilePath,
+          'body { background-color: rgb(255, 0, 0); }',
+        );
+
+        await new Promise((resolve) => {
+          const timer = setInterval(() => {
+            if (doHotUpdate) {
+              clearInterval(timer);
+
+              resolve();
+            }
+          }, 100);
+        });
+      } finally {
+        await browser.close();
+      }
+
+      const progressConsoleMessage = consoleMessages.filter((message) =>
+        /^\[webpack-dev-server\] (\[[a-zA-Z]+\] )?[0-9]{1,3}% - /.test(
+          message.text(),
+        ),
+      );
+
+      expect(progressConsoleMessage.length > 0).toBe(true);
+    } finally {
+      fs.unlinkSync(cssFilePath);
+
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/e2e/range-header.test.js b/tests/e2e/range-header.test.js
index 311df56..5ff0f00 100644
--- a/tests/e2e/range-header.test.js
+++ b/tests/e2e/range-header.test.js
@@ -1,109 +1,109 @@
-const request = require("supertest");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/static-config/webpack.config");
-const port = require("../helpers/ports-map")["range-header"];
+const request = require('supertest');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/static-config/webpack.config');
+const port = require('../helpers/ports-map')['range-header'];
 
 describe("'Range' header", () => {
-	let compiler;
-	let server;
-
-	beforeAll(async () => {
-		compiler = webpack(config);
-
-		server = new Server({ port }, compiler);
-
-		await server.start();
-	});
-
-	afterAll(async () => {
-		await server.stop();
-	});
-
-	it('should work with "Range" header using "GET" method', async () => {
-		const response = await request(server.app).get("/main.js");
-
-		expect(response.status).toBe(200);
-		expect(response.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(response.headers["accept-ranges"]).toBe("bytes");
-
-		const responseContent = response.text;
-		const responseRange = await request(server.app)
-			.get("/main.js")
-			.set("Range", "bytes=0-499");
-
-		expect(responseRange.status).toBe(206);
-		expect(responseRange.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(responseRange.headers["content-length"]).toBe("500");
-		expect(responseRange.headers["content-range"]).toMatch(/^bytes 0-499\//);
-		expect(responseRange.text).toBe(responseContent.slice(0, 500));
-		expect(responseRange.text.length).toBe(500);
-	});
-
-	it('should work with "Range" header using "HEAD" method', async () => {
-		const response = await request(server.app).head("/main.js");
-
-		expect(response.status).toBe(200);
-		expect(response.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(response.headers["accept-ranges"]).toBe("bytes");
-
-		const responseRange = await request(server.app)
-			.head("/main.js")
-			.set("Range", "bytes=0-499");
-
-		expect(responseRange.status).toBe(206);
-		expect(responseRange.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(responseRange.headers["content-length"]).toBe("500");
-		expect(responseRange.headers["content-range"]).toMatch(/^bytes 0-499\//);
-	});
-
-	it('should work with unsatisfiable "Range" header using "GET" method', async () => {
-		const response = await request(server.app).get("/main.js");
-
-		expect(response.status).toBe(200);
-		expect(response.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(response.headers["accept-ranges"]).toBe("bytes");
-
-		const responseRange = await request(server.app)
-			.get("/main.js")
-			.set("Range", "bytes=99999999999-");
-
-		expect(responseRange.status).toBe(416);
-		expect(responseRange.headers["content-type"]).toBe(
-			"text/html; charset=utf-8"
-		);
-		expect(responseRange.headers["content-range"]).toMatch(/^bytes \*\//);
-	});
-
-	it('should work with malformed "Range" header using "GET" method', async () => {
-		const response = await request(server.app).get("/main.js");
-
-		expect(response.status).toBe(200);
-		expect(response.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(response.headers["accept-ranges"]).toBe("bytes");
-
-		const responseContent = response.text;
-		const responseRange = await request(server.app)
-			.get("/main.js")
-			.set("Range", "bytes");
-
-		expect(responseRange.status).toBe(200);
-		expect(responseRange.headers["content-type"]).toBe(
-			"application/javascript; charset=utf-8"
-		);
-		expect(responseRange.text).toBe(responseContent);
-		expect(responseRange.text.length).toBe(responseContent.length);
-	});
+  let compiler;
+  let server;
+
+  beforeAll(async () => {
+    compiler = webpack(config);
+
+    server = new Server({ port }, compiler);
+
+    await server.start();
+  });
+
+  afterAll(async () => {
+    await server.stop();
+  });
+
+  it('should work with "Range" header using "GET" method', async () => {
+    const response = await request(server.app).get('/main.js');
+
+    expect(response.status).toBe(200);
+    expect(response.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(response.headers['accept-ranges']).toBe('bytes');
+
+    const responseContent = response.text;
+    const responseRange = await request(server.app)
+      .get('/main.js')
+      .set('Range', 'bytes=0-499');
+
+    expect(responseRange.status).toBe(206);
+    expect(responseRange.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(responseRange.headers['content-length']).toBe('500');
+    expect(responseRange.headers['content-range']).toMatch(/^bytes 0-499\//);
+    expect(responseRange.text).toBe(responseContent.slice(0, 500));
+    expect(responseRange.text.length).toBe(500);
+  });
+
+  it('should work with "Range" header using "HEAD" method', async () => {
+    const response = await request(server.app).head('/main.js');
+
+    expect(response.status).toBe(200);
+    expect(response.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(response.headers['accept-ranges']).toBe('bytes');
+
+    const responseRange = await request(server.app)
+      .head('/main.js')
+      .set('Range', 'bytes=0-499');
+
+    expect(responseRange.status).toBe(206);
+    expect(responseRange.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(responseRange.headers['content-length']).toBe('500');
+    expect(responseRange.headers['content-range']).toMatch(/^bytes 0-499\//);
+  });
+
+  it('should work with unsatisfiable "Range" header using "GET" method', async () => {
+    const response = await request(server.app).get('/main.js');
+
+    expect(response.status).toBe(200);
+    expect(response.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(response.headers['accept-ranges']).toBe('bytes');
+
+    const responseRange = await request(server.app)
+      .get('/main.js')
+      .set('Range', 'bytes=99999999999-');
+
+    expect(responseRange.status).toBe(416);
+    expect(responseRange.headers['content-type']).toBe(
+      'text/html; charset=utf-8',
+    );
+    expect(responseRange.headers['content-range']).toMatch(/^bytes \*\//);
+  });
+
+  it('should work with malformed "Range" header using "GET" method', async () => {
+    const response = await request(server.app).get('/main.js');
+
+    expect(response.status).toBe(200);
+    expect(response.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(response.headers['accept-ranges']).toBe('bytes');
+
+    const responseContent = response.text;
+    const responseRange = await request(server.app)
+      .get('/main.js')
+      .set('Range', 'bytes');
+
+    expect(responseRange.status).toBe(200);
+    expect(responseRange.headers['content-type']).toBe(
+      'application/javascript; charset=utf-8',
+    );
+    expect(responseRange.text).toBe(responseContent);
+    expect(responseRange.text.length).toBe(responseContent.length);
+  });
 });
diff --git a/tests/e2e/server-and-client-transport.test.js b/tests/e2e/server-and-client-transport.test.js
index 7b3c69a..8d539d1 100644
--- a/tests/e2e/server-and-client-transport.test.js
+++ b/tests/e2e/server-and-client-transport.test.js
@@ -1,590 +1,618 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const WebsocketServer = require("webpack-dev-server/lib/servers/WebsocketServer");
-const defaultConfig = require("../fixtures/provide-plugin-default/webpack.config");
-const sockjsConfig = require("../fixtures/provide-plugin-sockjs-config/webpack.config");
-const wsConfig = require("../fixtures/provide-plugin-ws-config/webpack.config");
-const customConfig = require("../fixtures/provide-plugin-custom/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["server-and-client-transport"];
-
-describe("server and client transport", () => {
-	it('should use default web socket server ("ws")', async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "ws" web socket server when specify "ws" value', async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: "ws"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "ws" web socket server when specify "ws" value using object', async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: {
-				type: "ws"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "sockjs" web socket server when specify "sockjs" value', async () => {
-		const compiler = webpack(sockjsConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: "sockjs"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "sockjs" web socket server when specify "sockjs" value using object', async () => {
-		const compiler = webpack(sockjsConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: {
-				type: "sockjs"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should use custom web socket server when specify class", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			},
-			webSocketServer: WebsocketServer
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should use custom web socket server when specify class using object", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			},
-			webSocketServer: {
-				type: WebsocketServer
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should use custom web socket server when specify path to class", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			},
-			webSocketServer: require.resolve(
-				"webpack-dev-server/lib/servers/WebsocketServer"
-			)
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should use custom web socket server when specify path to class using object", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			},
-			webSocketServer: {
-				type: require.resolve("webpack-dev-server/lib/servers/WebsocketServer")
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should throw an error on wrong path", async () => {
-		expect.assertions(1);
-
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: {
-				type: "/bad/path/to/implementation"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		try {
-			await server.start();
-		} catch (error) {
-			expect(error.message).toMatchSnapshot();
-		} finally {
-			await server.stop();
-		}
-	});
-
-	it('should use "sockjs" transport, when web socket server is not specify', async () => {
-		const compiler = webpack(sockjsConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "sockjs"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/main.js`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "ws" transport, when web socket server is not specify', async () => {
-		const compiler = webpack(wsConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "sockjs" transport and "sockjs" web socket server', async () => {
-		const compiler = webpack(sockjsConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "sockjs"
-			},
-			webSocketServer: "sockjs"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use "ws" transport and "ws" web socket server', async () => {
-		const compiler = webpack(wsConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "ws"
-			},
-			webSocketServer: "ws"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it('should use custom transport and "sockjs" web socket server', async () => {
-		const compiler = webpack(customConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: require.resolve(
-					"../fixtures/custom-client/CustomSockJSClient"
-				)
-			},
-			webSocketServer: "sockjs"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const consoleMessages = [];
-
-			page.on("console", message => {
-				consoleMessages.push(message);
-			});
-
-			await page.goto(`http://localhost:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const isCorrectTransport = await page.evaluate(
-				() => window.injectedClient === window.expectedClient
-			);
-
-			expect(isCorrectTransport).toBe(true);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot();
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should throw an error on invalid path to server transport", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			webSocketServer: {
-				type: "invalid/path"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-		await expect(async () => {
-			await server.start();
-		}).rejects.toThrowErrorMatchingSnapshot();
-
-		await server.stop();
-	});
-
-	it("should throw an error on invalid path to client transport", async () => {
-		const compiler = webpack(defaultConfig);
-		const devServerOptions = {
-			port,
-			client: {
-				webSocketTransport: "invalid/path"
-			}
-		};
-		const server = new Server(devServerOptions, compiler);
-		await expect(async () => {
-			await server.start();
-		}).rejects.toThrowErrorMatchingSnapshot();
-
-		await server.stop();
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const WebsocketServer = require('webpack-dev-server/lib/servers/WebsocketServer');
+const defaultConfig = require('../fixtures/provide-plugin-default/webpack.config');
+const sockjsConfig = require('../fixtures/provide-plugin-sockjs-config/webpack.config');
+const wsConfig = require('../fixtures/provide-plugin-ws-config/webpack.config');
+const customConfig = require('../fixtures/provide-plugin-custom/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['server-and-client-transport'];
+
+describe('server and client transport', () => {
+  it('should use default web socket server ("ws")', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "ws" web socket server when specify "ws" value', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: 'ws',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "ws" web socket server when specify "ws" value using object', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: {
+        type: 'ws',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "sockjs" web socket server when specify "sockjs" value', async () => {
+    const compiler = webpack(sockjsConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: 'sockjs',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "sockjs" web socket server when specify "sockjs" value using object', async () => {
+    const compiler = webpack(sockjsConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: {
+        type: 'sockjs',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use custom web socket server when specify class', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+      webSocketServer: WebsocketServer,
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use custom web socket server when specify class using object', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+      webSocketServer: {
+        type: WebsocketServer,
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use custom web socket server when specify path to class', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+      webSocketServer: require.resolve(
+        'webpack-dev-server/lib/servers/WebsocketServer',
+      ),
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use custom web socket server when specify path to class using object', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+      webSocketServer: {
+        type: require.resolve('webpack-dev-server/lib/servers/WebsocketServer'),
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should throw an error on wrong path', async () => {
+    expect.assertions(1);
+
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: {
+        type: '/bad/path/to/implementation',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    try {
+      await server.start();
+    } catch (error) {
+      expect(error.message).toMatchSnapshot();
+    } finally {
+      await server.stop();
+    }
+  });
+
+  it('should use "sockjs" transport, when web socket server is not specify', async () => {
+    const compiler = webpack(sockjsConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'sockjs',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/main.js`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "ws" transport, when web socket server is not specify', async () => {
+    const compiler = webpack(wsConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "sockjs" transport and "sockjs" web socket server', async () => {
+    const compiler = webpack(sockjsConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'sockjs',
+      },
+      webSocketServer: 'sockjs',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use "ws" transport and "ws" web socket server', async () => {
+    const compiler = webpack(wsConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'ws',
+      },
+      webSocketServer: 'ws',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should use custom transport and "sockjs" web socket server', async () => {
+    const compiler = webpack(customConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: require.resolve(
+          '../fixtures/custom-client/CustomSockJSClient',
+        ),
+      },
+      webSocketServer: 'sockjs',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const consoleMessages = [];
+
+      page.on('console', (message) => {
+        consoleMessages.push(message);
+      });
+
+      await page.goto(`http://localhost:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const isCorrectTransport = await page.evaluate(
+        () => window.injectedClient === window.expectedClient,
+      );
+
+      expect(isCorrectTransport).toBe(true);
+      expect(
+        consoleMessages.map((message) => message.text()),
+      ).toMatchSnapshot();
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should throw an error on invalid path to server transport', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      webSocketServer: {
+        type: 'invalid/path',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+    await expect(async () => {
+      await server.start();
+    }).rejects.toThrowErrorMatchingSnapshot();
+
+    await server.stop();
+  });
+
+  it('should throw an error on invalid path to client transport', async () => {
+    const compiler = webpack(defaultConfig);
+    const devServerOptions = {
+      port,
+      client: {
+        webSocketTransport: 'invalid/path',
+      },
+    };
+    const server = new Server(devServerOptions, compiler);
+    await expect(async () => {
+      await server.start();
+    }).rejects.toThrowErrorMatchingSnapshot();
+
+    await server.stop();
+  });
 });
diff --git a/tests/e2e/server.test.js b/tests/e2e/server.test.js
index f829de7..93932b3 100644
--- a/tests/e2e/server.test.js
+++ b/tests/e2e/server.test.js
@@ -1,1439 +1,1439 @@
-const https = require("node:https");
-const path = require("node:path");
-const fs = require("graceful-fs");
-const request = require("supertest");
-const spdy = require("spdy");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/static-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const { skipTestOnWindows } = require("../helpers/conditional-test");
-const customHTTP = require("../helpers/custom-http");
-const normalizeOptions = require("../helpers/normalize-options");
-const port = require("../helpers/ports-map")["server-option"];
+const https = require('node:https');
+const path = require('node:path');
+const fs = require('graceful-fs');
+const request = require('supertest');
+const spdy = require('spdy');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/static-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const { skipTestOnWindows } = require('../helpers/conditional-test');
+const customHTTP = require('../helpers/custom-http');
+const normalizeOptions = require('../helpers/normalize-options');
+const port = require('../helpers/ports-map')['server-option'];
 
 const httpsCertificateDirectory = path.resolve(
-	__dirname,
-	"../fixtures/https-certificate"
+  __dirname,
+  '../fixtures/https-certificate',
 );
 
 const staticDirectory = path.resolve(
-	__dirname,
-	"../fixtures/static-config/public"
+  __dirname,
+  '../fixtures/static-config/public',
 );
 
-describe("server option", () => {
-	describe("as string", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		describe("http", () => {
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: "http",
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).not.toEqual("h2");
-
-				expect(response.status()).toMatchSnapshot("response status");
-
-				expect(await response.text()).toMatchSnapshot("response text");
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("custom-http", () => {
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: path.resolve(__dirname, "../helpers/custom-http.js"),
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).not.toEqual("h2");
-
-				expect(response.status()).toMatchSnapshot("response status");
-
-				expect(await response.text()).toMatchSnapshot("response text");
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("https", () => {
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: "https",
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).not.toEqual("h2");
-
-				expect(response.status()).toMatchSnapshot("response status");
-
-				expect(await response.text()).toMatchSnapshot("response text");
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("spdy", () => {
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: "spdy",
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).toEqual("h2");
-
-				expect(response.status()).toMatchSnapshot("response status");
-
-				expect(await response.text()).toMatchSnapshot("response text");
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-	});
-
-	describe("as object", () => {
-		describe("ca, pfx, key and cert are buffer", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "ca.pem")
-								),
-								pfx: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.pfx")
-								),
-								key: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.key")
-								),
-								cert: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.crt")
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are array of buffers", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: [
-									fs.readFileSync(
-										path.join(httpsCertificateDirectory, "ca.pem")
-									)
-								],
-								pfx: [
-									fs.readFileSync(
-										path.join(httpsCertificateDirectory, "server.pfx")
-									)
-								],
-								key: [
-									fs.readFileSync(
-										path.join(httpsCertificateDirectory, "server.key")
-									)
-								],
-								cert: [
-									fs.readFileSync(
-										path.join(httpsCertificateDirectory, "server.crt")
-									)
-								],
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are strings", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: fs
-									.readFileSync(path.join(httpsCertificateDirectory, "ca.pem"))
-									.toString(),
-								// TODO
-								// pfx can't be string because it is binary format
-								pfx: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.pfx")
-								),
-								key: fs
-									.readFileSync(
-										path.join(httpsCertificateDirectory, "server.key")
-									)
-									.toString(),
-								cert: fs
-									.readFileSync(
-										path.join(httpsCertificateDirectory, "server.crt")
-									)
-									.toString(),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are array of strings", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: [
-									fs
-										.readFileSync(
-											path.join(httpsCertificateDirectory, "ca.pem")
-										)
-										.toString()
-								],
-								// pfx can't be string because it is binary format
-								pfx: [
-									fs.readFileSync(
-										path.join(httpsCertificateDirectory, "server.pfx")
-									)
-								],
-								key: [
-									fs
-										.readFileSync(
-											path.join(httpsCertificateDirectory, "server.key")
-										)
-										.toString()
-								],
-								cert: [
-									fs
-										.readFileSync(
-											path.join(httpsCertificateDirectory, "server.crt")
-										)
-										.toString()
-								],
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are paths to files", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: path.join(httpsCertificateDirectory, "ca.pem"),
-								pfx: path.join(httpsCertificateDirectory, "server.pfx"),
-								key: path.join(httpsCertificateDirectory, "server.key"),
-								cert: path.join(httpsCertificateDirectory, "server.crt"),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are array of paths to files", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: [path.join(httpsCertificateDirectory, "ca.pem")],
-								pfx: [path.join(httpsCertificateDirectory, "server.pfx")],
-								key: [path.join(httpsCertificateDirectory, "server.key")],
-								cert: [path.join(httpsCertificateDirectory, "server.crt")],
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are symlinks", () => {
-			if (skipTestOnWindows("Symlinks are not supported on Windows")) {
-				return;
-			}
-
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: path.join(httpsCertificateDirectory, "ca-symlink.pem"),
-								pfx: path.join(httpsCertificateDirectory, "server-symlink.pfx"),
-								key: path.join(httpsCertificateDirectory, "server-symlink.key"),
-								cert: path.join(
-									httpsCertificateDirectory,
-									"server-symlink.crt"
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(response.status()).toEqual(200);
-				expect(await response.text()).toContain("Heyo");
-				expect(consoleMessages.map(message => message.text())).toEqual([]);
-				expect(pageErrors).toEqual([]);
-			});
-		});
-
-		describe("ca, pfx, key and cert are buffer", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "ca.pem")
-								),
-								pfx: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.pfx")
-								),
-								key: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.key")
-								),
-								cert: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.crt")
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are buffer, key and pfx are objects", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "ca.pem")
-								),
-								pfx: [
-									{
-										buf: fs.readFileSync(
-											path.join(httpsCertificateDirectory, "server.pfx")
-										)
-									}
-								],
-								key: [
-									{
-										pem: fs.readFileSync(
-											path.join(httpsCertificateDirectory, "server.key")
-										)
-									}
-								],
-								cert: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.crt")
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("ca, pfx, key and cert are strings, key and pfx are objects", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								ca: fs
-									.readFileSync(path.join(httpsCertificateDirectory, "ca.pem"))
-									.toString(),
-								pfx: [
-									{
-										// pfx can't be string because it is binary format
-										buf: fs.readFileSync(
-											path.join(httpsCertificateDirectory, "server.pfx")
-										)
-									}
-								],
-								key: [
-									{
-										pem: fs
-											.readFileSync(
-												path.join(httpsCertificateDirectory, "server.key")
-											)
-											.toString()
-									}
-								],
-								cert: fs
-									.readFileSync(
-										path.join(httpsCertificateDirectory, "server.crt")
-									)
-									.toString(),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("allow to pass more options", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								minVersion: "TLSv1.1",
-								ca: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "ca.pem")
-								),
-								pfx: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.pfx")
-								),
-								key: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.key")
-								),
-								cert: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.crt")
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		// puppeteer having issues accepting SSL here, throwing error net::ERR_BAD_SSL_CLIENT_AUTH_CERT, hence testing with supertest
-		describe('should support the "requestCert" option', () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let req;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(https, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "https",
-							options: {
-								requestCert: true,
-								pfx: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.pfx")
-								),
-								key: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.key")
-								),
-								cert: fs.readFileSync(
-									path.join(httpsCertificateDirectory, "server.crt")
-								),
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				req = request(server.app);
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await server.stop();
-			});
-
-			it("should pass options to the 'https.createServer' method", async () => {
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				const response = await req.get("/");
-
-				expect(response.status).toMatchSnapshot("response status");
-				expect(response.text).toMatchSnapshot("response text");
-			});
-		});
-
-		describe("spdy server with options", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(spdy, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: "spdy",
-							options: {
-								requestCert: false,
-								ca: [path.join(httpsCertificateDirectory, "ca.pem")],
-								pfx: [path.join(httpsCertificateDirectory, "server.pfx")],
-								key: [path.join(httpsCertificateDirectory, "server.key")],
-								cert: [path.join(httpsCertificateDirectory, "server.crt")],
-								passphrase: "webpack-dev-server"
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`https://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).toEqual("h2");
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("https options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-
-		describe("custom server with options", () => {
-			let compiler;
-			let server;
-			let createServerSpy;
-			let page;
-			let browser;
-			let pageErrors;
-			let consoleMessages;
-
-			beforeEach(async () => {
-				compiler = webpack(config);
-
-				createServerSpy = jest.spyOn(customHTTP, "createServer");
-
-				server = new Server(
-					{
-						static: {
-							directory: staticDirectory,
-							watch: false
-						},
-						server: {
-							type: path.join(__dirname, "../helpers/custom-http.js"),
-							options: {
-								maxHeaderSize: 16384
-							}
-						},
-						port
-					},
-					compiler
-				);
-
-				await server.start();
-
-				({ page, browser } = await runBrowser());
-
-				pageErrors = [];
-				consoleMessages = [];
-			});
-
-			afterEach(async () => {
-				createServerSpy.mockRestore();
-
-				await browser.close();
-				await server.stop();
-			});
-
-			it("should handle GET request to index route (/)", async () => {
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const response = await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const HTTPVersion = await page.evaluate(
-					() => performance.getEntries()[0].nextHopProtocol
-				);
-
-				expect(HTTPVersion).toEqual("http/1.1");
-				expect(
-					normalizeOptions(createServerSpy.mock.calls[0][0])
-				).toMatchSnapshot("http options");
-				expect(response.status()).toMatchSnapshot("response status");
-				expect(await response.text()).toMatchSnapshot("response text");
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			});
-		});
-	});
+describe('server option', () => {
+  describe('as string', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    describe('http', () => {
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: 'http',
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).not.toEqual('h2');
+
+        expect(response.status()).toMatchSnapshot('response status');
+
+        expect(await response.text()).toMatchSnapshot('response text');
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('custom-http', () => {
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: path.resolve(__dirname, '../helpers/custom-http.js'),
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).not.toEqual('h2');
+
+        expect(response.status()).toMatchSnapshot('response status');
+
+        expect(await response.text()).toMatchSnapshot('response text');
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('https', () => {
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: 'https',
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).not.toEqual('h2');
+
+        expect(response.status()).toMatchSnapshot('response status');
+
+        expect(await response.text()).toMatchSnapshot('response text');
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('spdy', () => {
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: 'spdy',
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).toEqual('h2');
+
+        expect(response.status()).toMatchSnapshot('response status');
+
+        expect(await response.text()).toMatchSnapshot('response text');
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+  });
+
+  describe('as object', () => {
+    describe('ca, pfx, key and cert are buffer', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'ca.pem'),
+                ),
+                pfx: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.pfx'),
+                ),
+                key: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.key'),
+                ),
+                cert: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.crt'),
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are array of buffers', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: [
+                  fs.readFileSync(
+                    path.join(httpsCertificateDirectory, 'ca.pem'),
+                  ),
+                ],
+                pfx: [
+                  fs.readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.pfx'),
+                  ),
+                ],
+                key: [
+                  fs.readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.key'),
+                  ),
+                ],
+                cert: [
+                  fs.readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.crt'),
+                  ),
+                ],
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are strings', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: fs
+                  .readFileSync(path.join(httpsCertificateDirectory, 'ca.pem'))
+                  .toString(),
+                // TODO
+                // pfx can't be string because it is binary format
+                pfx: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.pfx'),
+                ),
+                key: fs
+                  .readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.key'),
+                  )
+                  .toString(),
+                cert: fs
+                  .readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.crt'),
+                  )
+                  .toString(),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are array of strings', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: [
+                  fs
+                    .readFileSync(
+                      path.join(httpsCertificateDirectory, 'ca.pem'),
+                    )
+                    .toString(),
+                ],
+                // pfx can't be string because it is binary format
+                pfx: [
+                  fs.readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.pfx'),
+                  ),
+                ],
+                key: [
+                  fs
+                    .readFileSync(
+                      path.join(httpsCertificateDirectory, 'server.key'),
+                    )
+                    .toString(),
+                ],
+                cert: [
+                  fs
+                    .readFileSync(
+                      path.join(httpsCertificateDirectory, 'server.crt'),
+                    )
+                    .toString(),
+                ],
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are paths to files', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: path.join(httpsCertificateDirectory, 'ca.pem'),
+                pfx: path.join(httpsCertificateDirectory, 'server.pfx'),
+                key: path.join(httpsCertificateDirectory, 'server.key'),
+                cert: path.join(httpsCertificateDirectory, 'server.crt'),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are array of paths to files', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: [path.join(httpsCertificateDirectory, 'ca.pem')],
+                pfx: [path.join(httpsCertificateDirectory, 'server.pfx')],
+                key: [path.join(httpsCertificateDirectory, 'server.key')],
+                cert: [path.join(httpsCertificateDirectory, 'server.crt')],
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are symlinks', () => {
+      if (skipTestOnWindows('Symlinks are not supported on Windows')) {
+        return;
+      }
+
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: path.join(httpsCertificateDirectory, 'ca-symlink.pem'),
+                pfx: path.join(httpsCertificateDirectory, 'server-symlink.pfx'),
+                key: path.join(httpsCertificateDirectory, 'server-symlink.key'),
+                cert: path.join(
+                  httpsCertificateDirectory,
+                  'server-symlink.crt',
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(response.status()).toEqual(200);
+        expect(await response.text()).toContain('Heyo');
+        expect(consoleMessages.map((message) => message.text())).toEqual([]);
+        expect(pageErrors).toEqual([]);
+      });
+    });
+
+    describe('ca, pfx, key and cert are buffer', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'ca.pem'),
+                ),
+                pfx: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.pfx'),
+                ),
+                key: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.key'),
+                ),
+                cert: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.crt'),
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are buffer, key and pfx are objects', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'ca.pem'),
+                ),
+                pfx: [
+                  {
+                    buf: fs.readFileSync(
+                      path.join(httpsCertificateDirectory, 'server.pfx'),
+                    ),
+                  },
+                ],
+                key: [
+                  {
+                    pem: fs.readFileSync(
+                      path.join(httpsCertificateDirectory, 'server.key'),
+                    ),
+                  },
+                ],
+                cert: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.crt'),
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('ca, pfx, key and cert are strings, key and pfx are objects', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                ca: fs
+                  .readFileSync(path.join(httpsCertificateDirectory, 'ca.pem'))
+                  .toString(),
+                pfx: [
+                  {
+                    // pfx can't be string because it is binary format
+                    buf: fs.readFileSync(
+                      path.join(httpsCertificateDirectory, 'server.pfx'),
+                    ),
+                  },
+                ],
+                key: [
+                  {
+                    pem: fs
+                      .readFileSync(
+                        path.join(httpsCertificateDirectory, 'server.key'),
+                      )
+                      .toString(),
+                  },
+                ],
+                cert: fs
+                  .readFileSync(
+                    path.join(httpsCertificateDirectory, 'server.crt'),
+                  )
+                  .toString(),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('allow to pass more options', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                minVersion: 'TLSv1.1',
+                ca: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'ca.pem'),
+                ),
+                pfx: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.pfx'),
+                ),
+                key: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.key'),
+                ),
+                cert: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.crt'),
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    // puppeteer having issues accepting SSL here, throwing error net::ERR_BAD_SSL_CLIENT_AUTH_CERT, hence testing with supertest
+    describe('should support the "requestCert" option', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let req;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(https, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'https',
+              options: {
+                requestCert: true,
+                pfx: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.pfx'),
+                ),
+                key: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.key'),
+                ),
+                cert: fs.readFileSync(
+                  path.join(httpsCertificateDirectory, 'server.crt'),
+                ),
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        req = request(server.app);
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await server.stop();
+      });
+
+      it("should pass options to the 'https.createServer' method", async () => {
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        const response = await req.get('/');
+
+        expect(response.status).toMatchSnapshot('response status');
+        expect(response.text).toMatchSnapshot('response text');
+      });
+    });
+
+    describe('spdy server with options', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(spdy, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: 'spdy',
+              options: {
+                requestCert: false,
+                ca: [path.join(httpsCertificateDirectory, 'ca.pem')],
+                pfx: [path.join(httpsCertificateDirectory, 'server.pfx')],
+                key: [path.join(httpsCertificateDirectory, 'server.key')],
+                cert: [path.join(httpsCertificateDirectory, 'server.crt')],
+                passphrase: 'webpack-dev-server',
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`https://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).toEqual('h2');
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('https options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+
+    describe('custom server with options', () => {
+      let compiler;
+      let server;
+      let createServerSpy;
+      let page;
+      let browser;
+      let pageErrors;
+      let consoleMessages;
+
+      beforeEach(async () => {
+        compiler = webpack(config);
+
+        createServerSpy = jest.spyOn(customHTTP, 'createServer');
+
+        server = new Server(
+          {
+            static: {
+              directory: staticDirectory,
+              watch: false,
+            },
+            server: {
+              type: path.join(__dirname, '../helpers/custom-http.js'),
+              options: {
+                maxHeaderSize: 16384,
+              },
+            },
+            port,
+          },
+          compiler,
+        );
+
+        await server.start();
+
+        ({ page, browser } = await runBrowser());
+
+        pageErrors = [];
+        consoleMessages = [];
+      });
+
+      afterEach(async () => {
+        createServerSpy.mockRestore();
+
+        await browser.close();
+        await server.stop();
+      });
+
+      it('should handle GET request to index route (/)', async () => {
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const response = await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const HTTPVersion = await page.evaluate(
+          () => performance.getEntries()[0].nextHopProtocol,
+        );
+
+        expect(HTTPVersion).toEqual('http/1.1');
+        expect(
+          normalizeOptions(createServerSpy.mock.calls[0][0]),
+        ).toMatchSnapshot('http options');
+        expect(response.status()).toMatchSnapshot('response status');
+        expect(await response.text()).toMatchSnapshot('response text');
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      });
+    });
+  });
 });
diff --git a/tests/e2e/setup-exit-signals.test.js b/tests/e2e/setup-exit-signals.test.js
index 08cbe93..e926a7d 100644
--- a/tests/e2e/setup-exit-signals.test.js
+++ b/tests/e2e/setup-exit-signals.test.js
@@ -1,116 +1,116 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/simple-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["setup-exit-signals-option"];
-
-describe("setupExitSignals option", () => {
-	describe("should handle 'SIGINT' and 'SIGTERM' signals", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-		let doExit;
-		let exitSpy;
-		let stopCallbackSpy;
-		let stdinResumeSpy;
-		let closeCallbackSpy;
-
-		const signals = ["SIGINT", "SIGTERM"];
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					setupExitSignals: true,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-			doExit = false;
-
-			exitSpy = jest.spyOn(process, "exit").mockImplementation(() => {
-				doExit = true;
-			});
-
-			stdinResumeSpy = jest
-				.spyOn(process.stdin, "resume")
-				.mockImplementation(() => {});
-
-			stopCallbackSpy = jest.spyOn(server, "stopCallback");
-
-			if (server.compiler.close) {
-				closeCallbackSpy = jest.spyOn(server.compiler, "close");
-			}
-		});
-
-		afterEach(async () => {
-			exitSpy.mockReset();
-			stdinResumeSpy.mockReset();
-			for (const signal of signals) {
-				process.removeAllListeners(signal);
-			}
-			process.stdin.removeAllListeners("end");
-			await browser.close();
-			await server.stop();
-		});
-
-		it.each(signals)("should close and exit on %s", async signal => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			process.emit(signal);
-
-			await new Promise(resolve => {
-				const interval = setInterval(() => {
-					if (doExit) {
-						expect(stopCallbackSpy.mock.calls.length).toEqual(1);
-
-						if (server.compiler.close) {
-							expect(closeCallbackSpy.mock.calls.length).toEqual(1);
-						}
-
-						clearInterval(interval);
-
-						resolve();
-					}
-				}, 100);
-			});
-
-			consoleMessages = consoleMessages.filter(
-				message =>
-					!(
-						message.text().includes("Trying to reconnect...") ||
-						message.text().includes("Disconnected")
-					)
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/simple-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['setup-exit-signals-option'];
+
+describe('setupExitSignals option', () => {
+  describe("should handle 'SIGINT' and 'SIGTERM' signals", () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+    let doExit;
+    let exitSpy;
+    let stopCallbackSpy;
+    let stdinResumeSpy;
+    let closeCallbackSpy;
+
+    const signals = ['SIGINT', 'SIGTERM'];
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          setupExitSignals: true,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+      doExit = false;
+
+      exitSpy = jest.spyOn(process, 'exit').mockImplementation(() => {
+        doExit = true;
+      });
+
+      stdinResumeSpy = jest
+        .spyOn(process.stdin, 'resume')
+        .mockImplementation(() => {});
+
+      stopCallbackSpy = jest.spyOn(server, 'stopCallback');
+
+      if (server.compiler.close) {
+        closeCallbackSpy = jest.spyOn(server.compiler, 'close');
+      }
+    });
+
+    afterEach(async () => {
+      exitSpy.mockReset();
+      stdinResumeSpy.mockReset();
+      for (const signal of signals) {
+        process.removeAllListeners(signal);
+      }
+      process.stdin.removeAllListeners('end');
+      await browser.close();
+      await server.stop();
+    });
+
+    it.each(signals)('should close and exit on %s', async (signal) => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      process.emit(signal);
+
+      await new Promise((resolve) => {
+        const interval = setInterval(() => {
+          if (doExit) {
+            expect(stopCallbackSpy.mock.calls.length).toEqual(1);
+
+            if (server.compiler.close) {
+              expect(closeCallbackSpy.mock.calls.length).toEqual(1);
+            }
+
+            clearInterval(interval);
+
+            resolve();
+          }
+        }, 100);
+      });
+
+      consoleMessages = consoleMessages.filter(
+        (message) =>
+          !(
+            message.text().includes('Trying to reconnect...') ||
+            message.text().includes('Disconnected')
+          ),
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/setup-middlewares.test.js b/tests/e2e/setup-middlewares.test.js
index d4221a1..5b027e8 100644
--- a/tests/e2e/setup-middlewares.test.js
+++ b/tests/e2e/setup-middlewares.test.js
@@ -1,179 +1,179 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["setup-middlewares-option"];
-
-describe("setupMiddlewares option", () => {
-	let compiler;
-	let server;
-	let page;
-	let browser;
-	let pageErrors;
-	let consoleMessages;
-
-	beforeEach(async () => {
-		compiler = webpack(config);
-		server = new Server(
-			{
-				setupMiddlewares: (middlewares, devServer) => {
-					if (!devServer) {
-						throw new Error("webpack-dev-server is not defined");
-					}
-
-					devServer.app.use("/setup-middleware/some/path", (req, res, next) => {
-						if (req.method === "GET") {
-							res.setHeader("Content-Type", "text/html; charset=utf-8");
-							res.end("setup-middlewares option GET");
-							return;
-						}
-						if (req.method === "POST") {
-							res.setHeader("Content-Type", "text/html; charset=utf-8");
-							res.end("setup-middlewares option POST");
-							return;
-						}
-
-						return next();
-					});
-
-					middlewares.push({
-						name: "hello-world-test-two",
-						middleware: (req, res, next) => {
-							if (req.url !== "/foo/bar/baz") {
-								next();
-
-								return;
-							}
-
-							res.setHeader("Content-Type", "text/html; charset=utf-8");
-							res.end("Hello World without path!");
-						}
-					});
-					middlewares.push({
-						name: "hello-world-test-one",
-						path: "/foo/bar",
-						middleware: (req, res) => {
-							res.setHeader("Content-Type", "text/html; charset=utf-8");
-							res.end("Hello World with path!");
-						}
-					});
-					middlewares.push((req, res) => {
-						res.setHeader("Content-Type", "text/html; charset=utf-8");
-						res.end("Hello World as function!");
-					});
-
-					return middlewares;
-				},
-				port
-			},
-			compiler
-		);
-
-		await server.start();
-
-		({ page, browser } = await runBrowser());
-
-		pageErrors = [];
-		consoleMessages = [];
-	});
-
-	afterEach(async () => {
-		await browser.close();
-		await server.stop();
-	});
-
-	it("should handle GET request to /setup-middleware/some/path route", async () => {
-		page
-			.on("console", message => {
-				consoleMessages.push(message);
-			})
-			.on("pageerror", error => {
-				pageErrors.push(error);
-			});
-
-		const response = await page.goto(
-			`http://127.0.0.1:${port}/setup-middleware/some/path`,
-			{
-				waitUntil: "networkidle0"
-			}
-		);
-
-		expect(response.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-		expect(response.status()).toMatchSnapshot("response status");
-		expect(await response.text()).toMatchSnapshot("response text");
-
-		const response1 = await page.goto(`http://127.0.0.1:${port}/foo/bar`, {
-			waitUntil: "networkidle0"
-		});
-
-		expect(response1.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-		expect(response1.status()).toMatchSnapshot("response status");
-		expect(await response1.text()).toMatchSnapshot("response text");
-
-		const response2 = await page.goto(`http://127.0.0.1:${port}/foo/bar/baz`, {
-			waitUntil: "networkidle0"
-		});
-
-		expect(response2.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-		expect(response2.status()).toMatchSnapshot("response status");
-		expect(await response2.text()).toMatchSnapshot("response text");
-
-		const response3 = await page.goto(
-			`http://127.0.0.1:${port}/setup-middleware/unknown`,
-			{
-				waitUntil: "networkidle0"
-			}
-		);
-
-		expect(response3.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-		expect(response3.status()).toMatchSnapshot("response status");
-		expect(await response3.text()).toMatchSnapshot("response text");
-
-		expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-			"console messages"
-		);
-		expect(pageErrors).toMatchSnapshot("page errors");
-	});
-
-	it("should handle POST request to /setup-middleware/some/path route", async () => {
-		await page.setRequestInterception(true);
-
-		page
-			.on("console", message => {
-				consoleMessages.push(message);
-			})
-			.on("pageerror", error => {
-				pageErrors.push(error);
-			})
-			.on("request", interceptedRequest => {
-				if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-				interceptedRequest.continue({ method: "POST" });
-			});
-
-		const response = await page.goto(
-			`http://127.0.0.1:${port}/setup-middleware/some/path`,
-			{
-				waitUntil: "networkidle0"
-			}
-		);
-
-		expect(response.headers()["content-type"]).toMatchSnapshot(
-			"response headers content-type"
-		);
-		expect(response.status()).toMatchSnapshot("response status");
-		expect(await response.text()).toMatchSnapshot("response text");
-		expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-			"console messages"
-		);
-		expect(pageErrors).toMatchSnapshot("page errors");
-	});
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['setup-middlewares-option'];
+
+describe('setupMiddlewares option', () => {
+  let compiler;
+  let server;
+  let page;
+  let browser;
+  let pageErrors;
+  let consoleMessages;
+
+  beforeEach(async () => {
+    compiler = webpack(config);
+    server = new Server(
+      {
+        setupMiddlewares: (middlewares, devServer) => {
+          if (!devServer) {
+            throw new Error('webpack-dev-server is not defined');
+          }
+
+          devServer.app.use('/setup-middleware/some/path', (req, res, next) => {
+            if (req.method === 'GET') {
+              res.setHeader('Content-Type', 'text/html; charset=utf-8');
+              res.end('setup-middlewares option GET');
+              return;
+            }
+            if (req.method === 'POST') {
+              res.setHeader('Content-Type', 'text/html; charset=utf-8');
+              res.end('setup-middlewares option POST');
+              return;
+            }
+
+            return next();
+          });
+
+          middlewares.push({
+            name: 'hello-world-test-two',
+            middleware: (req, res, next) => {
+              if (req.url !== '/foo/bar/baz') {
+                next();
+
+                return;
+              }
+
+              res.setHeader('Content-Type', 'text/html; charset=utf-8');
+              res.end('Hello World without path!');
+            },
+          });
+          middlewares.push({
+            name: 'hello-world-test-one',
+            path: '/foo/bar',
+            middleware: (req, res) => {
+              res.setHeader('Content-Type', 'text/html; charset=utf-8');
+              res.end('Hello World with path!');
+            },
+          });
+          middlewares.push((req, res) => {
+            res.setHeader('Content-Type', 'text/html; charset=utf-8');
+            res.end('Hello World as function!');
+          });
+
+          return middlewares;
+        },
+        port,
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    ({ page, browser } = await runBrowser());
+
+    pageErrors = [];
+    consoleMessages = [];
+  });
+
+  afterEach(async () => {
+    await browser.close();
+    await server.stop();
+  });
+
+  it('should handle GET request to /setup-middleware/some/path route', async () => {
+    page
+      .on('console', (message) => {
+        consoleMessages.push(message);
+      })
+      .on('pageerror', (error) => {
+        pageErrors.push(error);
+      });
+
+    const response = await page.goto(
+      `http://127.0.0.1:${port}/setup-middleware/some/path`,
+      {
+        waitUntil: 'networkidle0',
+      },
+    );
+
+    expect(response.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+    expect(response.status()).toMatchSnapshot('response status');
+    expect(await response.text()).toMatchSnapshot('response text');
+
+    const response1 = await page.goto(`http://127.0.0.1:${port}/foo/bar`, {
+      waitUntil: 'networkidle0',
+    });
+
+    expect(response1.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+    expect(response1.status()).toMatchSnapshot('response status');
+    expect(await response1.text()).toMatchSnapshot('response text');
+
+    const response2 = await page.goto(`http://127.0.0.1:${port}/foo/bar/baz`, {
+      waitUntil: 'networkidle0',
+    });
+
+    expect(response2.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+    expect(response2.status()).toMatchSnapshot('response status');
+    expect(await response2.text()).toMatchSnapshot('response text');
+
+    const response3 = await page.goto(
+      `http://127.0.0.1:${port}/setup-middleware/unknown`,
+      {
+        waitUntil: 'networkidle0',
+      },
+    );
+
+    expect(response3.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+    expect(response3.status()).toMatchSnapshot('response status');
+    expect(await response3.text()).toMatchSnapshot('response text');
+
+    expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+      'console messages',
+    );
+    expect(pageErrors).toMatchSnapshot('page errors');
+  });
+
+  it('should handle POST request to /setup-middleware/some/path route', async () => {
+    await page.setRequestInterception(true);
+
+    page
+      .on('console', (message) => {
+        consoleMessages.push(message);
+      })
+      .on('pageerror', (error) => {
+        pageErrors.push(error);
+      })
+      .on('request', (interceptedRequest) => {
+        if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+        interceptedRequest.continue({ method: 'POST' });
+      });
+
+    const response = await page.goto(
+      `http://127.0.0.1:${port}/setup-middleware/some/path`,
+      {
+        waitUntil: 'networkidle0',
+      },
+    );
+
+    expect(response.headers()['content-type']).toMatchSnapshot(
+      'response headers content-type',
+    );
+    expect(response.status()).toMatchSnapshot('response status');
+    expect(await response.text()).toMatchSnapshot('response text');
+    expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+      'console messages',
+    );
+    expect(pageErrors).toMatchSnapshot('page errors');
+  });
 });
diff --git a/tests/e2e/static-directory.test.js b/tests/e2e/static-directory.test.js
index 5249e90..fdb5f03 100644
--- a/tests/e2e/static-directory.test.js
+++ b/tests/e2e/static-directory.test.js
@@ -1,684 +1,684 @@
-const path = require("node:path");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const testServer = require("../helpers/test-server");
-const config = require("../fixtures/static-config/webpack.config");
-const port = require("../helpers/ports-map")["static-directory-option"];
-const runBrowser = require("../helpers/run-browser");
-
-const staticDirectory = path.resolve(__dirname, "../fixtures/static-config");
-const publicDirectory = path.resolve(staticDirectory, "public");
-const otherPublicDirectory = path.resolve(staticDirectory, "other");
-
-describe("static.directory option", () => {
-	describe("to directory", () => {
-		const nestedFile = path.resolve(publicDirectory, "assets/example.txt");
-
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						watch: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(nestedFile);
-		});
-
-		it("should handle request to index route", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to other file", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/other.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("Watches folder recursively", done => {
-			// chokidar emitted a change,
-			// meaning it watched the file correctly
-			server.staticWatchers[0].on("change", () => {
-				done();
-			});
-
-			// change a file manually
-			setTimeout(() => {
-				fs.writeFileSync(nestedFile, "Heyo", "utf8");
-			}, 1000);
-		});
-
-		it("Watches node_modules", done => {
-			const filePath = path.join(publicDirectory, "node_modules", "index.html");
-
-			fs.writeFileSync(filePath, "foo", "utf8");
-
-			// chokidar emitted a change,
-			// meaning it watched the file correctly
-			server.staticWatchers[0].on("change", () => {
-				fs.unlinkSync(filePath);
-
-				done();
-			});
-
-			// change a file manually
-			setTimeout(() => {
-				fs.writeFileSync(filePath, "bar", "utf8");
-			}, 1000);
-		});
-	});
-
-	describe("test listing files in folders without index.html using the option static.serveIndex: false", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						watch: true,
-						serveIndex: false
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should not list the files inside the assets folder (404)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/assets`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/bar`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("test listing files in folders without index.html using the option static.serveIndex: true", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						watch: true,
-						serveIndex: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should list the files inside the assets folder (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/assets/`, {
-				waitUntil: "networkidle0"
-			});
-
-			const text = await response.text();
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(text).toContain("example.txt");
-			expect(text).toContain("other.txt");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/bar/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("test listing files in folders without index.html using the default static.serveIndex option (true)", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						watch: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should list the files inside the assets folder (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/assets`, {
-				waitUntil: "networkidle0"
-			});
-
-			const text = await response.text();
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(text).toContain("example.txt");
-			expect(text).toContain("other.txt");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/bar`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("to multiple directories", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: [publicDirectory, otherPublicDirectory],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request first directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to second directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/foo.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("testing single & multiple external paths", () => {
-		let server;
-
-		afterEach(done => {
-			testServer.close(() => {
-				done();
-			});
-		});
-
-		it("Should throw exception (external url)", done => {
-			expect.assertions(1);
-
-			server = testServer.start(
-				config,
-				{
-					static: "https://example.com/"
-				},
-				error => {
-					expect(error.message).toBe(
-						"Using a URL as static.directory is not supported"
-					);
-
-					server.stopCallback(done);
-				}
-			);
-		});
-
-		it("Should not throw exception (local path with lower case first character)", done => {
-			testServer.start(
-				config,
-				{
-					static: {
-						directory:
-							publicDirectory.charAt(0).toLowerCase() +
-							publicDirectory.substring(1),
-						watch: true
-					},
-					port
-				},
-				done
-			);
-		});
-
-		it("Should not throw exception (local path with lower case first character & has '-')", done => {
-			testServer.start(
-				config,
-				{
-					static: {
-						directory: "c:\\absolute\\path\\to\\content-base",
-						watch: true
-					},
-					port
-				},
-				done
-			);
-		});
-
-		it("Should not throw exception (local path with upper case first character & has '-')", done => {
-			testServer.start(
-				config,
-				{
-					static: {
-						directory: "C:\\absolute\\path\\to\\content-base",
-						watch: true
-					},
-					port
-				},
-				done
-			);
-		});
-
-		it("Should throw exception (array with absolute url)", done => {
-			server = testServer.start(
-				config,
-				{
-					static: [publicDirectory, "https://example.com/"]
-				},
-				error => {
-					expect(error.message).toBe(
-						"Using a URL as static.directory is not supported"
-					);
-
-					server.stopCallback(done);
-				}
-			);
-		});
-	});
-
-	describe("defaults to PWD", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			jest
-				.spyOn(process, "cwd")
-				.mockImplementation(() => path.resolve(staticDirectory));
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					// eslint-disable-next-line no-undefined
-					static: undefined,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to /index.html", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("disabled", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			// This is a somewhat weird test, but it is important that we mock
-			// the PWD here, and test if /other.html in our "fake" PWD really is not requested.
-			jest.spyOn(process, "cwd").mockImplementation(() => publicDirectory);
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: false,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should not handle request to /other.html (404)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const path = require('node:path');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const testServer = require('../helpers/test-server');
+const config = require('../fixtures/static-config/webpack.config');
+const port = require('../helpers/ports-map')['static-directory-option'];
+const runBrowser = require('../helpers/run-browser');
+
+const staticDirectory = path.resolve(__dirname, '../fixtures/static-config');
+const publicDirectory = path.resolve(staticDirectory, 'public');
+const otherPublicDirectory = path.resolve(staticDirectory, 'other');
+
+describe('static.directory option', () => {
+  describe('to directory', () => {
+    const nestedFile = path.resolve(publicDirectory, 'assets/example.txt');
+
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            watch: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(nestedFile);
+    });
+
+    it('should handle request to index route', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to other file', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/other.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('Watches folder recursively', (done) => {
+      // chokidar emitted a change,
+      // meaning it watched the file correctly
+      server.staticWatchers[0].on('change', () => {
+        done();
+      });
+
+      // change a file manually
+      setTimeout(() => {
+        fs.writeFileSync(nestedFile, 'Heyo', 'utf8');
+      }, 1000);
+    });
+
+    it('Watches node_modules', (done) => {
+      const filePath = path.join(publicDirectory, 'node_modules', 'index.html');
+
+      fs.writeFileSync(filePath, 'foo', 'utf8');
+
+      // chokidar emitted a change,
+      // meaning it watched the file correctly
+      server.staticWatchers[0].on('change', () => {
+        fs.unlinkSync(filePath);
+
+        done();
+      });
+
+      // change a file manually
+      setTimeout(() => {
+        fs.writeFileSync(filePath, 'bar', 'utf8');
+      }, 1000);
+    });
+  });
+
+  describe('test listing files in folders without index.html using the option static.serveIndex: false', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            watch: true,
+            serveIndex: false,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should not list the files inside the assets folder (404)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/assets`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/bar`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('test listing files in folders without index.html using the option static.serveIndex: true', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            watch: true,
+            serveIndex: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should list the files inside the assets folder (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/assets/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const text = await response.text();
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(text).toContain('example.txt');
+      expect(text).toContain('other.txt');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/bar/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('test listing files in folders without index.html using the default static.serveIndex option (true)', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            watch: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should list the files inside the assets folder (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/assets`, {
+        waitUntil: 'networkidle0',
+      });
+
+      const text = await response.text();
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(text).toContain('example.txt');
+      expect(text).toContain('other.txt');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/bar`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('to multiple directories', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: [publicDirectory, otherPublicDirectory],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request first directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to second directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/foo.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('testing single & multiple external paths', () => {
+    let server;
+
+    afterEach((done) => {
+      testServer.close(() => {
+        done();
+      });
+    });
+
+    it('Should throw exception (external url)', (done) => {
+      expect.assertions(1);
+
+      server = testServer.start(
+        config,
+        {
+          static: 'https://example.com/',
+        },
+        (error) => {
+          expect(error.message).toBe(
+            'Using a URL as static.directory is not supported',
+          );
+
+          server.stopCallback(done);
+        },
+      );
+    });
+
+    it('Should not throw exception (local path with lower case first character)', (done) => {
+      testServer.start(
+        config,
+        {
+          static: {
+            directory:
+              publicDirectory.charAt(0).toLowerCase() +
+              publicDirectory.substring(1),
+            watch: true,
+          },
+          port,
+        },
+        done,
+      );
+    });
+
+    it("Should not throw exception (local path with lower case first character & has '-')", (done) => {
+      testServer.start(
+        config,
+        {
+          static: {
+            directory: 'c:\\absolute\\path\\to\\content-base',
+            watch: true,
+          },
+          port,
+        },
+        done,
+      );
+    });
+
+    it("Should not throw exception (local path with upper case first character & has '-')", (done) => {
+      testServer.start(
+        config,
+        {
+          static: {
+            directory: 'C:\\absolute\\path\\to\\content-base',
+            watch: true,
+          },
+          port,
+        },
+        done,
+      );
+    });
+
+    it('Should throw exception (array with absolute url)', (done) => {
+      server = testServer.start(
+        config,
+        {
+          static: [publicDirectory, 'https://example.com/'],
+        },
+        (error) => {
+          expect(error.message).toBe(
+            'Using a URL as static.directory is not supported',
+          );
+
+          server.stopCallback(done);
+        },
+      );
+    });
+  });
+
+  describe('defaults to PWD', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      jest
+        .spyOn(process, 'cwd')
+        .mockImplementation(() => path.resolve(staticDirectory));
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          // eslint-disable-next-line no-undefined
+          static: undefined,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to /index.html', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('disabled', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      // This is a somewhat weird test, but it is important that we mock
+      // the PWD here, and test if /other.html in our "fake" PWD really is not requested.
+      jest.spyOn(process, 'cwd').mockImplementation(() => publicDirectory);
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: false,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should not handle request to /other.html (404)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/index.html`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/static-public-path.test.js b/tests/e2e/static-public-path.test.js
index 1649cb3..2c84540 100644
--- a/tests/e2e/static-public-path.test.js
+++ b/tests/e2e/static-public-path.test.js
@@ -1,1099 +1,1099 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/static-config/webpack.config");
-const port = require("../helpers/ports-map")["static-public-path-option"];
-const runBrowser = require("../helpers/run-browser");
-
-const staticDirectory = path.resolve(__dirname, "../fixtures/static-config");
-const publicDirectory = path.resolve(staticDirectory, "public");
-const otherPublicDirectory = path.resolve(staticDirectory, "other");
-const staticPublicPath = "/serve-content-at-this-url";
-const otherStaticPublicPath = "/serve-other-content-at-this-url";
-
-describe("static.publicPath option", () => {
-	describe("to directory", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath,
-						watch: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to index", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to other file", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/other.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("test listing files in folders without index.html using the option static.serveIndex: false", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath,
-						watch: true,
-						serveIndex: false
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("shouldn't list the files inside the assets folder (404)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/assets`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/bar`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("test listing files in folders without index.html using the option static.serveIndex: true", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath,
-						watch: true,
-						serveIndex: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should list the files inside the assets folder (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/assets`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toContain("other.txt");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/bar`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("test listing files in folders without index.html using the option static.serveIndex default (true)", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath,
-						watch: true,
-						serveIndex: true
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should list the files inside the assets folder (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/assets`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toContain("other.txt");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should show Heyo. because bar has index.html inside it (200)", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/bar`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("to multiple directories", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: [
-						{
-							directory: publicDirectory,
-							publicPath: staticPublicPath
-						},
-						{
-							directory: otherPublicDirectory,
-							publicPath: staticPublicPath
-						}
-					],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to first directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to second directory", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/foo.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("defaults to CWD", () => {
-		let cwdSpy;
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			cwdSpy = jest
-				.spyOn(process, "cwd")
-				.mockImplementation(() => staticDirectory);
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						publicPath: staticPublicPath
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			cwdSpy.mockRestore();
-
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to page", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/index.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("Content type", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to example.txt", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/assets/example.txt`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(response.headers()["content-type"]).toMatchSnapshot(
-				"response header content-type"
-			);
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("should ignore methods other than GET and HEAD", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: {
-						directory: publicDirectory,
-						publicPath: staticPublicPath
-					},
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle GET request", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle HEAD request", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					if (interceptedRequest.isInterceptResolutionHandled()) return;
-
-					interceptedRequest.continue({ method: "HEAD" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should not handle POST request", async () => {
-			await page.setRequestInterception(true);
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					interceptedRequest.continue({ method: "POST" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should not handle PUT request", async () => {
-			await page.setRequestInterception(true);
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					interceptedRequest.continue({ method: "PUT" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should not handle DELETE request", async () => {
-			await page.setRequestInterception(true);
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					interceptedRequest.continue({ method: "DELETE" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should not handle PATCH request", async () => {
-			await page.setRequestInterception(true);
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				})
-				.on("request", interceptedRequest => {
-					interceptedRequest.continue({ method: "PATCH" });
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("multiple static.publicPath entries", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: [
-						{
-							directory: publicDirectory,
-							publicPath: staticPublicPath,
-							watch: true
-						},
-						{
-							directory: otherPublicDirectory,
-							publicPath: otherStaticPublicPath,
-							watch: true
-						}
-					],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to the index of first path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to the other file of first path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/other.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to the /foo route of second path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${otherStaticPublicPath}/foo.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
-
-	describe("multiple static.publicPath entries with publicPath array", () => {
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					static: [
-						{
-							directory: publicDirectory,
-							publicPath: staticPublicPath,
-							watch: true
-						},
-						{
-							directory: otherPublicDirectory,
-							publicPath: [staticPublicPath, otherStaticPublicPath],
-							watch: true
-						}
-					],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should handle request to the index of first path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to the other file of first path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/other.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to the /foo route of first path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${staticPublicPath}/foo.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-
-		it("should handle request to the /foo route of second path", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(
-				`http://127.0.0.1:${port}${otherStaticPublicPath}/foo.html`,
-				{
-					waitUntil: "networkidle0"
-				}
-			);
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(await response.text()).toMatchSnapshot("response text");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		});
-	});
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/static-config/webpack.config');
+const port = require('../helpers/ports-map')['static-public-path-option'];
+const runBrowser = require('../helpers/run-browser');
+
+const staticDirectory = path.resolve(__dirname, '../fixtures/static-config');
+const publicDirectory = path.resolve(staticDirectory, 'public');
+const otherPublicDirectory = path.resolve(staticDirectory, 'other');
+const staticPublicPath = '/serve-content-at-this-url';
+const otherStaticPublicPath = '/serve-other-content-at-this-url';
+
+describe('static.publicPath option', () => {
+  describe('to directory', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+            watch: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to index', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to other file', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/other.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('test listing files in folders without index.html using the option static.serveIndex: false', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+            watch: true,
+            serveIndex: false,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it("shouldn't list the files inside the assets folder (404)", async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/assets`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/bar`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('test listing files in folders without index.html using the option static.serveIndex: true', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+            watch: true,
+            serveIndex: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should list the files inside the assets folder (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/assets`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toContain('other.txt');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/bar`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('test listing files in folders without index.html using the option static.serveIndex default (true)', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+            watch: true,
+            serveIndex: true,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should list the files inside the assets folder (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/assets`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toContain('other.txt');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should show Heyo. because bar has index.html inside it (200)', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/bar`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('to multiple directories', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: [
+            {
+              directory: publicDirectory,
+              publicPath: staticPublicPath,
+            },
+            {
+              directory: otherPublicDirectory,
+              publicPath: staticPublicPath,
+            },
+          ],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to first directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to second directory', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/foo.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('defaults to CWD', () => {
+    let cwdSpy;
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      cwdSpy = jest
+        .spyOn(process, 'cwd')
+        .mockImplementation(() => staticDirectory);
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            publicPath: staticPublicPath,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      cwdSpy.mockRestore();
+
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to page', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/index.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('Content type', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to example.txt', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/assets/example.txt`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(response.headers()['content-type']).toMatchSnapshot(
+        'response header content-type',
+      );
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('should ignore methods other than GET and HEAD', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: {
+            directory: publicDirectory,
+            publicPath: staticPublicPath,
+          },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle GET request', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle HEAD request', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          if (interceptedRequest.isInterceptResolutionHandled()) return;
+
+          interceptedRequest.continue({ method: 'HEAD' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should not handle POST request', async () => {
+      await page.setRequestInterception(true);
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          interceptedRequest.continue({ method: 'POST' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should not handle PUT request', async () => {
+      await page.setRequestInterception(true);
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          interceptedRequest.continue({ method: 'PUT' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should not handle DELETE request', async () => {
+      await page.setRequestInterception(true);
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          interceptedRequest.continue({ method: 'DELETE' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should not handle PATCH request', async () => {
+      await page.setRequestInterception(true);
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        })
+        .on('request', (interceptedRequest) => {
+          interceptedRequest.continue({ method: 'PATCH' });
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('multiple static.publicPath entries', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: [
+            {
+              directory: publicDirectory,
+              publicPath: staticPublicPath,
+              watch: true,
+            },
+            {
+              directory: otherPublicDirectory,
+              publicPath: otherStaticPublicPath,
+              watch: true,
+            },
+          ],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to the index of first path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to the other file of first path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/other.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to the /foo route of second path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${otherStaticPublicPath}/foo.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
+
+  describe('multiple static.publicPath entries with publicPath array', () => {
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          static: [
+            {
+              directory: publicDirectory,
+              publicPath: staticPublicPath,
+              watch: true,
+            },
+            {
+              directory: otherPublicDirectory,
+              publicPath: [staticPublicPath, otherStaticPublicPath],
+              watch: true,
+            },
+          ],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should handle request to the index of first path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to the other file of first path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/other.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to the /foo route of first path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${staticPublicPath}/foo.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+
+    it('should handle request to the /foo route of second path', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(
+        `http://127.0.0.1:${port}${otherStaticPublicPath}/foo.html`,
+        {
+          waitUntil: 'networkidle0',
+        },
+      );
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(await response.text()).toMatchSnapshot('response text');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    });
+  });
 });
diff --git a/tests/e2e/stats.test.js b/tests/e2e/stats.test.js
index d416b90..7af8303 100644
--- a/tests/e2e/stats.test.js
+++ b/tests/e2e/stats.test.js
@@ -1,143 +1,143 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const HTMLGeneratorPlugin = require("../helpers/html-generator-plugin");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").stats;
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const HTMLGeneratorPlugin = require('../helpers/html-generator-plugin');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').stats;
 
 global.console.log = jest.fn();
 
-describe("stats", () => {
-	const cases = [
-		{
-			title: 'should work when "stats" is not specified',
-			webpackOptions: {}
-		},
-		{
-			title: 'should work using "{}" value for the "stats" option',
-			webpackOptions: {
-				stats: {}
-			}
-		},
-		{
-			title: 'should work using "undefined" value for the "stats" option',
-			webpackOptions: {
-				// eslint-disable-next-line no-undefined
-				stats: undefined
-			}
-		},
-		{
-			title: 'should work using "false" value for the "stats" option',
-			webpackOptions: {
-				stats: false
-			}
-		},
-		{
-			title: 'should work using "errors-only" value for the "stats" option',
-			webpackOptions: {
-				stats: "errors-only"
-			}
-		},
-		{
-			title:
-				'should work using "{ assets: false }" value for the "stats" option',
-			webpackOptions: {
-				stats: {
-					assets: false
-				}
-			}
-		}
-		// TODO: support object `config.stats.colors`
-		// {
-		//   title:
-		//     'should work using "{ assets: false }" value for the "stats" option',
-		//   webpackOptions: {
-		//     stats: {
-		//       colors: {
-		//         green: "\u001b[32m",
-		//       },
-		//     },
-		//   },
-		// },
-		// `config.stats.warningsFilter` is deprecated in favor of config.ignoreWarnings
-		// {
-		//   title:
-		//     'should work using "{ warningsFilter: \'test\' }" value for the "stats" option',
-		//   webpackOptions: {
-		//     plugins: [
-		//       {
-		//         apply(compiler) {
-		//           compiler.hooks.thisCompilation.tap(
-		//             "warnings-webpack-plugin",
-		//             (compilation) => {
-		//               compilation.warnings.push(
-		//                 new Error("Warning from compilation"),
-		//               );
-		//             },
-		//           );
-		//         },
-		//       },
-		//       new HTMLGeneratorPlugin(),
-		//     ],
-		//     stats: { warningsFilter: /Warning from compilation/ },
-		//   },
-		// },
-	];
+describe('stats', () => {
+  const cases = [
+    {
+      title: 'should work when "stats" is not specified',
+      webpackOptions: {},
+    },
+    {
+      title: 'should work using "{}" value for the "stats" option',
+      webpackOptions: {
+        stats: {},
+      },
+    },
+    {
+      title: 'should work using "undefined" value for the "stats" option',
+      webpackOptions: {
+        // eslint-disable-next-line no-undefined
+        stats: undefined,
+      },
+    },
+    {
+      title: 'should work using "false" value for the "stats" option',
+      webpackOptions: {
+        stats: false,
+      },
+    },
+    {
+      title: 'should work using "errors-only" value for the "stats" option',
+      webpackOptions: {
+        stats: 'errors-only',
+      },
+    },
+    {
+      title:
+        'should work using "{ assets: false }" value for the "stats" option',
+      webpackOptions: {
+        stats: {
+          assets: false,
+        },
+      },
+    },
+    // TODO: support object `config.stats.colors`
+    // {
+    //   title:
+    //     'should work using "{ assets: false }" value for the "stats" option',
+    //   webpackOptions: {
+    //     stats: {
+    //       colors: {
+    //         green: "\u001b[32m",
+    //       },
+    //     },
+    //   },
+    // },
+    // `config.stats.warningsFilter` is deprecated in favor of config.ignoreWarnings
+    // {
+    //   title:
+    //     'should work using "{ warningsFilter: \'test\' }" value for the "stats" option',
+    //   webpackOptions: {
+    //     plugins: [
+    //       {
+    //         apply(compiler) {
+    //           compiler.hooks.thisCompilation.tap(
+    //             "warnings-webpack-plugin",
+    //             (compilation) => {
+    //               compilation.warnings.push(
+    //                 new Error("Warning from compilation"),
+    //               );
+    //             },
+    //           );
+    //         },
+    //       },
+    //       new HTMLGeneratorPlugin(),
+    //     ],
+    //     stats: { warningsFilter: /Warning from compilation/ },
+    //   },
+    // },
+  ];
 
-	if (webpack.version.startsWith("5")) {
-		cases.push({
-			title: 'should work and respect the "ignoreWarnings" option',
-			webpackOptions: {
-				plugins: [
-					{
-						apply(compiler) {
-							compiler.hooks.thisCompilation.tap(
-								"warnings-webpack-plugin",
-								compilation => {
-									compilation.warnings.push(
-										new Error("Warning from compilation")
-									);
-								}
-							);
-						}
-					},
-					new HTMLGeneratorPlugin()
-				],
-				ignoreWarnings: [/Warning from compilation/]
-			}
-		});
-	}
+  if (webpack.version.startsWith('5')) {
+    cases.push({
+      title: 'should work and respect the "ignoreWarnings" option',
+      webpackOptions: {
+        plugins: [
+          {
+            apply(compiler) {
+              compiler.hooks.thisCompilation.tap(
+                'warnings-webpack-plugin',
+                (compilation) => {
+                  compilation.warnings.push(
+                    new Error('Warning from compilation'),
+                  );
+                },
+              );
+            },
+          },
+          new HTMLGeneratorPlugin(),
+        ],
+        ignoreWarnings: [/Warning from compilation/],
+      },
+    });
+  }
 
-	for (const testCase of cases) {
-		it(testCase.title, async () => {
-			const compiler = webpack({ ...config, ...testCase.webpackOptions });
-			const devServerOptions = {
-				port
-			};
-			const server = new Server(devServerOptions, compiler);
+  for (const testCase of cases) {
+    it(testCase.title, async () => {
+      const compiler = webpack({ ...config, ...testCase.webpackOptions });
+      const devServerOptions = {
+        port,
+      };
+      const server = new Server(devServerOptions, compiler);
 
-			await server.start();
+      await server.start();
 
-			const { page, browser } = await runBrowser();
+      const { page, browser } = await runBrowser();
 
-			try {
-				const consoleMessages = [];
+      try {
+        const consoleMessages = [];
 
-				page.on("console", message => {
-					consoleMessages.push(message);
-				});
+        page.on('console', (message) => {
+          consoleMessages.push(message);
+        });
 
-				await page.goto(`http://localhost:${port}/`, {
-					waitUntil: "networkidle0"
-				});
+        await page.goto(`http://localhost:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
 
-				expect(
-					consoleMessages.map(message => message.text())
-				).toMatchSnapshot();
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot();
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
 });
diff --git a/tests/e2e/target.test.js b/tests/e2e/target.test.js
index b5bcaf0..1ffb284 100644
--- a/tests/e2e/target.test.js
+++ b/tests/e2e/target.test.js
@@ -1,180 +1,180 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map").target;
-const workerConfig = require("../fixtures/worker-config/webpack.config");
-const workerConfigDevServerFalse = require("../fixtures/worker-config-dev-server-false/webpack.config");
+const path = require('node:path');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map').target;
+const workerConfig = require('../fixtures/worker-config/webpack.config');
+const workerConfigDevServerFalse = require('../fixtures/worker-config-dev-server-false/webpack.config');
 
 const sortByTerm = (data, term) =>
-	data.sort((a, b) => (a.indexOf(term) < b.indexOf(term) ? -1 : 1));
-
-describe("target", () => {
-	const targets = [
-		false,
-		"browserslist:defaults",
-		"web",
-		"webworker",
-		"node",
-		"async-node",
-		"electron-main",
-		"electron-preload",
-		"electron-renderer",
-		"nwjs",
-		"node-webkit",
-		"es5",
-		["web", "es5"]
-	];
-
-	for (const target of targets) {
-		it(`should work using "${target}" target`, async () => {
-			const compiler = webpack({
-				...config,
-				target,
-				...(target === false || target === "es5"
-					? {
-							output: { chunkFormat: "array-push", path: "/" }
-						}
-					: {})
-			});
-			const server = new Server({ port }, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-
-				// TODO: check why require is defined in theses target
-				// if (
-				//   target === "node" ||
-				//   target === "async-node" ||
-				//   target === "electron-main" ||
-				//   target === "electron-preload" ||
-				//   target === "electron-renderer" ||
-				//   target === "nwjs" ||
-				//   target === "node-webkit"
-				// ) {
-				//   console.log(pageErrors);
-				//   const hasRequireOrGlobalError =
-				//     pageErrors.filter((pageError) =>
-				//       /require is not defined|global is not defined/.test(pageError),
-				//     ).length === 1;
-
-				//   expect(hasRequireOrGlobalError).toBe(true);
-				// } else {
-				//   expect(pageErrors).toMatchSnapshot("page errors");
-				// }
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
-
-	it("should work using multi compiler mode with `web` and `webworker` targets", async () => {
-		const compiler = webpack(workerConfig);
-		const server = new Server({ port }, compiler);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(
-				sortByTerm(
-					consoleMessages.map(message => message.text()),
-					"Worker said:"
-				)
-			).toMatchSnapshot("console messages");
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
-
-	it("should work using multi compiler mode with `web` and `webworker` targets with `devServer: false`", async () => {
-		const compiler = webpack(workerConfigDevServerFalse);
-		const server = new Server(
-			{
-				port,
-				static: {
-					directory: path.resolve(
-						__dirname,
-						"../fixtures/worker-config-dev-server-false/public/"
-					)
-				}
-			},
-			compiler
-		);
-
-		await server.start();
-
-		const { page, browser } = await runBrowser();
-
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
-
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(
-				sortByTerm(
-					consoleMessages.map(message => message.text()),
-					"Worker said:"
-				)
-			).toMatchSnapshot("console messages");
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+  data.sort((a, b) => (a.indexOf(term) < b.indexOf(term) ? -1 : 1));
+
+describe('target', () => {
+  const targets = [
+    false,
+    'browserslist:defaults',
+    'web',
+    'webworker',
+    'node',
+    'async-node',
+    'electron-main',
+    'electron-preload',
+    'electron-renderer',
+    'nwjs',
+    'node-webkit',
+    'es5',
+    ['web', 'es5'],
+  ];
+
+  for (const target of targets) {
+    it(`should work using "${target}" target`, async () => {
+      const compiler = webpack({
+        ...config,
+        target,
+        ...(target === false || target === 'es5'
+          ? {
+              output: { chunkFormat: 'array-push', path: '/' },
+            }
+          : {}),
+      });
+      const server = new Server({ port }, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+
+        // TODO: check why require is defined in theses target
+        // if (
+        //   target === "node" ||
+        //   target === "async-node" ||
+        //   target === "electron-main" ||
+        //   target === "electron-preload" ||
+        //   target === "electron-renderer" ||
+        //   target === "nwjs" ||
+        //   target === "node-webkit"
+        // ) {
+        //   console.log(pageErrors);
+        //   const hasRequireOrGlobalError =
+        //     pageErrors.filter((pageError) =>
+        //       /require is not defined|global is not defined/.test(pageError),
+        //     ).length === 1;
+
+        //   expect(hasRequireOrGlobalError).toBe(true);
+        // } else {
+        //   expect(pageErrors).toMatchSnapshot("page errors");
+        // }
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
+
+  it('should work using multi compiler mode with `web` and `webworker` targets', async () => {
+    const compiler = webpack(workerConfig);
+    const server = new Server({ port }, compiler);
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(
+        sortByTerm(
+          consoleMessages.map((message) => message.text()),
+          'Worker said:',
+        ),
+      ).toMatchSnapshot('console messages');
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
+
+  it('should work using multi compiler mode with `web` and `webworker` targets with `devServer: false`', async () => {
+    const compiler = webpack(workerConfigDevServerFalse);
+    const server = new Server(
+      {
+        port,
+        static: {
+          directory: path.resolve(
+            __dirname,
+            '../fixtures/worker-config-dev-server-false/public/',
+          ),
+        },
+      },
+      compiler,
+    );
+
+    await server.start();
+
+    const { page, browser } = await runBrowser();
+
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
+
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(
+        sortByTerm(
+          consoleMessages.map((message) => message.text()),
+          'Worker said:',
+        ),
+      ).toMatchSnapshot('console messages');
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/e2e/watch-files.test.js b/tests/e2e/watch-files.test.js
index 3264e74..13dc3b3 100644
--- a/tests/e2e/watch-files.test.js
+++ b/tests/e2e/watch-files.test.js
@@ -1,680 +1,680 @@
-const path = require("node:path");
-const chokidar = require("chokidar");
-const fs = require("graceful-fs");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/watch-files-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["watch-files-option"];
+const path = require('node:path');
+const chokidar = require('chokidar');
+const fs = require('graceful-fs');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/watch-files-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['watch-files-option'];
 
 const watchDir = path.resolve(
-	__dirname,
-	"../fixtures/watch-files-config/public"
+  __dirname,
+  '../fixtures/watch-files-config/public',
 );
 
-describe("watchFiles option", () => {
-	describe("should work with string and path to file", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: file,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "Kurosaki Ichigo", "utf8");
-
-			await new Promise(resolve => {
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(file);
-
-					resolve();
-				});
-			});
-		});
-	});
-
-	describe("should work with string and path to directory", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: watchDir,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "Kurosaki Ichigo", "utf8");
-
-			await new Promise(resolve => {
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(file);
-
-					resolve();
-				});
-			});
-		});
-	});
-
-	describe("should work with string and glob", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: `${watchDir}/**/*`,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "Kurosaki Ichigo", "utf8");
-
-			await new Promise(resolve => {
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(file);
-
-					resolve();
-				});
-			});
-		});
-	});
-
-	describe("should not crash if file doesn't exist", () => {
-		const nonExistFile = path.join(watchDir, "assets/non-exist.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			try {
-				fs.unlinkSync(nonExistFile);
-			} catch (error) {
-				// ignore
-			}
-
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: nonExistFile,
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			await new Promise(resolve => {
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(nonExistFile);
-					resolve();
-				});
-
-				// create file content
-				setTimeout(() => {
-					fs.writeFileSync(nonExistFile, "Kurosaki Ichigo", "utf8");
-					// change file content
-					setTimeout(() => {
-						fs.writeFileSync(nonExistFile, "Kurosaki Ichigo", "utf8");
-					}, 1000);
-				}, 1000);
-			});
-		});
-	});
-
-	describe("should work with object with single path", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: { paths: file },
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "Kurosaki Ichigo", "utf8");
-
-			await new Promise(resolve => {
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(file);
-
-					resolve();
-				});
-			});
-		});
-	});
-
-	describe("should work with object with multiple paths", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		const other = path.join(watchDir, "assets/other.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: { paths: [file, other] },
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-			fs.truncateSync(other);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "foo", "utf8");
-			fs.writeFileSync(other, "bar", "utf8");
-
-			await new Promise(resolve => {
-				const expected = [file, other];
-				let changed = 0;
-
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(expected.includes(changedPath)).toBeTruthy();
-
-					changed += 1;
-
-					if (changed === 2) {
-						resolve();
-					}
-				});
-			});
-		});
-	});
-
-	describe("should work with array config", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-		const other = path.join(watchDir, "assets/other.txt");
-		let compiler;
-		let server;
-		let page;
-		let browser;
-		let pageErrors;
-		let consoleMessages;
-
-		beforeEach(async () => {
-			compiler = webpack(config);
-
-			server = new Server(
-				{
-					watchFiles: [{ paths: [file] }, other],
-					port
-				},
-				compiler
-			);
-
-			await server.start();
-
-			({ page, browser } = await runBrowser());
-
-			pageErrors = [];
-			consoleMessages = [];
-		});
-
-		afterEach(async () => {
-			await browser.close();
-			await server.stop();
-			fs.truncateSync(file);
-			fs.truncateSync(other);
-		});
-
-		it("should reload when file content is changed", async () => {
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
-
-			const response = await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
-
-			expect(response.status()).toMatchSnapshot("response status");
-
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-
-			expect(pageErrors).toMatchSnapshot("page errors");
-
-			// change file content
-			fs.writeFileSync(file, "foo", "utf8");
-			fs.writeFileSync(other, "bar", "utf8");
-
-			await new Promise(resolve => {
-				let changed = 0;
-
-				server.staticWatchers[0].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(file);
-
-					changed += 1;
-
-					if (changed === 2) {
-						resolve();
-					}
-				});
-				server.staticWatchers[1].on("change", async changedPath => {
-					// page reload
-					await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-					expect(changedPath).toBe(other);
-
-					changed += 1;
-
-					if (changed === 2) {
-						resolve();
-					}
-				});
-			});
-		});
-	});
-
-	describe("should work with options", () => {
-		const file = path.join(watchDir, "assets/example.txt");
-
-		const chokidarMock = jest.spyOn(chokidar, "watch");
-
-		const optionCases = [
-			{
-				poll: true
-			},
-			{
-				poll: 200
-			},
-			{
-				usePolling: true
-			},
-			{
-				usePolling: true,
-				poll: 200
-			},
-			{
-				usePolling: false
-			},
-			{
-				usePolling: false,
-				poll: 200
-			},
-			{
-				usePolling: false,
-				poll: true
-			},
-			{
-				interval: 400,
-				poll: 200
-			},
-			{
-				usePolling: true,
-				interval: 200,
-				poll: 400
-			},
-			{
-				usePolling: false,
-				interval: 200,
-				poll: 400
-			}
-		];
-
-		for (const optionCase of optionCases) {
-			describe(JSON.stringify(optionCase), () => {
-				let compiler;
-				let server;
-				let page;
-				let browser;
-				let pageErrors;
-				let consoleMessages;
-
-				beforeEach(async () => {
-					chokidarMock.mockClear();
-
-					compiler = webpack(config);
-
-					server = new Server(
-						{
-							watchFiles: {
-								paths: file,
-								options: optionCase
-							},
-							port
-						},
-						compiler
-					);
-
-					await server.start();
-
-					({ page, browser } = await runBrowser());
-
-					pageErrors = [];
-					consoleMessages = [];
-				});
-
-				afterEach(async () => {
-					await server.stop();
-					await browser.close();
-					fs.truncateSync(file);
-				});
-
-				it("should reload when file content is changed", async () => {
-					page
-						.on("console", message => {
-							consoleMessages.push(message);
-						})
-						.on("pageerror", error => {
-							pageErrors.push(error);
-						});
-
-					const response = await page.goto(`http://127.0.0.1:${port}/`, {
-						waitUntil: "networkidle0"
-					});
-
-					// should pass correct options to chokidar config
-					expect(chokidarMock.mock.calls[0][1]).toMatchSnapshot();
-
-					expect(response.status()).toMatchSnapshot("response status");
-
-					expect(
-						consoleMessages.map(message => message.text())
-					).toMatchSnapshot("console messages");
-
-					expect(pageErrors).toMatchSnapshot("page errors");
-
-					// change file content
-					fs.writeFileSync(file, "Kurosaki Ichigo", "utf8");
-
-					await new Promise(resolve => {
-						server.staticWatchers[0].on("change", async changedPath => {
-							// page reload
-							await page.waitForNavigation({ waitUntil: "networkidle0" });
-
-							expect(changedPath).toBe(file);
-
-							resolve();
-						});
-					});
-				});
-			});
-		}
-	});
+describe('watchFiles option', () => {
+  describe('should work with string and path to file', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: file,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'Kurosaki Ichigo', 'utf8');
+
+      await new Promise((resolve) => {
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(file);
+
+          resolve();
+        });
+      });
+    });
+  });
+
+  describe('should work with string and path to directory', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: watchDir,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'Kurosaki Ichigo', 'utf8');
+
+      await new Promise((resolve) => {
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(file);
+
+          resolve();
+        });
+      });
+    });
+  });
+
+  describe('should work with string and glob', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: `${watchDir}/**/*`,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'Kurosaki Ichigo', 'utf8');
+
+      await new Promise((resolve) => {
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(file);
+
+          resolve();
+        });
+      });
+    });
+  });
+
+  describe("should not crash if file doesn't exist", () => {
+    const nonExistFile = path.join(watchDir, 'assets/non-exist.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      try {
+        fs.unlinkSync(nonExistFile);
+      } catch (error) {
+        // ignore
+      }
+
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: nonExistFile,
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      await new Promise((resolve) => {
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(nonExistFile);
+          resolve();
+        });
+
+        // create file content
+        setTimeout(() => {
+          fs.writeFileSync(nonExistFile, 'Kurosaki Ichigo', 'utf8');
+          // change file content
+          setTimeout(() => {
+            fs.writeFileSync(nonExistFile, 'Kurosaki Ichigo', 'utf8');
+          }, 1000);
+        }, 1000);
+      });
+    });
+  });
+
+  describe('should work with object with single path', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: { paths: file },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'Kurosaki Ichigo', 'utf8');
+
+      await new Promise((resolve) => {
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(file);
+
+          resolve();
+        });
+      });
+    });
+  });
+
+  describe('should work with object with multiple paths', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    const other = path.join(watchDir, 'assets/other.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: { paths: [file, other] },
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+      fs.truncateSync(other);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'foo', 'utf8');
+      fs.writeFileSync(other, 'bar', 'utf8');
+
+      await new Promise((resolve) => {
+        const expected = [file, other];
+        let changed = 0;
+
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(expected.includes(changedPath)).toBeTruthy();
+
+          changed += 1;
+
+          if (changed === 2) {
+            resolve();
+          }
+        });
+      });
+    });
+  });
+
+  describe('should work with array config', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+    const other = path.join(watchDir, 'assets/other.txt');
+    let compiler;
+    let server;
+    let page;
+    let browser;
+    let pageErrors;
+    let consoleMessages;
+
+    beforeEach(async () => {
+      compiler = webpack(config);
+
+      server = new Server(
+        {
+          watchFiles: [{ paths: [file] }, other],
+          port,
+        },
+        compiler,
+      );
+
+      await server.start();
+
+      ({ page, browser } = await runBrowser());
+
+      pageErrors = [];
+      consoleMessages = [];
+    });
+
+    afterEach(async () => {
+      await browser.close();
+      await server.stop();
+      fs.truncateSync(file);
+      fs.truncateSync(other);
+    });
+
+    it('should reload when file content is changed', async () => {
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
+
+      const response = await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
+
+      expect(response.status()).toMatchSnapshot('response status');
+
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+
+      expect(pageErrors).toMatchSnapshot('page errors');
+
+      // change file content
+      fs.writeFileSync(file, 'foo', 'utf8');
+      fs.writeFileSync(other, 'bar', 'utf8');
+
+      await new Promise((resolve) => {
+        let changed = 0;
+
+        server.staticWatchers[0].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(file);
+
+          changed += 1;
+
+          if (changed === 2) {
+            resolve();
+          }
+        });
+        server.staticWatchers[1].on('change', async (changedPath) => {
+          // page reload
+          await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+          expect(changedPath).toBe(other);
+
+          changed += 1;
+
+          if (changed === 2) {
+            resolve();
+          }
+        });
+      });
+    });
+  });
+
+  describe('should work with options', () => {
+    const file = path.join(watchDir, 'assets/example.txt');
+
+    const chokidarMock = jest.spyOn(chokidar, 'watch');
+
+    const optionCases = [
+      {
+        poll: true,
+      },
+      {
+        poll: 200,
+      },
+      {
+        usePolling: true,
+      },
+      {
+        usePolling: true,
+        poll: 200,
+      },
+      {
+        usePolling: false,
+      },
+      {
+        usePolling: false,
+        poll: 200,
+      },
+      {
+        usePolling: false,
+        poll: true,
+      },
+      {
+        interval: 400,
+        poll: 200,
+      },
+      {
+        usePolling: true,
+        interval: 200,
+        poll: 400,
+      },
+      {
+        usePolling: false,
+        interval: 200,
+        poll: 400,
+      },
+    ];
+
+    for (const optionCase of optionCases) {
+      describe(JSON.stringify(optionCase), () => {
+        let compiler;
+        let server;
+        let page;
+        let browser;
+        let pageErrors;
+        let consoleMessages;
+
+        beforeEach(async () => {
+          chokidarMock.mockClear();
+
+          compiler = webpack(config);
+
+          server = new Server(
+            {
+              watchFiles: {
+                paths: file,
+                options: optionCase,
+              },
+              port,
+            },
+            compiler,
+          );
+
+          await server.start();
+
+          ({ page, browser } = await runBrowser());
+
+          pageErrors = [];
+          consoleMessages = [];
+        });
+
+        afterEach(async () => {
+          await server.stop();
+          await browser.close();
+          fs.truncateSync(file);
+        });
+
+        it('should reload when file content is changed', async () => {
+          page
+            .on('console', (message) => {
+              consoleMessages.push(message);
+            })
+            .on('pageerror', (error) => {
+              pageErrors.push(error);
+            });
+
+          const response = await page.goto(`http://127.0.0.1:${port}/`, {
+            waitUntil: 'networkidle0',
+          });
+
+          // should pass correct options to chokidar config
+          expect(chokidarMock.mock.calls[0][1]).toMatchSnapshot();
+
+          expect(response.status()).toMatchSnapshot('response status');
+
+          expect(
+            consoleMessages.map((message) => message.text()),
+          ).toMatchSnapshot('console messages');
+
+          expect(pageErrors).toMatchSnapshot('page errors');
+
+          // change file content
+          fs.writeFileSync(file, 'Kurosaki Ichigo', 'utf8');
+
+          await new Promise((resolve) => {
+            server.staticWatchers[0].on('change', async (changedPath) => {
+              // page reload
+              await page.waitForNavigation({ waitUntil: 'networkidle0' });
+
+              expect(changedPath).toBe(file);
+
+              resolve();
+            });
+          });
+        });
+      });
+    }
+  });
 });
diff --git a/tests/e2e/web-socket-communication.test.js b/tests/e2e/web-socket-communication.test.js
index 4bf8592..e576b09 100644
--- a/tests/e2e/web-socket-communication.test.js
+++ b/tests/e2e/web-socket-communication.test.js
@@ -1,215 +1,215 @@
-const WebSocket = require("ws");
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const WebsocketServer = require("webpack-dev-server/lib/servers/WebsocketServer");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const port = require("../helpers/ports-map")["web-socket-communication"];
+const WebSocket = require('ws');
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const WebsocketServer = require('webpack-dev-server/lib/servers/WebsocketServer');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const port = require('../helpers/ports-map')['web-socket-communication'];
 
 jest.setTimeout(60000);
 
-describe("web socket communication", () => {
-	const webSocketServers = ["ws", "sockjs"];
-
-	for (const websocketServer of webSocketServers) {
-		it(`should work and close web socket client connection when web socket server closed ("${websocketServer}")`, async () => {
-			WebsocketServer.heartbeatInterval = 100;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				port,
-				webSocketServer: websocketServer
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message.text());
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				await server.stop();
-				await new Promise(resolve => {
-					const interval = setInterval(() => {
-						if (
-							consoleMessages.includes("[webpack-dev-server] Disconnected!")
-						) {
-							clearInterval(interval);
-
-							resolve();
-						}
-					}, 100);
-				});
-
-				expect(consoleMessages).toMatchSnapshot("console messages");
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-			}
-		});
-
-		it(`should work and terminate client that is not alive ("${websocketServer}")`, async () => {
-			WebsocketServer.heartbeatInterval = 100;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				port,
-				webSocketServer: websocketServer
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-				await browser.close();
-
-				// Wait heartbeat
-				await new Promise(resolve => {
-					setTimeout(() => {
-						resolve();
-					}, 200);
-				});
-
-				expect(server.webSocketServer.clients.length).toBe(0);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await server.stop();
-			}
-		});
-
-		it(`should work and reconnect when the connection is lost ("${websocketServer}")`, async () => {
-			WebsocketServer.heartbeatInterval = 100;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				port,
-				webSocketServer: websocketServer
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://127.0.0.1:${port}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				await server.stop();
-				await server.start();
-
-				await page.waitForNavigation({
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
-
-	it(`should work and do heartbeat using ("ws" web socket server)`, async () => {
-		WebsocketServer.heartbeatInterval = 100;
-
-		const compiler = webpack(config);
-		const devServerOptions = {
-			port,
-			webSocketServer: "ws"
-		};
-		const server = new Server(devServerOptions, compiler);
-
-		await server.start();
-
-		server.webSocketServer.heartbeatInterval = 100;
-
-		await new Promise((resolve, reject) => {
-			const ws = new WebSocket(`ws://127.0.0.1:${devServerOptions.port}/ws`, {
-				headers: {
-					host: `127.0.0.1:${devServerOptions.port}`,
-					origin: `http://127.0.0.1:${devServerOptions.port}`
-				}
-			});
-
-			let opened = false;
-			let received = false;
-
-			ws.on("open", () => {
-				opened = true;
-			});
-
-			ws.on("error", error => {
-				reject(error);
-			});
-
-			ws.on("ping", () => {
-				if (opened && received) {
-					ws.close();
-				}
-			});
-
-			ws.on("message", data => {
-				const message = JSON.parse(data);
-
-				if (message.type === "ok") {
-					received = true;
-				}
-			});
-
-			ws.on("close", () => {
-				resolve();
-			});
-		});
-
-		await server.stop();
-	});
+describe('web socket communication', () => {
+  const webSocketServers = ['ws', 'sockjs'];
+
+  for (const websocketServer of webSocketServers) {
+    it(`should work and close web socket client connection when web socket server closed ("${websocketServer}")`, async () => {
+      WebsocketServer.heartbeatInterval = 100;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        port,
+        webSocketServer: websocketServer,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message.text());
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        await server.stop();
+        await new Promise((resolve) => {
+          const interval = setInterval(() => {
+            if (
+              consoleMessages.includes('[webpack-dev-server] Disconnected!')
+            ) {
+              clearInterval(interval);
+
+              resolve();
+            }
+          }, 100);
+        });
+
+        expect(consoleMessages).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+      }
+    });
+
+    it(`should work and terminate client that is not alive ("${websocketServer}")`, async () => {
+      WebsocketServer.heartbeatInterval = 100;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        port,
+        webSocketServer: websocketServer,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+        await browser.close();
+
+        // Wait heartbeat
+        await new Promise((resolve) => {
+          setTimeout(() => {
+            resolve();
+          }, 200);
+        });
+
+        expect(server.webSocketServer.clients.length).toBe(0);
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await server.stop();
+      }
+    });
+
+    it(`should work and reconnect when the connection is lost ("${websocketServer}")`, async () => {
+      WebsocketServer.heartbeatInterval = 100;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        port,
+        webSocketServer: websocketServer,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://127.0.0.1:${port}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        await server.stop();
+        await server.start();
+
+        await page.waitForNavigation({
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
+
+  it(`should work and do heartbeat using ("ws" web socket server)`, async () => {
+    WebsocketServer.heartbeatInterval = 100;
+
+    const compiler = webpack(config);
+    const devServerOptions = {
+      port,
+      webSocketServer: 'ws',
+    };
+    const server = new Server(devServerOptions, compiler);
+
+    await server.start();
+
+    server.webSocketServer.heartbeatInterval = 100;
+
+    await new Promise((resolve, reject) => {
+      const ws = new WebSocket(`ws://127.0.0.1:${devServerOptions.port}/ws`, {
+        headers: {
+          host: `127.0.0.1:${devServerOptions.port}`,
+          origin: `http://127.0.0.1:${devServerOptions.port}`,
+        },
+      });
+
+      let opened = false;
+      let received = false;
+
+      ws.on('open', () => {
+        opened = true;
+      });
+
+      ws.on('error', (error) => {
+        reject(error);
+      });
+
+      ws.on('ping', () => {
+        if (opened && received) {
+          ws.close();
+        }
+      });
+
+      ws.on('message', (data) => {
+        const message = JSON.parse(data);
+
+        if (message.type === 'ok') {
+          received = true;
+        }
+      });
+
+      ws.on('close', () => {
+        resolve();
+      });
+    });
+
+    await server.stop();
+  });
 });
diff --git a/tests/e2e/web-socket-server-url.test.js b/tests/e2e/web-socket-server-url.test.js
index bdff5c8..ab9cb68 100644
--- a/tests/e2e/web-socket-server-url.test.js
+++ b/tests/e2e/web-socket-server-url.test.js
@@ -1,2696 +1,2696 @@
-const express = require("express");
-const webpack = require("@rspack/core");
-const { createProxyMiddleware } = require("http-proxy-middleware");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const sessionSubscribe = require("../helpers/session-subscribe");
-const [port1, port2] = require("../helpers/ports-map")["web-socket-server-url"];
-
-const webSocketServers = ["ws", "sockjs"];
-
-describe("web socket server URL", () => {
-	for (const webSocketServer of webSocketServers) {
-		const websocketURLProtocol = webSocketServer === "ws" ? "ws" : "http";
-
-		it(`should work behind proxy, when hostnames are same and ports are different ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = devServerHost;
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work behind proxy, when hostnames are different and ports are same ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = Server.internalIPSync("v4");
-			const proxyPort = port1;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work behind proxy, when hostnames are different and ports are different ("${webSocketServer}")`, async () => {
-			const devServerHost = "127.0.0.1";
-			const devServerPort = port1;
-			const proxyHost = Server.internalIPSync("v4");
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						hostname: devServerHost
-					}
-				},
-				webSocketServer,
-				port: devServerPort,
-				host: devServerHost,
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			function startProxy(callback) {
-				const app = express();
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${devServerHost}:${devServerPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work behind proxy, when the "host" option is "local-ip" and the "port" option is "auto" ("${webSocketServer}")`, async () => {
-			process.env.WEBPACK_DEV_SERVER_BASE_PORT = 40000;
-
-			const proxyHost = Server.internalIPSync("v4");
-			const proxyPort = port2;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: "auto",
-				host: "local-ip",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const resolvedHost = server.options.host;
-			const resolvedPort = server.options.port;
-
-			function startProxy(callback) {
-				const app = express();
-
-				app.use(
-					"/",
-					createProxyMiddleware({
-						target: `http://${resolvedHost}:${resolvedPort}`,
-						ws: true,
-						changeOrigin: true,
-						logLevel: "warn"
-					})
-				);
-
-				return app.listen(proxyPort, proxyHost, callback);
-			}
-
-			const proxy = await new Promise(resolve => {
-				const proxyCreated = startProxy(() => {
-					resolve(proxyCreated);
-				});
-			});
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${proxyHost}:${proxyPort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${resolvedHost}:${resolvedPort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				proxy.close();
-
-				await browser.close();
-				await server.stop();
-
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.protocol" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						protocol: "ws:"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://localhost:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://localhost:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.protocol" option using "auto:" value ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						protocol: "auto:"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://localhost:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://localhost:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.protocol" option using "http:" value and covert to "ws:" ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						protocol: "http:"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://localhost:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://localhost:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.host" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						hostname: "127.0.0.1"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.host" option using "0.0.0.0" value ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						hostname: "0.0.0.0"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.port" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: port1
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.port" option as string ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: `${port1}`
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with "client.webSocketURL.port" and "webSocketServer.options.port" options as string ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						host: "0.0.0.0",
-						// "sockjs" doesn't support external server
-						port: webSocketServer === "sockjs" ? `${port1}` : `${port2}`
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				client: {
-					webSocketURL: {
-						port: webSocketServer === "sockjs" ? `${port1}` : `${port2}`
-					}
-				},
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					webSocketServer === "sockjs"
-						? `${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-						: `${websocketURLProtocol}://127.0.0.1:${port2}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.port" option using "0" value ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						port: 0
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.pathname" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: "/ws"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with default "/ws" value of the "client.webSocketURL.pathname" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.username" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						username: "zenitsu"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://zenitsu@127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.password" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL:
-						webSocketServer === "ws"
-							? {
-									username: "foo",
-									password: "chuntaro"
-								}
-							: {}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					// "sockjs" has bug with parsing URL
-					webSocketServer === "ws"
-						? `${websocketURLProtocol}://foo:chuntaro@127.0.0.1:${port1}/ws`
-						: `${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.username" and "client.webSocketURL.password" option ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						username: "zenitsu",
-						password: "chuntaro"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://zenitsu:chuntaro@127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the custom web socket server "path" ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: "/custom-ws/foo/bar"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\/foo\/bar/.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/foo/bar`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		// Only works for "ws" server
-		it(`should work with the custom web socket server "path" using empty value ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: webSocketServer === "ws" ? "" : "/custom-ws"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					webSocketServer === "ws"
-						? `${websocketURLProtocol}://127.0.0.1:${port1}`
-						: `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: "/custom-ws/foo/bar"
-					}
-				},
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: "/custom-ws/foo/bar"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\/foo\/bar/.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/foo/bar`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ending without slash ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: "/custom-ws"
-					}
-				},
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: "/custom-ws"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		// Only works for "ws" server, "sockjs" adds "/" be default, because need do requests like "/custom-ws/info?t=1624462615772"
-		it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ending with slash ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: webSocketServer === "ws" ? "/custom-ws/" : "/custom-ws"
-					}
-				},
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: webSocketServer === "ws" ? "/custom-ws/" : "/custom-ws"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		// Only works for "ws" server
-		it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" using empty value ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: webSocketServer === "ws" ? "" : "/custom-ws"
-					}
-				},
-				webSocketServer: {
-					type: webSocketServer,
-					options: {
-						path: webSocketServer === "ws" ? "" : "/custom-ws"
-					}
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					webSocketServer === "ws"
-						? `${websocketURLProtocol}://127.0.0.1:${port1}`
-						: `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		// Only works for "sockjs" server
-		it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "prefix" for compatibility with "sockjs" ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						pathname: "/custom-ws"
-					}
-				},
-				webSocketServer: {
-					type: webSocketServer,
-					options:
-						webSocketServer === "ws"
-							? { path: "/custom-ws" }
-							: { prefix: "/custom-ws" }
-				},
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/custom-ws/.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work when "host" option is IPv4 ("${webSocketServer}")`, async () => {
-			const hostname = Server.internalIPSync("v4");
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				host: hostname
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://${hostname}:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${hostname}:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work when "host" option is "local-ip" ("${webSocketServer}")`, async () => {
-			const hostname = Server.internalIPSync("v4");
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				host: "local-ip"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://${hostname}:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${hostname}:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work when "host" option is "local-ipv4" ("${webSocketServer}")`, async () => {
-			const hostname = Server.internalIPSync("v4");
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				host: "local-ipv4"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-				await page.goto(`http://${hostname}:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://${hostname}:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with "server: 'https'" option ("${webSocketServer}")`, async () => {
-			const hostname = "127.0.0.1";
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				server: "https"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`https://${hostname}:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				if (webSocketServer === "ws") {
-					expect(webSocketRequest.url).toContain(
-						`wss://${hostname}:${port1}/ws`
-					);
-				} else {
-					expect(webSocketRequest.url).toContain(
-						`https://${hostname}:${port1}/ws`
-					);
-				}
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with "server: 'spdy'" option ("${webSocketServer}")`, async () => {
-			const hostname = "127.0.0.1";
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: port1,
-				server: "spdy"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`https://${hostname}:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				if (webSocketServer === "ws") {
-					expect(webSocketRequest.url).toContain(
-						`wss://${hostname}:${port1}/ws`
-					);
-				} else {
-					expect(webSocketRequest.url).toContain(
-						`https://${hostname}:${port1}/ws`
-					);
-				}
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work when "port" option is "auto" ("${webSocketServer}")`, async () => {
-			process.env.WEBPACK_DEV_SERVER_BASE_PORT = 50000;
-
-			const compiler = webpack(config);
-			const devServerOptions = {
-				webSocketServer,
-				port: "auto",
-				host: "0.0.0.0"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const resolvedFreePort = server.options.port;
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${resolvedFreePort}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${resolvedFreePort}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-
-				process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
-			}
-		});
-
-		it(`should work with "client.webSocketURL.*" options ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: {
-						protocol: "ws:",
-						hostname: "127.0.0.1",
-						port: port1,
-						pathname: "/ws"
-					}
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work with the "client.webSocketURL" option as "string" ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: `ws://127.0.0.1:${port1}/ws`
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				const webSocketRequests = [];
-
-				if (webSocketServer === "ws") {
-					const session = await page.target().createCDPSession();
-
-					session.on("Network.webSocketCreated", test => {
-						webSocketRequests.push(test);
-					});
-
-					await session.send("Target.setAutoAttach", {
-						autoAttach: true,
-						flatten: true,
-						waitForDebuggerOnStart: true
-					});
-
-					sessionSubscribe(session);
-				} else {
-					page.on("request", request => {
-						if (/\/ws\//.test(request.url())) {
-							webSocketRequests.push({ url: request.url() });
-						}
-					});
-				}
-
-				await page.goto(`http://127.0.0.1:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				const webSocketRequest = webSocketRequests[0];
-
-				expect(webSocketRequest.url).toContain(
-					`${websocketURLProtocol}://127.0.0.1:${port1}/ws`
-				);
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(pageErrors).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should work and throw an error on invalid web socket URL ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: "unknown://unknown.unknown/unknown"
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				page
-					.on("console", message => {
-						consoleMessages.push(message);
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://localhost:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-					"console messages"
-				);
-				expect(
-					pageErrors.map(pageError =>
-						pageError.message.split("\n")[0].replace("SyntaxError: ", "")
-					)
-				).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-
-		it(`should not work and output disconnect wrong web socket URL ("${webSocketServer}")`, async () => {
-			const compiler = webpack(config);
-			const devServerOptions = {
-				client: {
-					webSocketURL: "ws://unknown.unknown/unknown"
-				},
-				webSocketServer,
-				port: port1,
-				host: "0.0.0.0",
-				allowedHosts: "all"
-			};
-			const server = new Server(devServerOptions, compiler);
-
-			await server.start();
-
-			const { page, browser } = await runBrowser();
-
-			try {
-				const pageErrors = [];
-				const consoleMessages = [];
-
-				let isDisconnected = false;
-
-				page
-					.on("console", message => {
-						const text = message.text();
-
-						if (!isDisconnected) {
-							isDisconnected = /Disconnected!/.test(text);
-							consoleMessages.push(text.replace(/:[\d]+/g, ":<port>"));
-						}
-					})
-					.on("pageerror", error => {
-						pageErrors.push(error);
-					});
-
-				await page.goto(`http://localhost:${port1}/`, {
-					waitUntil: "networkidle0"
-				});
-
-				await new Promise(resolve => {
-					const interval = setInterval(() => {
-						if (
-							consoleMessages.includes("[webpack-dev-server] Disconnected!")
-						) {
-							clearInterval(interval);
-
-							resolve();
-						}
-					}, 100);
-				});
-
-				// TODO: not stable on lynx linux ci
-				// expect(consoleMessages).toMatchSnapshot("console messages");
-				expect(
-					pageErrors.map(pageError => pageError.message.split("\n")[0])
-				).toMatchSnapshot("page errors");
-			} finally {
-				await browser.close();
-				await server.stop();
-			}
-		});
-	}
+const express = require('express');
+const webpack = require('@rspack/core');
+const { createProxyMiddleware } = require('http-proxy-middleware');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const sessionSubscribe = require('../helpers/session-subscribe');
+const [port1, port2] = require('../helpers/ports-map')['web-socket-server-url'];
+
+const webSocketServers = ['ws', 'sockjs'];
+
+describe('web socket server URL', () => {
+  for (const webSocketServer of webSocketServers) {
+    const websocketURLProtocol = webSocketServer === 'ws' ? 'ws' : 'http';
+
+    it(`should work behind proxy, when hostnames are same and ports are different ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = devServerHost;
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work behind proxy, when hostnames are different and ports are same ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = Server.internalIPSync('v4');
+      const proxyPort = port1;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work behind proxy, when hostnames are different and ports are different ("${webSocketServer}")`, async () => {
+      const devServerHost = '127.0.0.1';
+      const devServerPort = port1;
+      const proxyHost = Server.internalIPSync('v4');
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            hostname: devServerHost,
+          },
+        },
+        webSocketServer,
+        port: devServerPort,
+        host: devServerHost,
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      function startProxy(callback) {
+        const app = express();
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${devServerHost}:${devServerPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${devServerHost}:${devServerPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work behind proxy, when the "host" option is "local-ip" and the "port" option is "auto" ("${webSocketServer}")`, async () => {
+      process.env.WEBPACK_DEV_SERVER_BASE_PORT = 40000;
+
+      const proxyHost = Server.internalIPSync('v4');
+      const proxyPort = port2;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: 'auto',
+        host: 'local-ip',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const resolvedHost = server.options.host;
+      const resolvedPort = server.options.port;
+
+      function startProxy(callback) {
+        const app = express();
+
+        app.use(
+          '/',
+          createProxyMiddleware({
+            target: `http://${resolvedHost}:${resolvedPort}`,
+            ws: true,
+            changeOrigin: true,
+            logLevel: 'warn',
+          }),
+        );
+
+        return app.listen(proxyPort, proxyHost, callback);
+      }
+
+      const proxy = await new Promise((resolve) => {
+        const proxyCreated = startProxy(() => {
+          resolve(proxyCreated);
+        });
+      });
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${proxyHost}:${proxyPort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${resolvedHost}:${resolvedPort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        proxy.close();
+
+        await browser.close();
+        await server.stop();
+
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.protocol" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            protocol: 'ws:',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://localhost:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://localhost:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.protocol" option using "auto:" value ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            protocol: 'auto:',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://localhost:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://localhost:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.protocol" option using "http:" value and covert to "ws:" ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            protocol: 'http:',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://localhost:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://localhost:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.host" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            hostname: '127.0.0.1',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.host" option using "0.0.0.0" value ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            hostname: '0.0.0.0',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.port" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: port1,
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.port" option as string ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: `${port1}`,
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with "client.webSocketURL.port" and "webSocketServer.options.port" options as string ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            host: '0.0.0.0',
+            // "sockjs" doesn't support external server
+            port: webSocketServer === 'sockjs' ? `${port1}` : `${port2}`,
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        client: {
+          webSocketURL: {
+            port: webSocketServer === 'sockjs' ? `${port1}` : `${port2}`,
+          },
+        },
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          webSocketServer === 'sockjs'
+            ? `${websocketURLProtocol}://127.0.0.1:${port1}/ws`
+            : `${websocketURLProtocol}://127.0.0.1:${port2}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.port" option using "0" value ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            port: 0,
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.pathname" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: '/ws',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with default "/ws" value of the "client.webSocketURL.pathname" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.username" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            username: 'zenitsu',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://zenitsu@127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.password" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL:
+            webSocketServer === 'ws'
+              ? {
+                  username: 'foo',
+                  password: 'chuntaro',
+                }
+              : {},
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          // "sockjs" has bug with parsing URL
+          webSocketServer === 'ws'
+            ? `${websocketURLProtocol}://foo:chuntaro@127.0.0.1:${port1}/ws`
+            : `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.username" and "client.webSocketURL.password" option ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            username: 'zenitsu',
+            password: 'chuntaro',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://zenitsu:chuntaro@127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the custom web socket server "path" ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: '/custom-ws/foo/bar',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\/foo\/bar/.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/foo/bar`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    // Only works for "ws" server
+    it(`should work with the custom web socket server "path" using empty value ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: webSocketServer === 'ws' ? '' : '/custom-ws',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          webSocketServer === 'ws'
+            ? `${websocketURLProtocol}://127.0.0.1:${port1}`
+            : `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: '/custom-ws/foo/bar',
+          },
+        },
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: '/custom-ws/foo/bar',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\/foo\/bar/.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/foo/bar`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ending without slash ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: '/custom-ws',
+          },
+        },
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: '/custom-ws',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    // Only works for "ws" server, "sockjs" adds "/" be default, because need do requests like "/custom-ws/info?t=1624462615772"
+    it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" ending with slash ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: webSocketServer === 'ws' ? '/custom-ws/' : '/custom-ws',
+          },
+        },
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: webSocketServer === 'ws' ? '/custom-ws/' : '/custom-ws',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws/`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    // Only works for "ws" server
+    it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "path" using empty value ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: webSocketServer === 'ws' ? '' : '/custom-ws',
+          },
+        },
+        webSocketServer: {
+          type: webSocketServer,
+          options: {
+            path: webSocketServer === 'ws' ? '' : '/custom-ws',
+          },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          webSocketServer === 'ws'
+            ? `${websocketURLProtocol}://127.0.0.1:${port1}`
+            : `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    // Only works for "sockjs" server
+    it(`should work with the "client.webSocketURL.pathname" option and the custom web socket server "prefix" for compatibility with "sockjs" ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            pathname: '/custom-ws',
+          },
+        },
+        webSocketServer: {
+          type: webSocketServer,
+          options:
+            webSocketServer === 'ws'
+              ? { path: '/custom-ws' }
+              : { prefix: '/custom-ws' },
+        },
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/custom-ws/.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/custom-ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work when "host" option is IPv4 ("${webSocketServer}")`, async () => {
+      const hostname = Server.internalIPSync('v4');
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        host: hostname,
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://${hostname}:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${hostname}:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work when "host" option is "local-ip" ("${webSocketServer}")`, async () => {
+      const hostname = Server.internalIPSync('v4');
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        host: 'local-ip',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://${hostname}:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${hostname}:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work when "host" option is "local-ipv4" ("${webSocketServer}")`, async () => {
+      const hostname = Server.internalIPSync('v4');
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        host: 'local-ipv4',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+        await page.goto(`http://${hostname}:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://${hostname}:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with "server: 'https'" option ("${webSocketServer}")`, async () => {
+      const hostname = '127.0.0.1';
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        server: 'https',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`https://${hostname}:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        if (webSocketServer === 'ws') {
+          expect(webSocketRequest.url).toContain(
+            `wss://${hostname}:${port1}/ws`,
+          );
+        } else {
+          expect(webSocketRequest.url).toContain(
+            `https://${hostname}:${port1}/ws`,
+          );
+        }
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with "server: 'spdy'" option ("${webSocketServer}")`, async () => {
+      const hostname = '127.0.0.1';
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: port1,
+        server: 'spdy',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`https://${hostname}:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        if (webSocketServer === 'ws') {
+          expect(webSocketRequest.url).toContain(
+            `wss://${hostname}:${port1}/ws`,
+          );
+        } else {
+          expect(webSocketRequest.url).toContain(
+            `https://${hostname}:${port1}/ws`,
+          );
+        }
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work when "port" option is "auto" ("${webSocketServer}")`, async () => {
+      process.env.WEBPACK_DEV_SERVER_BASE_PORT = 50000;
+
+      const compiler = webpack(config);
+      const devServerOptions = {
+        webSocketServer,
+        port: 'auto',
+        host: '0.0.0.0',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const resolvedFreePort = server.options.port;
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${resolvedFreePort}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${resolvedFreePort}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+
+        process.env.WEBPACK_DEV_SERVER_BASE_PORT = undefined;
+      }
+    });
+
+    it(`should work with "client.webSocketURL.*" options ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: {
+            protocol: 'ws:',
+            hostname: '127.0.0.1',
+            port: port1,
+            pathname: '/ws',
+          },
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work with the "client.webSocketURL" option as "string" ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: `ws://127.0.0.1:${port1}/ws`,
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        const webSocketRequests = [];
+
+        if (webSocketServer === 'ws') {
+          const session = await page.target().createCDPSession();
+
+          session.on('Network.webSocketCreated', (test) => {
+            webSocketRequests.push(test);
+          });
+
+          await session.send('Target.setAutoAttach', {
+            autoAttach: true,
+            flatten: true,
+            waitForDebuggerOnStart: true,
+          });
+
+          sessionSubscribe(session);
+        } else {
+          page.on('request', (request) => {
+            if (/\/ws\//.test(request.url())) {
+              webSocketRequests.push({ url: request.url() });
+            }
+          });
+        }
+
+        await page.goto(`http://127.0.0.1:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        const webSocketRequest = webSocketRequests[0];
+
+        expect(webSocketRequest.url).toContain(
+          `${websocketURLProtocol}://127.0.0.1:${port1}/ws`,
+        );
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(pageErrors).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should work and throw an error on invalid web socket URL ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: 'unknown://unknown.unknown/unknown',
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        page
+          .on('console', (message) => {
+            consoleMessages.push(message);
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://localhost:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        expect(
+          consoleMessages.map((message) => message.text()),
+        ).toMatchSnapshot('console messages');
+        expect(
+          pageErrors.map((pageError) =>
+            pageError.message.split('\n')[0].replace('SyntaxError: ', ''),
+          ),
+        ).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+
+    it(`should not work and output disconnect wrong web socket URL ("${webSocketServer}")`, async () => {
+      const compiler = webpack(config);
+      const devServerOptions = {
+        client: {
+          webSocketURL: 'ws://unknown.unknown/unknown',
+        },
+        webSocketServer,
+        port: port1,
+        host: '0.0.0.0',
+        allowedHosts: 'all',
+      };
+      const server = new Server(devServerOptions, compiler);
+
+      await server.start();
+
+      const { page, browser } = await runBrowser();
+
+      try {
+        const pageErrors = [];
+        const consoleMessages = [];
+
+        let isDisconnected = false;
+
+        page
+          .on('console', (message) => {
+            const text = message.text();
+
+            if (!isDisconnected) {
+              isDisconnected = /Disconnected!/.test(text);
+              consoleMessages.push(text.replace(/:[\d]+/g, ':<port>'));
+            }
+          })
+          .on('pageerror', (error) => {
+            pageErrors.push(error);
+          });
+
+        await page.goto(`http://localhost:${port1}/`, {
+          waitUntil: 'networkidle0',
+        });
+
+        await new Promise((resolve) => {
+          const interval = setInterval(() => {
+            if (
+              consoleMessages.includes('[webpack-dev-server] Disconnected!')
+            ) {
+              clearInterval(interval);
+
+              resolve();
+            }
+          }, 100);
+        });
+
+        // TODO: not stable on lynx linux ci
+        // expect(consoleMessages).toMatchSnapshot("console messages");
+        expect(
+          pageErrors.map((pageError) => pageError.message.split('\n')[0]),
+        ).toMatchSnapshot('page errors');
+      } finally {
+        await browser.close();
+        await server.stop();
+      }
+    });
+  }
 });
diff --git a/tests/e2e/web-socket-server.test.js b/tests/e2e/web-socket-server.test.js
index f2381b8..386488e 100644
--- a/tests/e2e/web-socket-server.test.js
+++ b/tests/e2e/web-socket-server.test.js
@@ -1,64 +1,64 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
-const config = require("../fixtures/client-config/webpack.config");
-const runBrowser = require("../helpers/run-browser");
-const sessionSubscribe = require("../helpers/session-subscribe");
-const port = require("../helpers/ports-map")["web-socket-server-test"];
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
+const config = require('../fixtures/client-config/webpack.config');
+const runBrowser = require('../helpers/run-browser');
+const sessionSubscribe = require('../helpers/session-subscribe');
+const port = require('../helpers/ports-map')['web-socket-server-test'];
 
-describe("web socket server", () => {
-	it("should work allow to disable", async () => {
-		const devServerPort = port;
+describe('web socket server', () => {
+  it('should work allow to disable', async () => {
+    const devServerPort = port;
 
-		const compiler = webpack(config);
-		const devServerOptions = {
-			webSocketServer: false,
-			port: devServerPort
-		};
-		const server = new Server(devServerOptions, compiler);
+    const compiler = webpack(config);
+    const devServerOptions = {
+      webSocketServer: false,
+      port: devServerPort,
+    };
+    const server = new Server(devServerOptions, compiler);
 
-		await server.start();
+    await server.start();
 
-		const { page, browser } = await runBrowser();
+    const { page, browser } = await runBrowser();
 
-		try {
-			const pageErrors = [];
-			const consoleMessages = [];
+    try {
+      const pageErrors = [];
+      const consoleMessages = [];
 
-			page
-				.on("console", message => {
-					consoleMessages.push(message);
-				})
-				.on("pageerror", error => {
-					pageErrors.push(error);
-				});
+      page
+        .on('console', (message) => {
+          consoleMessages.push(message);
+        })
+        .on('pageerror', (error) => {
+          pageErrors.push(error);
+        });
 
-			const webSocketRequests = [];
-			const session = await page.target().createCDPSession();
+      const webSocketRequests = [];
+      const session = await page.target().createCDPSession();
 
-			session.on("Network.webSocketCreated", test => {
-				webSocketRequests.push(test);
-			});
+      session.on('Network.webSocketCreated', (test) => {
+        webSocketRequests.push(test);
+      });
 
-			await session.send("Target.setAutoAttach", {
-				autoAttach: true,
-				flatten: true,
-				waitForDebuggerOnStart: true
-			});
+      await session.send('Target.setAutoAttach', {
+        autoAttach: true,
+        flatten: true,
+        waitForDebuggerOnStart: true,
+      });
 
-			sessionSubscribe(session);
+      sessionSubscribe(session);
 
-			await page.goto(`http://127.0.0.1:${port}/`, {
-				waitUntil: "networkidle0"
-			});
+      await page.goto(`http://127.0.0.1:${port}/`, {
+        waitUntil: 'networkidle0',
+      });
 
-			expect(webSocketRequests).toHaveLength(0);
-			expect(consoleMessages.map(message => message.text())).toMatchSnapshot(
-				"console messages"
-			);
-			expect(pageErrors).toMatchSnapshot("page errors");
-		} finally {
-			await browser.close();
-			await server.stop();
-		}
-	});
+      expect(webSocketRequests).toHaveLength(0);
+      expect(consoleMessages.map((message) => message.text())).toMatchSnapshot(
+        'console messages',
+      );
+      expect(pageErrors).toMatchSnapshot('page errors');
+    } finally {
+      await browser.close();
+      await server.stop();
+    }
+  });
 });
diff --git a/tests/fixtures/client-config/bar.js b/tests/fixtures/client-config/bar.js
index 1ae523f..7808a96 100644
--- a/tests/fixtures/client-config/bar.js
+++ b/tests/fixtures/client-config/bar.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Bar.");
+console.log('Bar.');
diff --git a/tests/fixtures/client-config/foo.js b/tests/fixtures/client-config/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/client-config/foo.js
+++ b/tests/fixtures/client-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/client-config/webpack.config.js b/tests/fixtures/client-config/webpack.config.js
index 7bbb852..2559bae 100644
--- a/tests/fixtures/client-config/webpack.config.js
+++ b/tests/fixtures/client-config/webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	devtool: false,
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  devtool: false,
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/custom-client/CustomClientEntry.js b/tests/fixtures/custom-client/CustomClientEntry.js
index daf1cff..0266503 100644
--- a/tests/fixtures/custom-client/CustomClientEntry.js
+++ b/tests/fixtures/custom-client/CustomClientEntry.js
@@ -1 +1 @@
-console.log("custom client entry");
+console.log('custom client entry');
diff --git a/tests/fixtures/custom-client/CustomClientHotEntry.js b/tests/fixtures/custom-client/CustomClientHotEntry.js
index 4432633..ebb8f61 100644
--- a/tests/fixtures/custom-client/CustomClientHotEntry.js
+++ b/tests/fixtures/custom-client/CustomClientHotEntry.js
@@ -1 +1 @@
-console.log("custom client hot entry");
+console.log('custom client hot entry');
diff --git a/tests/fixtures/custom-client/CustomSockJSClient.js b/tests/fixtures/custom-client/CustomSockJSClient.js
index 038eaa1..502a470 100644
--- a/tests/fixtures/custom-client/CustomSockJSClient.js
+++ b/tests/fixtures/custom-client/CustomSockJSClient.js
@@ -2,37 +2,37 @@
  * Copy from webpack-dev-server
  */
 
-"use strict";
+'use strict';
 
-const SockJS = require("sockjs-client/dist/sockjs");
+const SockJS = require('sockjs-client/dist/sockjs');
 
 module.exports = class SockJSClient {
-	constructor(url) {
-		this.sock = new SockJS(
-			url.replace(/^ws:/i, "http://").replace(/^wss:/i, "https://")
-		);
-	}
+  constructor(url) {
+    this.sock = new SockJS(
+      url.replace(/^ws:/i, 'http://').replace(/^wss:/i, 'https://'),
+    );
+  }
 
-	onOpen(f) {
-		this.sock.onopen = () => {
-			console.log("open");
-			f();
-		};
-	}
+  onOpen(f) {
+    this.sock.onopen = () => {
+      console.log('open');
+      f();
+    };
+  }
 
-	onClose(f) {
-		this.sock.onclose = () => {
-			console.log("close");
-			f();
-		};
-	}
+  onClose(f) {
+    this.sock.onclose = () => {
+      console.log('close');
+      f();
+    };
+  }
 
-	// call f with the message string as the first argument
-	onMessage(f) {
-		this.sock.onmessage = e => {
-			const obj = JSON.parse(e.data);
-			console.log(obj.type);
-			f(e.data);
-		};
-	}
+  // call f with the message string as the first argument
+  onMessage(f) {
+    this.sock.onmessage = (e) => {
+      const obj = JSON.parse(e.data);
+      console.log(obj.type);
+      f(e.data);
+    };
+  }
 };
diff --git a/tests/fixtures/historyapifallback-2-config/foo.js b/tests/fixtures/historyapifallback-2-config/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/historyapifallback-2-config/foo.js
+++ b/tests/fixtures/historyapifallback-2-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/historyapifallback-2-config/webpack.config.js b/tests/fixtures/historyapifallback-2-config/webpack.config.js
index 65cf2bf..386d693 100644
--- a/tests/fixtures/historyapifallback-2-config/webpack.config.js
+++ b/tests/fixtures/historyapifallback-2-config/webpack.config.js
@@ -1,14 +1,14 @@
-"use strict";
+'use strict';
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/historyapifallback-3-config/foo.js b/tests/fixtures/historyapifallback-3-config/foo.js
index aae7eee..c3ce0d5 100644
--- a/tests/fixtures/historyapifallback-3-config/foo.js
+++ b/tests/fixtures/historyapifallback-3-config/foo.js
@@ -1,5 +1,5 @@
-"use strict";
+'use strict';
 
-require("./bar.html");
+require('./bar.html');
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/historyapifallback-3-config/webpack.config.js b/tests/fixtures/historyapifallback-3-config/webpack.config.js
index 72825cb..6b019eb 100644
--- a/tests/fixtures/historyapifallback-3-config/webpack.config.js
+++ b/tests/fixtures/historyapifallback-3-config/webpack.config.js
@@ -1,29 +1,29 @@
-"use strict";
+'use strict';
 
 const moduleRuleForHTML = {
-	test: /\.html$/,
-	type: "asset/resource",
-	generator: {
-		filename: "index.html"
-	}
+  test: /\.html$/,
+  type: 'asset/resource',
+  generator: {
+    filename: 'index.html',
+  },
 };
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	module: {
-		rules: [
-			{
-				...moduleRuleForHTML
-			}
-		]
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  module: {
+    rules: [
+      {
+        ...moduleRuleForHTML,
+      },
+    ],
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/historyapifallback-config/foo.js b/tests/fixtures/historyapifallback-config/foo.js
index fa06808..c999595 100644
--- a/tests/fixtures/historyapifallback-config/foo.js
+++ b/tests/fixtures/historyapifallback-config/foo.js
@@ -1,6 +1,6 @@
-"use strict";
+'use strict';
 
-require("./index.html");
-require("./bar.html");
+require('./index.html');
+require('./bar.html');
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/historyapifallback-config/webpack.config.js b/tests/fixtures/historyapifallback-config/webpack.config.js
index 25ab1d4..43a4208 100644
--- a/tests/fixtures/historyapifallback-config/webpack.config.js
+++ b/tests/fixtures/historyapifallback-config/webpack.config.js
@@ -1,29 +1,29 @@
-"use strict";
+'use strict';
 
 const moduleRuleForHTML = {
-	test: /\.html$/,
-	type: "asset/resource",
-	generator: {
-		filename: "[name][ext]"
-	}
+  test: /\.html$/,
+  type: 'asset/resource',
+  generator: {
+    filename: '[name][ext]',
+  },
 };
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	module: {
-		rules: [
-			{
-				...moduleRuleForHTML
-			}
-		]
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  module: {
+    rules: [
+      {
+        ...moduleRuleForHTML,
+      },
+    ],
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/lazy-compilation-multiple-entries/one.js b/tests/fixtures/lazy-compilation-multiple-entries/one.js
index 3141da7..a12e778 100644
--- a/tests/fixtures/lazy-compilation-multiple-entries/one.js
+++ b/tests/fixtures/lazy-compilation-multiple-entries/one.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("One.");
+console.log('One.');
diff --git a/tests/fixtures/lazy-compilation-multiple-entries/two.js b/tests/fixtures/lazy-compilation-multiple-entries/two.js
index 0f719c9..395a8b3 100644
--- a/tests/fixtures/lazy-compilation-multiple-entries/two.js
+++ b/tests/fixtures/lazy-compilation-multiple-entries/two.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Two.");
+console.log('Two.');
diff --git a/tests/fixtures/lazy-compilation-multiple-entries/webpack.config.js b/tests/fixtures/lazy-compilation-multiple-entries/webpack.config.js
index f3d3055..75fdaf2 100644
--- a/tests/fixtures/lazy-compilation-multiple-entries/webpack.config.js
+++ b/tests/fixtures/lazy-compilation-multiple-entries/webpack.config.js
@@ -1,4 +1,4 @@
-"use strict";
+'use strict';
 
 const oneHTMLContent = `
 <!doctype html>
@@ -24,54 +24,54 @@ const twoHTMLContent = `
 `;
 
 module.exports = {
-	devtool: false,
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: {
-		one: "./one.js",
-		two: "./two.js"
-	},
-	output: {
-		path: "/"
-	},
-	experiments: {
-		lazyCompilation: true
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [
-		{
-			apply(compiler) {
-				const pluginName = "html-generator-plugin-test";
-				const oneFilename = "test-one.html";
-				const twoFilename = "test-two.html";
+  devtool: false,
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: {
+    one: './one.js',
+    two: './two.js',
+  },
+  output: {
+    path: '/',
+  },
+  experiments: {
+    lazyCompilation: true,
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [
+    {
+      apply(compiler) {
+        const pluginName = 'html-generator-plugin-test';
+        const oneFilename = 'test-one.html';
+        const twoFilename = 'test-two.html';
 
-				compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-					const { RawSource } = compiler.webpack.sources;
+        compiler.hooks.thisCompilation.tap(pluginName, (compilation) => {
+          const { RawSource } = compiler.webpack.sources;
 
-					compilation.hooks.processAssets.tap(
-						{
-							name: pluginName,
-							stage:
-								compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
-						},
-						() => {
-							const oneSource = new RawSource(oneHTMLContent);
+          compilation.hooks.processAssets.tap(
+            {
+              name: pluginName,
+              stage:
+                compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
+            },
+            () => {
+              const oneSource = new RawSource(oneHTMLContent);
 
-							compilation.emitAsset(oneFilename, oneSource);
+              compilation.emitAsset(oneFilename, oneSource);
 
-							const twoSource = new RawSource(twoHTMLContent);
+              const twoSource = new RawSource(twoHTMLContent);
 
-							compilation.emitAsset(twoFilename, twoSource);
-						}
-					);
-				});
-			}
-		}
-	]
+              compilation.emitAsset(twoFilename, twoSource);
+            },
+          );
+        });
+      },
+    },
+  ],
 };
diff --git a/tests/fixtures/lazy-compilation-single-entry/entry.js b/tests/fixtures/lazy-compilation-single-entry/entry.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/lazy-compilation-single-entry/entry.js
+++ b/tests/fixtures/lazy-compilation-single-entry/entry.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/lazy-compilation-single-entry/webpack.config.js b/tests/fixtures/lazy-compilation-single-entry/webpack.config.js
index bd5a502..e21fa10 100644
--- a/tests/fixtures/lazy-compilation-single-entry/webpack.config.js
+++ b/tests/fixtures/lazy-compilation-single-entry/webpack.config.js
@@ -1,4 +1,4 @@
-"use strict";
+'use strict';
 
 const HTMLContent = `
 <!doctype html>
@@ -13,46 +13,46 @@ const HTMLContent = `
 `;
 
 module.exports = {
-	devtool: false,
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./entry.js",
-	output: {
-		path: "/"
-	},
-	experiments: {
-		lazyCompilation: true
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [
-		{
-			apply(compiler) {
-				const pluginName = "html-generator-plugin-test";
-				const filename = "test.html";
+  devtool: false,
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './entry.js',
+  output: {
+    path: '/',
+  },
+  experiments: {
+    lazyCompilation: true,
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [
+    {
+      apply(compiler) {
+        const pluginName = 'html-generator-plugin-test';
+        const filename = 'test.html';
 
-				compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-					const { RawSource } = compiler.webpack.sources;
+        compiler.hooks.thisCompilation.tap(pluginName, (compilation) => {
+          const { RawSource } = compiler.webpack.sources;
 
-					compilation.hooks.processAssets.tap(
-						{
-							name: pluginName,
-							stage:
-								compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
-						},
-						() => {
-							const source = new RawSource(HTMLContent);
+          compilation.hooks.processAssets.tap(
+            {
+              name: pluginName,
+              stage:
+                compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
+            },
+            () => {
+              const source = new RawSource(HTMLContent);
 
-							compilation.emitAsset(filename, source);
-						}
-					);
-				});
-			}
-		}
-	]
+              compilation.emitAsset(filename, source);
+            },
+          );
+        });
+      },
+    },
+  ],
 };
diff --git a/tests/fixtures/mime-types-config/foo.js b/tests/fixtures/mime-types-config/foo.js
index 739d9bd..8545da9 100644
--- a/tests/fixtures/mime-types-config/foo.js
+++ b/tests/fixtures/mime-types-config/foo.js
@@ -1,5 +1,5 @@
-"use strict";
+'use strict';
 
-require("./file.custom");
+require('./file.custom');
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/mime-types-config/webpack.config.js b/tests/fixtures/mime-types-config/webpack.config.js
index b96e4e6..bfbff64 100644
--- a/tests/fixtures/mime-types-config/webpack.config.js
+++ b/tests/fixtures/mime-types-config/webpack.config.js
@@ -1,30 +1,30 @@
-"use strict";
+'use strict';
 
 const moduleRuleForCustom = {
-	test: /\.custom$/,
-	type: "asset/resource",
-	generator: {
-		filename: "[name][ext]"
-	}
+  test: /\.custom$/,
+  type: 'asset/resource',
+  generator: {
+    filename: '[name][ext]',
+  },
 };
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "warn"
-	},
-	module: {
-		rules: [
-			{
-				...moduleRuleForCustom
-			}
-		]
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'warn',
+  },
+  module: {
+    rules: [
+      {
+        ...moduleRuleForCustom,
+      },
+    ],
+  },
 };
diff --git a/tests/fixtures/module-federation-config/entry1.js b/tests/fixtures/module-federation-config/entry1.js
index dbd0f49..2f7d8f6 100644
--- a/tests/fixtures/module-federation-config/entry1.js
+++ b/tests/fixtures/module-federation-config/entry1.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-module.exports = "entry1";
+module.exports = 'entry1';
diff --git a/tests/fixtures/module-federation-config/entry2.js b/tests/fixtures/module-federation-config/entry2.js
index 74f9bc5..1e5846d 100644
--- a/tests/fixtures/module-federation-config/entry2.js
+++ b/tests/fixtures/module-federation-config/entry2.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-module.exports = "entry2";
+module.exports = 'entry2';
diff --git a/tests/fixtures/module-federation-config/webpack.config.js b/tests/fixtures/module-federation-config/webpack.config.js
index d513196..41a0062 100644
--- a/tests/fixtures/module-federation-config/webpack.config.js
+++ b/tests/fixtures/module-federation-config/webpack.config.js
@@ -1,16 +1,16 @@
-"use strict";
+'use strict';
 
 module.exports = {
-	mode: "development",
-	target: "node",
-	stats: "none",
-	context: __dirname,
-	entry: ["./entry1.js", "./entry2.js"],
-	output: {
-		path: "/",
-		libraryTarget: "umd"
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  target: 'node',
+  stats: 'none',
+  context: __dirname,
+  entry: ['./entry1.js', './entry2.js'],
+  output: {
+    path: '/',
+    libraryTarget: 'umd',
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/module-federation-config/webpack.multi.config.js b/tests/fixtures/module-federation-config/webpack.multi.config.js
index de92d76..2ab8465 100644
--- a/tests/fixtures/module-federation-config/webpack.multi.config.js
+++ b/tests/fixtures/module-federation-config/webpack.multi.config.js
@@ -1,18 +1,18 @@
-"use strict";
+'use strict';
 
 module.exports = [
-	{
-		mode: "development",
-		target: "node",
-		context: __dirname,
-		stats: "none",
-		entry: ["./entry1.js", "./entry2.js"],
-		output: {
-			path: "/",
-			libraryTarget: "umd"
-		},
-		infrastructureLogging: {
-			level: "warn"
-		}
-	}
+  {
+    mode: 'development',
+    target: 'node',
+    context: __dirname,
+    stats: 'none',
+    entry: ['./entry1.js', './entry2.js'],
+    output: {
+      path: '/',
+      libraryTarget: 'umd',
+    },
+    infrastructureLogging: {
+      level: 'warn',
+    },
+  },
 ];
diff --git a/tests/fixtures/module-federation-config/webpack.object-entry.config.js b/tests/fixtures/module-federation-config/webpack.object-entry.config.js
index 7bbc9e8..08a4f3e 100644
--- a/tests/fixtures/module-federation-config/webpack.object-entry.config.js
+++ b/tests/fixtures/module-federation-config/webpack.object-entry.config.js
@@ -1,19 +1,19 @@
-"use strict";
+'use strict';
 
 module.exports = {
-	mode: "development",
-	target: "node",
-	stats: "none",
-	context: __dirname,
-	entry: {
-		foo: "./entry1.js",
-		main: ["./entry1.js", "./entry2.js"]
-	},
-	output: {
-		path: "/",
-		libraryTarget: "umd"
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  target: 'node',
+  stats: 'none',
+  context: __dirname,
+  entry: {
+    foo: './entry1.js',
+    main: ['./entry1.js', './entry2.js'],
+  },
+  output: {
+    path: '/',
+    libraryTarget: 'umd',
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/module-federation-config/webpack.plugin.js b/tests/fixtures/module-federation-config/webpack.plugin.js
index f6ab0ed..421eb56 100644
--- a/tests/fixtures/module-federation-config/webpack.plugin.js
+++ b/tests/fixtures/module-federation-config/webpack.plugin.js
@@ -1,25 +1,25 @@
-"use strict";
+'use strict';
 
 const ModuleFederationPlugin =
-	require("@rspack/core").container.ModuleFederationPlugin;
+  require('@rspack/core').container.ModuleFederationPlugin;
 
 module.exports = {
-	mode: "development",
-	target: "node",
-	stats: "none",
-	context: __dirname,
-	entry: ["./entry1.js"],
-	plugins: [
-		new ModuleFederationPlugin({
-			name: "app1",
-			library: { type: "var", name: "app1" },
-			filename: "remoteEntry.js",
-			exposes: {
-				"./entry1": "./entry1"
-			}
-		})
-	],
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  target: 'node',
+  stats: 'none',
+  context: __dirname,
+  entry: ['./entry1.js'],
+  plugins: [
+    new ModuleFederationPlugin({
+      name: 'app1',
+      library: { type: 'var', name: 'app1' },
+      filename: 'remoteEntry.js',
+      exposes: {
+        './entry1': './entry1',
+      },
+    }),
+  ],
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/multi-compiler-one-configuration/foo.js b/tests/fixtures/multi-compiler-one-configuration/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/multi-compiler-one-configuration/foo.js
+++ b/tests/fixtures/multi-compiler-one-configuration/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/multi-compiler-one-configuration/webpack.config.js b/tests/fixtures/multi-compiler-one-configuration/webpack.config.js
index 11e40ee..f5afc31 100644
--- a/tests/fixtures/multi-compiler-one-configuration/webpack.config.js
+++ b/tests/fixtures/multi-compiler-one-configuration/webpack.config.js
@@ -1,24 +1,24 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = [
-	{
-		target: "web",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		entry: "./foo.js",
-		output: {
-			path: "/"
-		},
-		node: false,
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		},
-		plugins: [new HTMLGeneratorPlugin()]
-	}
+  {
+    target: 'web',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    entry: './foo.js',
+    output: {
+      path: '/',
+    },
+    node: false,
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+  },
 ];
diff --git a/tests/fixtures/multi-compiler-two-configurations/one.js b/tests/fixtures/multi-compiler-two-configurations/one.js
index 5765483..7b919d2 100644
--- a/tests/fixtures/multi-compiler-two-configurations/one.js
+++ b/tests/fixtures/multi-compiler-two-configurations/one.js
@@ -1,5 +1,5 @@
-"use strict";
+'use strict';
 
-console.log("one");
+console.log('one');
 // comment
 // comment
diff --git a/tests/fixtures/multi-compiler-two-configurations/two.js b/tests/fixtures/multi-compiler-two-configurations/two.js
index 83bf26e..168f5c0 100644
--- a/tests/fixtures/multi-compiler-two-configurations/two.js
+++ b/tests/fixtures/multi-compiler-two-configurations/two.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("two");
+console.log('two');
diff --git a/tests/fixtures/multi-compiler-two-configurations/webpack.config.js b/tests/fixtures/multi-compiler-two-configurations/webpack.config.js
index 0d3aa41..defdddb 100644
--- a/tests/fixtures/multi-compiler-two-configurations/webpack.config.js
+++ b/tests/fixtures/multi-compiler-two-configurations/webpack.config.js
@@ -1,44 +1,44 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = [
-	{
-		target: "web",
-		name: "one",
-		mode: "development",
-		context: __dirname,
-		entry: "./one.js",
-		stats: "none",
-		output: {
-			path: "/",
-			filename: "one-[name].js"
-		},
-		plugins: [new HTMLGeneratorPlugin()],
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		}
-	},
-	{
-		target: "web",
-		name: "two",
-		mode: "development",
-		context: __dirname,
-		entry: "./two.js",
-		stats: "none",
-		output: {
-			path: "/",
-			filename: "two-[name].js"
-		},
-		plugins: [new HTMLGeneratorPlugin()],
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		}
-	}
+  {
+    target: 'web',
+    name: 'one',
+    mode: 'development',
+    context: __dirname,
+    entry: './one.js',
+    stats: 'none',
+    output: {
+      path: '/',
+      filename: 'one-[name].js',
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+  },
+  {
+    target: 'web',
+    name: 'two',
+    mode: 'development',
+    context: __dirname,
+    entry: './two.js',
+    stats: 'none',
+    output: {
+      path: '/',
+      filename: 'two-[name].js',
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+  },
 ];
diff --git a/tests/fixtures/multi-public-path-config/bar.js b/tests/fixtures/multi-public-path-config/bar.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/multi-public-path-config/bar.js
+++ b/tests/fixtures/multi-public-path-config/bar.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/multi-public-path-config/baz.js b/tests/fixtures/multi-public-path-config/baz.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/multi-public-path-config/baz.js
+++ b/tests/fixtures/multi-public-path-config/baz.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/multi-public-path-config/foo.js b/tests/fixtures/multi-public-path-config/foo.js
index d2f0aa5..9ec0133 100644
--- a/tests/fixtures/multi-public-path-config/foo.js
+++ b/tests/fixtures/multi-public-path-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-require("./test.html");
+require('./test.html');
diff --git a/tests/fixtures/multi-public-path-config/webpack.config.js b/tests/fixtures/multi-public-path-config/webpack.config.js
index d7ae858..e8b4c4f 100644
--- a/tests/fixtures/multi-public-path-config/webpack.config.js
+++ b/tests/fixtures/multi-public-path-config/webpack.config.js
@@ -1,62 +1,62 @@
-"use strict";
+'use strict';
 
-const path = require("path");
+const path = require('path');
 
 const moduleRuleForHTML = {
-	test: /\.html$/,
-	type: "asset/resource",
-	generator: {
-		filename: "path/to/file.html"
-	}
+  test: /\.html$/,
+  type: 'asset/resource',
+  generator: {
+    filename: 'path/to/file.html',
+  },
 };
 
 module.exports = [
-	{
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		entry: "./foo.js",
-		output: {
-			path: __dirname,
-			filename: "foo.js",
-			publicPath: "/bundle1/"
-		},
-		infrastructureLogging: {
-			level: "warn"
-		},
-		module: {
-			rules: [
-				{
-					...moduleRuleForHTML
-				}
-			]
-		}
-	},
-	{
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		entry: "./bar.js",
-		output: {
-			path: path.join(__dirname, "named"),
-			filename: "bar.js",
-			publicPath: "/bundle2/"
-		},
-		name: "named",
-		infrastructureLogging: {
-			level: "warn"
-		}
-	},
-	{
-		mode: "development",
-		context: __dirname,
-		entry: "./bar.js",
-		output: {
-			path: path.join(__dirname, "dist"),
-			filename: "bar.js",
-			publicPath: "auto"
-		},
-		name: "other",
-		stats: false
-	}
+  {
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    entry: './foo.js',
+    output: {
+      path: __dirname,
+      filename: 'foo.js',
+      publicPath: '/bundle1/',
+    },
+    infrastructureLogging: {
+      level: 'warn',
+    },
+    module: {
+      rules: [
+        {
+          ...moduleRuleForHTML,
+        },
+      ],
+    },
+  },
+  {
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    entry: './bar.js',
+    output: {
+      path: path.join(__dirname, 'named'),
+      filename: 'bar.js',
+      publicPath: '/bundle2/',
+    },
+    name: 'named',
+    infrastructureLogging: {
+      level: 'warn',
+    },
+  },
+  {
+    mode: 'development',
+    context: __dirname,
+    entry: './bar.js',
+    output: {
+      path: path.join(__dirname, 'dist'),
+      filename: 'bar.js',
+      publicPath: 'auto',
+    },
+    name: 'other',
+    stats: false,
+  },
 ];
diff --git a/tests/fixtures/overlay-config/trusted-types.webpack.config.js b/tests/fixtures/overlay-config/trusted-types.webpack.config.js
index 5cfa4ec..ace51bc 100644
--- a/tests/fixtures/overlay-config/trusted-types.webpack.config.js
+++ b/tests/fixtures/overlay-config/trusted-types.webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/trusted-types-html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/trusted-types-html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/",
-		trustedTypes: { policyName: "webpack" }
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+    trustedTypes: { policyName: 'webpack' },
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/overlay-config/webpack.config.js b/tests/fixtures/overlay-config/webpack.config.js
index 16bae60..15ba781 100644
--- a/tests/fixtures/overlay-config/webpack.config.js
+++ b/tests/fixtures/overlay-config/webpack.config.js
@@ -1,20 +1,20 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/provide-plugin-custom/foo.js b/tests/fixtures/provide-plugin-custom/foo.js
index 12f6908..fac66df 100644
--- a/tests/fixtures/provide-plugin-custom/foo.js
+++ b/tests/fixtures/provide-plugin-custom/foo.js
@@ -1,7 +1,7 @@
-"use strict";
+'use strict';
 
 // 'npm run prepare' must be run for this to work during testing
-const CustomClient = require("../custom-client/CustomSockJSClient");
+const CustomClient = require('../custom-client/CustomSockJSClient');
 
 window.expectedClient = CustomClient;
 // eslint-disable-next-line camelcase, no-undef
diff --git a/tests/fixtures/provide-plugin-custom/webpack.config.js b/tests/fixtures/provide-plugin-custom/webpack.config.js
index 3c235a7..3b34938 100644
--- a/tests/fixtures/provide-plugin-custom/webpack.config.js
+++ b/tests/fixtures/provide-plugin-custom/webpack.config.js
@@ -1,26 +1,26 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 /**
  * @type {import('@rspack/core').RspackOptions}
  */
 const config = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
 
 module.exports = config;
diff --git a/tests/fixtures/provide-plugin-default/foo.js b/tests/fixtures/provide-plugin-default/foo.js
index 538ae3e..9df333e 100644
--- a/tests/fixtures/provide-plugin-default/foo.js
+++ b/tests/fixtures/provide-plugin-default/foo.js
@@ -1,8 +1,8 @@
-"use strict";
+'use strict';
 
 // 'npm run prepare' must be run for this to work during testing
 const WebsocketClient =
-	require("webpack-dev-server/client/clients/WebSocketClient").default;
+  require('webpack-dev-server/client/clients/WebSocketClient').default;
 
 window.expectedClient = WebsocketClient;
 // eslint-disable-next-line camelcase, no-undef
diff --git a/tests/fixtures/provide-plugin-default/webpack.config.js b/tests/fixtures/provide-plugin-default/webpack.config.js
index 661a14d..ebcb7e1 100644
--- a/tests/fixtures/provide-plugin-default/webpack.config.js
+++ b/tests/fixtures/provide-plugin-default/webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/provide-plugin-sockjs-config/foo.js b/tests/fixtures/provide-plugin-sockjs-config/foo.js
index 3b43d16..c42116c 100644
--- a/tests/fixtures/provide-plugin-sockjs-config/foo.js
+++ b/tests/fixtures/provide-plugin-sockjs-config/foo.js
@@ -1,8 +1,8 @@
-"use strict";
+'use strict';
 
 // 'npm run prepare' must be run for this to work during testing
 const SockJSClient =
-	require("webpack-dev-server/client/clients/SockJSClient").default;
+  require('webpack-dev-server/client/clients/SockJSClient').default;
 
 window.expectedClient = SockJSClient;
 // eslint-disable-next-line camelcase, no-undef
diff --git a/tests/fixtures/provide-plugin-sockjs-config/webpack.config.js b/tests/fixtures/provide-plugin-sockjs-config/webpack.config.js
index 661a14d..ebcb7e1 100644
--- a/tests/fixtures/provide-plugin-sockjs-config/webpack.config.js
+++ b/tests/fixtures/provide-plugin-sockjs-config/webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/provide-plugin-ws-config/foo.js b/tests/fixtures/provide-plugin-ws-config/foo.js
index 538ae3e..9df333e 100644
--- a/tests/fixtures/provide-plugin-ws-config/foo.js
+++ b/tests/fixtures/provide-plugin-ws-config/foo.js
@@ -1,8 +1,8 @@
-"use strict";
+'use strict';
 
 // 'npm run prepare' must be run for this to work during testing
 const WebsocketClient =
-	require("webpack-dev-server/client/clients/WebSocketClient").default;
+  require('webpack-dev-server/client/clients/WebSocketClient').default;
 
 window.expectedClient = WebsocketClient;
 // eslint-disable-next-line camelcase, no-undef
diff --git a/tests/fixtures/provide-plugin-ws-config/webpack.config.js b/tests/fixtures/provide-plugin-ws-config/webpack.config.js
index 661a14d..ebcb7e1 100644
--- a/tests/fixtures/provide-plugin-ws-config/webpack.config.js
+++ b/tests/fixtures/provide-plugin-ws-config/webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/reload-config-2/foo.js b/tests/fixtures/reload-config-2/foo.js
index 37887d2..74895c9 100644
--- a/tests/fixtures/reload-config-2/foo.js
+++ b/tests/fixtures/reload-config-2/foo.js
@@ -1,4 +1,4 @@
-"use strict";
+'use strict';
 
 // eslint-disable-next-line import/no-unresolved
-require("./main.css");
+require('./main.css');
diff --git a/tests/fixtures/reload-config-2/webpack.config.js b/tests/fixtures/reload-config-2/webpack.config.js
index adb992f..8117f4d 100644
--- a/tests/fixtures/reload-config-2/webpack.config.js
+++ b/tests/fixtures/reload-config-2/webpack.config.js
@@ -1,29 +1,29 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	module: {
-		rules: [
-			{
-				test: /\.css$/,
-				use: [{ loader: "style-loader" }, { loader: "css-loader" }]
-			}
-		]
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
+      },
+    ],
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/reload-config/foo.js b/tests/fixtures/reload-config/foo.js
index 68ad7bd..b24a1da 100644
--- a/tests/fixtures/reload-config/foo.js
+++ b/tests/fixtures/reload-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-require("./main.css");
+require('./main.css');
diff --git a/tests/fixtures/reload-config/webpack.config.js b/tests/fixtures/reload-config/webpack.config.js
index f85af87..b41f604 100644
--- a/tests/fixtures/reload-config/webpack.config.js
+++ b/tests/fixtures/reload-config/webpack.config.js
@@ -1,28 +1,28 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	entry: "./foo.js",
-	stats: "none",
-	output: {
-		path: "/"
-	},
-	module: {
-		rules: [
-			{
-				test: /\.css$/,
-				use: [{ loader: "style-loader" }, { loader: "css-loader" }]
-			}
-		]
-	},
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  entry: './foo.js',
+  stats: 'none',
+  output: {
+    path: '/',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
+      },
+    ],
+  },
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/simple-config-other/foo.js b/tests/fixtures/simple-config-other/foo.js
index fc6e460..b5c3daa 100644
--- a/tests/fixtures/simple-config-other/foo.js
+++ b/tests/fixtures/simple-config-other/foo.js
@@ -1,5 +1,5 @@
-"use strict";
+'use strict';
 
 console.log(
-	"Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Long Line."
+  'Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Very Long Line.',
 );
diff --git a/tests/fixtures/simple-config-other/webpack.config.js b/tests/fixtures/simple-config-other/webpack.config.js
index 52a66fb..c6d889a 100644
--- a/tests/fixtures/simple-config-other/webpack.config.js
+++ b/tests/fixtures/simple-config-other/webpack.config.js
@@ -1,15 +1,15 @@
-"use strict";
+'use strict';
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/simple-config/foo.js b/tests/fixtures/simple-config/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/simple-config/foo.js
+++ b/tests/fixtures/simple-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/simple-config/webpack.config.js b/tests/fixtures/simple-config/webpack.config.js
index 661a14d..ebcb7e1 100644
--- a/tests/fixtures/simple-config/webpack.config.js
+++ b/tests/fixtures/simple-config/webpack.config.js
@@ -1,21 +1,21 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		path: "/"
-	},
-	node: false,
-	infrastructureLogging: {
-		level: "info",
-		stream: {
-			write: () => {}
-		}
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    path: '/',
+  },
+  node: false,
+  infrastructureLogging: {
+    level: 'info',
+    stream: {
+      write: () => {},
+    },
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/static-config/foo.js b/tests/fixtures/static-config/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/static-config/foo.js
+++ b/tests/fixtures/static-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/static-config/webpack.config.js b/tests/fixtures/static-config/webpack.config.js
index 7192876..887f165 100644
--- a/tests/fixtures/static-config/webpack.config.js
+++ b/tests/fixtures/static-config/webpack.config.js
@@ -1,14 +1,14 @@
-"use strict";
+'use strict';
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		publicPath: "/"
-	},
-	infrastructureLogging: {
-		level: "warn"
-	}
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    publicPath: '/',
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
 };
diff --git a/tests/fixtures/universal-compiler-config/browser.js b/tests/fixtures/universal-compiler-config/browser.js
index ddcebf2..43f1ef0 100644
--- a/tests/fixtures/universal-compiler-config/browser.js
+++ b/tests/fixtures/universal-compiler-config/browser.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hello from the browser");
+console.log('Hello from the browser');
diff --git a/tests/fixtures/universal-compiler-config/server.js b/tests/fixtures/universal-compiler-config/server.js
index 3dfb585..20b3c33 100644
--- a/tests/fixtures/universal-compiler-config/server.js
+++ b/tests/fixtures/universal-compiler-config/server.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hello from the server");
+console.log('Hello from the server');
diff --git a/tests/fixtures/universal-compiler-config/webpack.config.js b/tests/fixtures/universal-compiler-config/webpack.config.js
index 1ddc7f2..cbc6890 100644
--- a/tests/fixtures/universal-compiler-config/webpack.config.js
+++ b/tests/fixtures/universal-compiler-config/webpack.config.js
@@ -1,43 +1,43 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = [
-	{
-		name: "browser",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		entry: "./browser.js",
-		output: {
-			path: "/",
-			filename: "browser.js"
-		},
-		plugins: [new HTMLGeneratorPlugin()],
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		}
-	},
-	{
-		name: "server",
-		mode: "development",
-		context: __dirname,
-		target: "node",
-		stats: "none",
-		entry: "./server.js",
-		output: {
-			path: "/",
-			filename: "server.js"
-		},
-		plugins: [new HTMLGeneratorPlugin()],
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		}
-	}
+  {
+    name: 'browser',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    entry: './browser.js',
+    output: {
+      path: '/',
+      filename: 'browser.js',
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+  },
+  {
+    name: 'server',
+    mode: 'development',
+    context: __dirname,
+    target: 'node',
+    stats: 'none',
+    entry: './server.js',
+    output: {
+      path: '/',
+      filename: 'server.js',
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+  },
 ];
diff --git a/tests/fixtures/watch-files-config/foo.js b/tests/fixtures/watch-files-config/foo.js
index 3c915db..eab2653 100644
--- a/tests/fixtures/watch-files-config/foo.js
+++ b/tests/fixtures/watch-files-config/foo.js
@@ -1,3 +1,3 @@
-"use strict";
+'use strict';
 
-console.log("Hey.");
+console.log('Hey.');
diff --git a/tests/fixtures/watch-files-config/webpack.config.js b/tests/fixtures/watch-files-config/webpack.config.js
index 7df3e7e..b833452 100644
--- a/tests/fixtures/watch-files-config/webpack.config.js
+++ b/tests/fixtures/watch-files-config/webpack.config.js
@@ -1,17 +1,17 @@
-"use strict";
+'use strict';
 
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = {
-	mode: "development",
-	context: __dirname,
-	stats: "none",
-	entry: "./foo.js",
-	output: {
-		publicPath: "/"
-	},
-	infrastructureLogging: {
-		level: "warn"
-	},
-	plugins: [new HTMLGeneratorPlugin()]
+  mode: 'development',
+  context: __dirname,
+  stats: 'none',
+  entry: './foo.js',
+  output: {
+    publicPath: '/',
+  },
+  infrastructureLogging: {
+    level: 'warn',
+  },
+  plugins: [new HTMLGeneratorPlugin()],
 };
diff --git a/tests/fixtures/worker-config-dev-server-false/index.js b/tests/fixtures/worker-config-dev-server-false/index.js
index a3ca188..abd6600 100644
--- a/tests/fixtures/worker-config-dev-server-false/index.js
+++ b/tests/fixtures/worker-config-dev-server-false/index.js
@@ -1,7 +1,7 @@
-const myWorker = new Worker("./worker-bundle.js");
+const myWorker = new Worker('./worker-bundle.js');
 
-myWorker.onmessage = event => {
-	console.log(`Worker said: ${event.data}`);
+myWorker.onmessage = (event) => {
+  console.log(`Worker said: ${event.data}`);
 };
 
-myWorker.postMessage("message");
+myWorker.postMessage('message');
diff --git a/tests/fixtures/worker-config-dev-server-false/public/worker-bundle.js b/tests/fixtures/worker-config-dev-server-false/public/worker-bundle.js
index e9a1172..23b405f 100644
--- a/tests/fixtures/worker-config-dev-server-false/public/worker-bundle.js
+++ b/tests/fixtures/worker-config-dev-server-false/public/worker-bundle.js
@@ -1,7 +1,7 @@
 (() => {
-	postMessage("I'm working before postMessage");
+  postMessage("I'm working before postMessage");
 
-	onmessage = event => {
-		postMessage(`Message sent: ${event.data}`);
-	};
+  onmessage = (event) => {
+    postMessage(`Message sent: ${event.data}`);
+  };
 })();
diff --git a/tests/fixtures/worker-config-dev-server-false/webpack.config.js b/tests/fixtures/worker-config-dev-server-false/webpack.config.js
index 21cd4c3..fab7445 100644
--- a/tests/fixtures/worker-config-dev-server-false/webpack.config.js
+++ b/tests/fixtures/worker-config-dev-server-false/webpack.config.js
@@ -1,59 +1,59 @@
-const path = require("node:path");
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const path = require('node:path');
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = [
-	{
-		name: "app",
-		// dependencies: ["worker"],
-		devtool: false,
-		target: "web",
-		entry: "./index.js",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		output: {
-			path: path.resolve(__dirname, "./dist/")
-		},
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		},
-		plugins: [new HTMLGeneratorPlugin()],
-		experiments: {
-			rspackFuture: {
-				bundlerInfo: {
-					force: false
-				}
-			}
-		}
-	},
-	{
-		name: "worker",
-		devtool: false,
-		target: "webworker",
-		entry: "./worker.js",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		output: {
-			path: path.resolve(__dirname, "public"),
-			filename: "worker-bundle.js"
-		},
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		},
-		devServer: false,
-		experiments: {
-			rspackFuture: {
-				bundlerInfo: {
-					force: false
-				}
-			}
-		}
-	}
+  {
+    name: 'app',
+    // dependencies: ["worker"],
+    devtool: false,
+    target: 'web',
+    entry: './index.js',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    output: {
+      path: path.resolve(__dirname, './dist/'),
+    },
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+    experiments: {
+      rspackFuture: {
+        bundlerInfo: {
+          force: false,
+        },
+      },
+    },
+  },
+  {
+    name: 'worker',
+    devtool: false,
+    target: 'webworker',
+    entry: './worker.js',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    output: {
+      path: path.resolve(__dirname, 'public'),
+      filename: 'worker-bundle.js',
+    },
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+    devServer: false,
+    experiments: {
+      rspackFuture: {
+        bundlerInfo: {
+          force: false,
+        },
+      },
+    },
+  },
 ];
diff --git a/tests/fixtures/worker-config-dev-server-false/worker.js b/tests/fixtures/worker-config-dev-server-false/worker.js
index 9c632d7..e212af6 100644
--- a/tests/fixtures/worker-config-dev-server-false/worker.js
+++ b/tests/fixtures/worker-config-dev-server-false/worker.js
@@ -1,5 +1,5 @@
 postMessage("I'm working before postMessage");
 
-onmessage = event => {
-	postMessage(`Message sent: ${event.data}`);
+onmessage = (event) => {
+  postMessage(`Message sent: ${event.data}`);
 };
diff --git a/tests/fixtures/worker-config/index.js b/tests/fixtures/worker-config/index.js
index 3963f91..e9475a8 100644
--- a/tests/fixtures/worker-config/index.js
+++ b/tests/fixtures/worker-config/index.js
@@ -1,7 +1,7 @@
-const myWorker = new Worker("./worker.js");
+const myWorker = new Worker('./worker.js');
 
-myWorker.onmessage = event => {
-	console.log(`Worker said: ${event.data}`);
+myWorker.onmessage = (event) => {
+  console.log(`Worker said: ${event.data}`);
 };
 
-myWorker.postMessage("message");
+myWorker.postMessage('message');
diff --git a/tests/fixtures/worker-config/webpack.config.js b/tests/fixtures/worker-config/webpack.config.js
index d6ca350..dd37653 100644
--- a/tests/fixtures/worker-config/webpack.config.js
+++ b/tests/fixtures/worker-config/webpack.config.js
@@ -1,43 +1,43 @@
-const HTMLGeneratorPlugin = require("../../helpers/html-generator-plugin");
+const HTMLGeneratorPlugin = require('../../helpers/html-generator-plugin');
 
 module.exports = [
-	{
-		name: "app",
-		dependencies: ["worker"],
-		devtool: false,
-		target: "web",
-		entry: "./index.js",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		output: {
-			path: "/"
-		},
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		},
-		plugins: [new HTMLGeneratorPlugin()]
-	},
-	{
-		name: "worker",
-		devtool: false,
-		target: "webworker",
-		entry: "./worker.js",
-		mode: "development",
-		context: __dirname,
-		stats: "none",
-		output: {
-			path: "/",
-			filename: "worker.js"
-		},
-		infrastructureLogging: {
-			level: "info",
-			stream: {
-				write: () => {}
-			}
-		}
-	}
+  {
+    name: 'app',
+    dependencies: ['worker'],
+    devtool: false,
+    target: 'web',
+    entry: './index.js',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    output: {
+      path: '/',
+    },
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+    plugins: [new HTMLGeneratorPlugin()],
+  },
+  {
+    name: 'worker',
+    devtool: false,
+    target: 'webworker',
+    entry: './worker.js',
+    mode: 'development',
+    context: __dirname,
+    stats: 'none',
+    output: {
+      path: '/',
+      filename: 'worker.js',
+    },
+    infrastructureLogging: {
+      level: 'info',
+      stream: {
+        write: () => {},
+      },
+    },
+  },
 ];
diff --git a/tests/fixtures/worker-config/worker.js b/tests/fixtures/worker-config/worker.js
index 9c632d7..e212af6 100644
--- a/tests/fixtures/worker-config/worker.js
+++ b/tests/fixtures/worker-config/worker.js
@@ -1,5 +1,5 @@
 postMessage("I'm working before postMessage");
 
-onmessage = event => {
-	postMessage(`Message sent: ${event.data}`);
+onmessage = (event) => {
+  postMessage(`Message sent: ${event.data}`);
 };
diff --git a/tests/helpers/conditional-test.js b/tests/helpers/conditional-test.js
index 0677dd4..dac4e94 100644
--- a/tests/helpers/conditional-test.js
+++ b/tests/helpers/conditional-test.js
@@ -1,10 +1,10 @@
-const isWindows = process.platform === "win32";
+const isWindows = process.platform === 'win32';
 
 function skipTestOnWindows(reason) {
-	if (isWindows) {
-		test.skip(reason, () => {});
-	}
-	return isWindows;
+  if (isWindows) {
+    test.skip(reason, () => {});
+  }
+  return isWindows;
 }
 
 module.exports.skipTestOnWindows = skipTestOnWindows;
diff --git a/tests/helpers/custom-http.js b/tests/helpers/custom-http.js
index f24c3ed..b99d035 100644
--- a/tests/helpers/custom-http.js
+++ b/tests/helpers/custom-http.js
@@ -1,3 +1,3 @@
-const customHTTP = require("node:http");
+const customHTTP = require('node:http');
 
 module.exports = customHTTP;
diff --git a/tests/helpers/get-port.js b/tests/helpers/get-port.js
index 3fd99cf..5f8bbcb 100644
--- a/tests/helpers/get-port.js
+++ b/tests/helpers/get-port.js
@@ -4,8 +4,8 @@
  * The code structure is similar to get-port, but it searches
  * ports deterministically like portfinder
  */
-const net = require("node:net");
-const os = require("node:os");
+const net = require('node:net');
+const os = require('node:os');
 
 const minPort = 1024;
 const maxPort = 65_535;
@@ -14,22 +14,22 @@ const maxPort = 65_535;
  * @return {Set<string|undefined>}
  */
 const getLocalHosts = () => {
-	const interfaces = os.networkInterfaces();
+  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"]);
+  // 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);
-			}
-		}
-	}
+  for (const _interface of Object.values(interfaces)) {
+    if (_interface) {
+      for (const config of _interface) {
+        results.add(config.address);
+      }
+    }
+  }
 
-	return results;
+  return results;
 };
 
 /**
@@ -38,21 +38,21 @@ const getLocalHosts = () => {
  * @return {Promise<number>}
  */
 const checkAvailablePort = (basePort, host) =>
-	new Promise((resolve, reject) => {
-		const server = net.createServer();
-		server.unref();
-		server.on("error", reject);
+  new Promise((resolve, reject) => {
+    const server = net.createServer();
+    server.unref();
+    server.on('error', reject);
 
-		server.listen(basePort, host, () => {
-			// Next line should return AddressInfo because we're calling it after listen() and before close()
-			const { port } = /** @type {import("net").AddressInfo} */ (
-				server.address()
-			);
-			server.close(() => {
-				resolve(port);
-			});
-		});
-	});
+    server.listen(basePort, host, () => {
+      // Next line should return AddressInfo 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
@@ -60,28 +60,28 @@ const checkAvailablePort = (basePort, host) =>
  * @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;
-			}
-		}
-	}
+  /**
+   * 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;
+  return port;
 };
 
 /**
@@ -90,42 +90,42 @@ const getAvailablePort = async (port, hosts) => {
  * @return {Promise<number>}
  */
 async function getPorts(basePort, host) {
-	if (basePort < minPort || basePort > maxPort) {
-		throw new Error(`Port number must lie between ${minPort} and ${maxPort}`);
-	}
+  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
+  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;
-		}
-	}
+    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");
+  throw new Error('No available ports found');
 }
 
 module.exports = getPorts;
diff --git a/tests/helpers/global-setup-test.js b/tests/helpers/global-setup-test.js
index bc8ecbe..639a5db 100644
--- a/tests/helpers/global-setup-test.js
+++ b/tests/helpers/global-setup-test.js
@@ -1,36 +1,36 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
-const tcpPortUsed = require("tcp-port-used");
-const { webpackVersion } = require("@rspack/core/package.json");
-const ports = require("./ports-map");
+const tcpPortUsed = require('tcp-port-used');
+const { webpackVersion } = require('@rspack/core/package.json');
+const ports = require('./ports-map');
 
 // eslint-disable-next-line no-console
 console.log(`\n Running tests for webpack @${webpackVersion} \n`);
 
 async function validatePorts() {
-	const samples = [];
+  const samples = [];
 
-	for (const key of Object.keys(ports)) {
-		const value = ports[key];
-		const arr = Array.isArray(value) ? value : [value];
+  for (const key of Object.keys(ports)) {
+    const value = ports[key];
+    const arr = Array.isArray(value) ? value : [value];
 
-		for (const port of arr) {
-			const check = tcpPortUsed.check(port, "localhost").then(inUse => {
-				if (inUse) {
-					throw new Error(`${port} has already used. [${key}]`);
-				}
-			});
+    for (const port of arr) {
+      const check = tcpPortUsed.check(port, 'localhost').then((inUse) => {
+        if (inUse) {
+          throw new Error(`${port} has already used. [${key}]`);
+        }
+      });
 
-			samples.push(check);
-		}
-	}
+      samples.push(check);
+    }
+  }
 
-	try {
-		await Promise.all(samples);
-	} catch (e) {
-		// eslint-disable-next-line no-console
-		console.error(e);
-		process.exit(1);
-	}
+  try {
+    await Promise.all(samples);
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.error(e);
+    process.exit(1);
+  }
 }
 
 module.exports = validatePorts;
diff --git a/tests/helpers/html-generator-plugin.js b/tests/helpers/html-generator-plugin.js
index f77c9ef..8d0483c 100644
--- a/tests/helpers/html-generator-plugin.js
+++ b/tests/helpers/html-generator-plugin.js
@@ -12,7 +12,7 @@ const HTMLContentForIndex = `
 </html>
 `;
 
-const HTMLContentForAssets = assetName => `
+const HTMLContentForAssets = (assetName) => `
 <!DOCTYPE html>
 <html>
   <head>
@@ -40,41 +40,41 @@ const HTMLContentForTest = `
 `;
 
 module.exports = class HTMLGeneratorPlugin {
-	// eslint-disable-next-line class-methods-use-this
-	apply(compiler) {
-		const pluginName = "html-generator-plugin";
+  // eslint-disable-next-line class-methods-use-this
+  apply(compiler) {
+    const pluginName = 'html-generator-plugin';
 
-		compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-			const { RawSource } = compiler.webpack.sources;
+    compiler.hooks.thisCompilation.tap(pluginName, (compilation) => {
+      const { RawSource } = compiler.webpack.sources;
 
-			compilation.hooks.processAssets.tap(
-				{
-					name: pluginName,
-					stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
-				},
-				() => {
-					const indexSource = new RawSource(HTMLContentForIndex);
-					const testSource = new RawSource(HTMLContentForTest);
-					const assets = compilation.getAssets();
+      compilation.hooks.processAssets.tap(
+        {
+          name: pluginName,
+          stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
+        },
+        () => {
+          const indexSource = new RawSource(HTMLContentForIndex);
+          const testSource = new RawSource(HTMLContentForTest);
+          const assets = compilation.getAssets();
 
-					compilation.emitAsset("index.html", indexSource);
-					compilation.emitAsset("test.html", testSource);
+          compilation.emitAsset('index.html', indexSource);
+          compilation.emitAsset('test.html', testSource);
 
-					for (const asset of assets) {
-						const assetName = asset.name;
+          for (const asset of assets) {
+            const assetName = asset.name;
 
-						if (assetName !== "main.js" && assetName.endsWith(".js")) {
-							const assetSource = new RawSource(
-								HTMLContentForAssets(assetName)
-							);
-							compilation.emitAsset(
-								assetName.replace(".js", ".html"),
-								assetSource
-							);
-						}
-					}
-				}
-			);
-		});
-	}
+            if (assetName !== 'main.js' && assetName.endsWith('.js')) {
+              const assetSource = new RawSource(
+                HTMLContentForAssets(assetName),
+              );
+              compilation.emitAsset(
+                assetName.replace('.js', '.html'),
+                assetSource,
+              );
+            }
+          }
+        },
+      );
+    });
+  }
 };
diff --git a/tests/helpers/normalize-options.js b/tests/helpers/normalize-options.js
index 7aef078..b5e0c01 100644
--- a/tests/helpers/normalize-options.js
+++ b/tests/helpers/normalize-options.js
@@ -1,34 +1,34 @@
 function normalizeOptions(options) {
-	const normalizedOptions = {};
+  const normalizedOptions = {};
 
-	// eslint-disable-next-line guard-for-in
-	for (const propertyName in options) {
-		let value = options[propertyName];
+  // eslint-disable-next-line guard-for-in
+  for (const propertyName in options) {
+    let value = options[propertyName];
 
-		if (Array.isArray(value)) {
-			value = value.map(item => {
-				if (Buffer.isBuffer(item)) {
-					return "<Buffer>";
-				}
-				if (typeof item.pem !== "undefined" && Buffer.isBuffer(item.pem)) {
-					item.pem = "<Buffer>";
-				} else if (
-					typeof item.buf !== "undefined" &&
-					Buffer.isBuffer(item.buf)
-				) {
-					item.buf = "<Buffer>";
-				}
+    if (Array.isArray(value)) {
+      value = value.map((item) => {
+        if (Buffer.isBuffer(item)) {
+          return '<Buffer>';
+        }
+        if (typeof item.pem !== 'undefined' && Buffer.isBuffer(item.pem)) {
+          item.pem = '<Buffer>';
+        } else if (
+          typeof item.buf !== 'undefined' &&
+          Buffer.isBuffer(item.buf)
+        ) {
+          item.buf = '<Buffer>';
+        }
 
-				return item;
-			});
-		} else if (Buffer.isBuffer(value)) {
-			value = "<Buffer>";
-		}
+        return item;
+      });
+    } else if (Buffer.isBuffer(value)) {
+      value = '<Buffer>';
+    }
 
-		normalizedOptions[propertyName] = value;
-	}
+    normalizedOptions[propertyName] = value;
+  }
 
-	return normalizedOptions;
+  return normalizedOptions;
 }
 
 module.exports = normalizeOptions;
diff --git a/tests/helpers/normalize.js b/tests/helpers/normalize.js
index 505d036..0f948e7 100644
--- a/tests/helpers/normalize.js
+++ b/tests/helpers/normalize.js
@@ -1,67 +1,67 @@
-const path = require("node:path");
+const path = require('node:path');
 
 const CURRENT_CWD = process.cwd();
-const ROOT = path.resolve(__dirname, "../../");
+const ROOT = path.resolve(__dirname, '../../');
 
-const CSS_LOADER = path.dirname(require.resolve("css-loader"));
+const CSS_LOADER = path.dirname(require.resolve('css-loader'));
 const RELATIVE_CSS_LOADER = path.relative(
-	path.dirname(
-		path.resolve(__dirname, "../fixtures/reload-config/webpack.config")
-	),
-	CSS_LOADER
+  path.dirname(
+    path.resolve(__dirname, '../fixtures/reload-config/webpack.config'),
+  ),
+  CSS_LOADER,
 );
-const RSPACK = path.dirname(require.resolve("@rspack/core/package.json"));
+const RSPACK = path.dirname(require.resolve('@rspack/core/package.json'));
 
-const rspack = require("@rspack/core");
-const RSPACK_MODULE = require.cache[require.resolve("@rspack/core")];
+const rspack = require('@rspack/core');
+const RSPACK_MODULE = require.cache[require.resolve('@rspack/core')];
 const TAPABLE = path.dirname(
-	RSPACK_MODULE.require.resolve("@rspack/lite-tapable")
+  RSPACK_MODULE.require.resolve('@rspack/lite-tapable'),
 );
 
-const normalize = str => {
-	let normalizedStr = str.replace(/(\\)+/g, "/");
+const normalize = (str) => {
+  let normalizedStr = str.replace(/(\\)+/g, '/');
 
-	normalizedStr = normalizedStr
-		.split(RSPACK.replace(/(\\)+/g, "/"))
-		.join("<rspack>");
+  normalizedStr = normalizedStr
+    .split(RSPACK.replace(/(\\)+/g, '/'))
+    .join('<rspack>');
 
-	normalizedStr = normalizedStr
-		.split(CSS_LOADER.replace(/(\\)+/g, "/"))
-		.join("<cssloader>");
+  normalizedStr = normalizedStr
+    .split(CSS_LOADER.replace(/(\\)+/g, '/'))
+    .join('<cssloader>');
 
-	normalizedStr = normalizedStr
-		.split(RELATIVE_CSS_LOADER.replace(/(\\)+/g, "/"))
-		.join("<cssloader>");
+  normalizedStr = normalizedStr
+    .split(RELATIVE_CSS_LOADER.replace(/(\\)+/g, '/'))
+    .join('<cssloader>');
 
-	normalizedStr = normalizedStr
-		.split(RELATIVE_CSS_LOADER.replace(/(\\)+/g, "/"))
-		.join("<cssloader>");
+  normalizedStr = normalizedStr
+    .split(RELATIVE_CSS_LOADER.replace(/(\\)+/g, '/'))
+    .join('<cssloader>');
 
-	normalizedStr = normalizedStr
-		.split(TAPABLE.replace(/(\\)+/g, "/"))
-		.join("<tapable>");
+  normalizedStr = normalizedStr
+    .split(TAPABLE.replace(/(\\)+/g, '/'))
+    .join('<tapable>');
 
-	normalizedStr = normalizedStr
-		.split(ROOT.replace(/(\\)+/g, "/"))
-		.join("<root>");
+  normalizedStr = normalizedStr
+    .split(ROOT.replace(/(\\)+/g, '/'))
+    .join('<root>');
 
-	normalizedStr = normalizedStr
-		.split(CURRENT_CWD.replace(/(\\)+/g, "/"))
-		.join("<cwd>");
+  normalizedStr = normalizedStr
+    .split(CURRENT_CWD.replace(/(\\)+/g, '/'))
+    .join('<cwd>');
 
-	normalizedStr = normalizedStr.replace(/:\d+:\d+/g, ":<line>:<row>");
-	normalizedStr = normalizedStr.replace(
-		/@@ -\d+,\d+ \+\d+,\d+ @@/g,
-		"@@ ... @@"
-	);
-	return normalizedStr;
+  normalizedStr = normalizedStr.replace(/:\d+:\d+/g, ':<line>:<row>');
+  normalizedStr = normalizedStr.replace(
+    /@@ -\d+,\d+ \+\d+,\d+ @@/g,
+    '@@ ... @@',
+  );
+  return normalizedStr;
 };
 
 expect.addSnapshotSerializer({
-	test(value) {
-		return typeof value === "string";
-	},
-	print(received) {
-		return normalize(received);
-	}
+  test(value) {
+    return typeof value === 'string';
+  },
+  print(received) {
+    return normalize(received);
+  },
 });
diff --git a/tests/helpers/ports-map.js b/tests/helpers/ports-map.js
index 2f5c2d4..f026844 100644
--- a/tests/helpers/ports-map.js
+++ b/tests/helpers/ports-map.js
@@ -1,84 +1,84 @@
 // important: new port mappings must be added to the bottom of this list
 const listOfTests = {
-	// CLI tests
-	"cli-basic": 1,
-	"cli-port-option": 1,
-	// e2e tests
-	bundle: 1,
-	"sockjs-client": 1,
-	"web-socket-client": 1,
-	"hot-and-live-reload": 1,
-	logging: 1,
-	overlay: 1,
-	progress: 1,
-	"server-and-client-transport": 1,
-	"web-socket-server-url": 2,
-	// integration tests
-	"module-federation": 1,
-	"multi-compiler": 1,
-	// unit tests
-	bonjour: 1,
-	"client-option": 1,
-	"compress-option": 1,
-	"headers-option": 1,
-	"history-api-fallback-option": 1,
-	"host-option": 1,
-	"hot-option": 1,
-	"http2-option": 1,
-	"https-option": 1,
-	"mime-types-option": 1,
-	"magic-html-option": 1,
-	"on-after-setup-middleware-option": 1,
-	"on-before-setup-middleware-option": 1,
-	"on-listening-option": 1,
-	"open-option": 1,
-	"port-option": 1,
-	"proxy-option": 4,
-	server: 1,
-	"setup-exit-signals-option": 1,
-	"static-directory-option": 1,
-	"static-public-path-option": 1,
-	"stats-option": 1,
-	"watch-files-option": 1,
-	"web-socket-server-option": 1,
-	"sockjs-server": 1,
-	"web-socket-server": 1,
-	routes: 1,
-	"web-socket-communication": 1,
-	ipc: 1,
-	stats: 1,
-	"cli-allowed-hosts": 1,
-	"cli-bonjour": 1,
-	"cli-client": 1,
-	"cli-colors": 1,
-	"cli-compress": 1,
-	"cli-history-api-fallback": 1,
-	"cli-host": 1,
-	"cli-hot": 1,
-	"cli-http2": 1,
-	"cli-https": 1,
-	"cli-live-reload": 1,
-	"cli-magic-html": 1,
-	"cli-open": 1,
-	"cli-static": 1,
-	"cli-watch-files": 1,
-	"cli-web-socket-server": 1,
-	target: 1,
-	entry: 1,
-	"allowed-hosts": 2,
-	host: 1,
-	api: 1,
-	"lazy-compilation": 1,
-	"range-header": 1,
-	port: 1,
-	"web-socket-server-test": 1,
-	"client-reconnect-option": 1,
-	"cli-server": 1,
-	"server-option": 1,
-	"normalize-option": 1,
-	"setup-middlewares-option": 1,
-	"options-request-response": 2,
-	app: 1
+  // CLI tests
+  'cli-basic': 1,
+  'cli-port-option': 1,
+  // e2e tests
+  bundle: 1,
+  'sockjs-client': 1,
+  'web-socket-client': 1,
+  'hot-and-live-reload': 1,
+  logging: 1,
+  overlay: 1,
+  progress: 1,
+  'server-and-client-transport': 1,
+  'web-socket-server-url': 2,
+  // integration tests
+  'module-federation': 1,
+  'multi-compiler': 1,
+  // unit tests
+  bonjour: 1,
+  'client-option': 1,
+  'compress-option': 1,
+  'headers-option': 1,
+  'history-api-fallback-option': 1,
+  'host-option': 1,
+  'hot-option': 1,
+  'http2-option': 1,
+  'https-option': 1,
+  'mime-types-option': 1,
+  'magic-html-option': 1,
+  'on-after-setup-middleware-option': 1,
+  'on-before-setup-middleware-option': 1,
+  'on-listening-option': 1,
+  'open-option': 1,
+  'port-option': 1,
+  'proxy-option': 4,
+  server: 1,
+  'setup-exit-signals-option': 1,
+  'static-directory-option': 1,
+  'static-public-path-option': 1,
+  'stats-option': 1,
+  'watch-files-option': 1,
+  'web-socket-server-option': 1,
+  'sockjs-server': 1,
+  'web-socket-server': 1,
+  routes: 1,
+  'web-socket-communication': 1,
+  ipc: 1,
+  stats: 1,
+  'cli-allowed-hosts': 1,
+  'cli-bonjour': 1,
+  'cli-client': 1,
+  'cli-colors': 1,
+  'cli-compress': 1,
+  'cli-history-api-fallback': 1,
+  'cli-host': 1,
+  'cli-hot': 1,
+  'cli-http2': 1,
+  'cli-https': 1,
+  'cli-live-reload': 1,
+  'cli-magic-html': 1,
+  'cli-open': 1,
+  'cli-static': 1,
+  'cli-watch-files': 1,
+  'cli-web-socket-server': 1,
+  target: 1,
+  entry: 1,
+  'allowed-hosts': 2,
+  host: 1,
+  api: 1,
+  'lazy-compilation': 1,
+  'range-header': 1,
+  port: 1,
+  'web-socket-server-test': 1,
+  'client-reconnect-option': 1,
+  'cli-server': 1,
+  'server-option': 1,
+  'normalize-option': 1,
+  'setup-middlewares-option': 1,
+  'options-request-response': 2,
+  app: 1,
 };
 
 let startPort = 8089;
@@ -86,34 +86,34 @@ let startPort = 8089;
 const ports = {};
 
 for (const key of Object.keys(listOfTests)) {
-	const value = listOfTests[key];
+  const value = listOfTests[key];
 
-	ports[key] =
-		value === 1
-			? // biome-ignore lint/suspicious/noAssignInExpressions: _
-				(startPort += 1)
-			: // biome-ignore lint/suspicious/noAssignInExpressions: _
-				[...new Array(value)].map(() => (startPort += 1));
+  ports[key] =
+    value === 1
+      ? // biome-ignore lint/suspicious/noAssignInExpressions: _
+        (startPort += 1)
+      : // biome-ignore lint/suspicious/noAssignInExpressions: _
+        [...new Array(value)].map(() => (startPort += 1));
 }
 
 const busy = {};
 
 module.exports = new Proxy(ports, {
-	get(target, name) {
-		if (!target[name]) {
-			throw new Error(
-				`Requested "${name}" port(s) for tests not found, please update "test/ports-map.js".`
-			);
-		}
+  get(target, name) {
+    if (!target[name]) {
+      throw new Error(
+        `Requested "${name}" port(s) for tests not found, please update "test/ports-map.js".`,
+      );
+    }
 
-		if (busy[name]) {
-			throw new Error(
-				`The "${name}" port is already in use in another test, please add a new one.`
-			);
-		}
+    if (busy[name]) {
+      throw new Error(
+        `The "${name}" port is already in use in another test, please add a new one.`,
+      );
+    }
 
-		busy[name] = true;
+    busy[name] = true;
 
-		return target[name];
-	}
+    return target[name];
+  },
 });
diff --git a/tests/helpers/puppeteer-constants.js b/tests/helpers/puppeteer-constants.js
index c877b7b..0cd16aa 100644
--- a/tests/helpers/puppeteer-constants.js
+++ b/tests/helpers/puppeteer-constants.js
@@ -1,51 +1,51 @@
 module.exports = {
-	reloadReadyDelay: 5000,
-	completeReloadDelay: 10000,
-	initConsoleDelay: 3000,
-	awaitServerCloseDelay: 1000,
-	beforeBrowserCloseDelay: 3000,
-	puppeteerArgs: [
-		"--disable-background-timer-throttling",
-		"--disable-breakpad",
-		"--disable-client-side-phishing-detection",
-		"--disable-cloud-import",
-		"--disable-default-apps",
-		"--disable-dev-shm-usage",
-		"--disable-extensions",
-		"--disable-gesture-typing",
-		"--disable-hang-monitor",
-		"--disable-infobars",
-		"--disable-notifications",
-		"--disable-offer-store-unmasked-wallet-cards",
-		"--disable-offer-upload-credit-cards",
-		"--disable-popup-blocking",
-		"--disable-print-preview",
-		"--disable-prompt-on-repost",
-		"--disable-setuid-sandbox",
-		"--disable-speech-api",
-		"--disable-sync",
-		"--disable-tab-for-desktop-share",
-		"--disable-translate",
-		"--disable-voice-input",
-		"--disable-wake-on-wifi",
-		"--enable-async-dns",
-		"--enable-simple-cache-backend",
-		"--enable-tcp-fast-open",
-		"--enable-webgl",
-		"--hide-scrollbars",
-		"--ignore-gpu-blacklist",
-		"--media-cache-size=33554432",
-		"--metrics-recording-only",
-		"--mute-audio",
-		"--no-default-browser-check",
-		"--no-first-run",
-		"--no-pings",
-		"--no-sandbox",
-		"--no-zygote",
-		"--password-store=basic",
-		"--prerender-from-omnibox=disabled",
-		"--use-gl=swiftshader",
-		"--use-mock-keychain",
-		"--disable-field-trial-config"
-	]
+  reloadReadyDelay: 5000,
+  completeReloadDelay: 10000,
+  initConsoleDelay: 3000,
+  awaitServerCloseDelay: 1000,
+  beforeBrowserCloseDelay: 3000,
+  puppeteerArgs: [
+    '--disable-background-timer-throttling',
+    '--disable-breakpad',
+    '--disable-client-side-phishing-detection',
+    '--disable-cloud-import',
+    '--disable-default-apps',
+    '--disable-dev-shm-usage',
+    '--disable-extensions',
+    '--disable-gesture-typing',
+    '--disable-hang-monitor',
+    '--disable-infobars',
+    '--disable-notifications',
+    '--disable-offer-store-unmasked-wallet-cards',
+    '--disable-offer-upload-credit-cards',
+    '--disable-popup-blocking',
+    '--disable-print-preview',
+    '--disable-prompt-on-repost',
+    '--disable-setuid-sandbox',
+    '--disable-speech-api',
+    '--disable-sync',
+    '--disable-tab-for-desktop-share',
+    '--disable-translate',
+    '--disable-voice-input',
+    '--disable-wake-on-wifi',
+    '--enable-async-dns',
+    '--enable-simple-cache-backend',
+    '--enable-tcp-fast-open',
+    '--enable-webgl',
+    '--hide-scrollbars',
+    '--ignore-gpu-blacklist',
+    '--media-cache-size=33554432',
+    '--metrics-recording-only',
+    '--mute-audio',
+    '--no-default-browser-check',
+    '--no-first-run',
+    '--no-pings',
+    '--no-sandbox',
+    '--no-zygote',
+    '--password-store=basic',
+    '--prerender-from-omnibox=disabled',
+    '--use-gl=swiftshader',
+    '--use-mock-keychain',
+    '--disable-field-trial-config',
+  ],
 };
diff --git a/tests/helpers/run-browser.js b/tests/helpers/run-browser.js
index 48d5011..d55789f 100644
--- a/tests/helpers/run-browser.js
+++ b/tests/helpers/run-browser.js
@@ -1,5 +1,5 @@
-const puppeteer = require("puppeteer");
-const { puppeteerArgs } = require("./puppeteer-constants");
+const puppeteer = require('puppeteer');
+const { puppeteerArgs } = require('./puppeteer-constants');
 
 /**
  * @typedef {Object} RunBrowserResult
@@ -12,80 +12,80 @@ const { puppeteerArgs } = require("./puppeteer-constants");
  * @returns {Promise<RunBrowserResult>}
  */
 function runBrowser(config) {
-	return new Promise((resolve, reject) => {
-		/**
-		 * @type {import('puppeteer').Page}
-		 */
-		let page;
-		/**
-		 * @type {import('puppeteer').Browser}
-		 */
-		let browser;
+  return new Promise((resolve, reject) => {
+    /**
+     * @type {import('puppeteer').Page}
+     */
+    let page;
+    /**
+     * @type {import('puppeteer').Browser}
+     */
+    let browser;
 
-		puppeteer
-			.launch({
-				headless: "new",
-				// because of invalid localhost certificate
-				acceptInsecureCerts: true,
-				// args come from: https://github.com/alixaxel/chrome-aws-lambda/blob/master/source/index.js
-				args: puppeteerArgs
-			})
-			.then(launchedBrowser => {
-				browser = launchedBrowser;
+    puppeteer
+      .launch({
+        headless: 'new',
+        // because of invalid localhost certificate
+        acceptInsecureCerts: true,
+        // args come from: https://github.com/alixaxel/chrome-aws-lambda/blob/master/source/index.js
+        args: puppeteerArgs,
+      })
+      .then((launchedBrowser) => {
+        browser = launchedBrowser;
 
-				return runPage(launchedBrowser, config);
-			})
-			.then(newPage => {
-				page = newPage;
+        return runPage(launchedBrowser, config);
+      })
+      .then((newPage) => {
+        page = newPage;
 
-				resolve({ page, browser });
-			})
-			.catch(reject);
-	});
+        resolve({ page, browser });
+      })
+      .catch(reject);
+  });
 }
 
 function runPage(browser, config) {
-	/**
-	 * @type {import('puppeteer').Page}
-	 */
-	let page;
+  /**
+   * @type {import('puppeteer').Page}
+   */
+  let page;
 
-	const options = {
-		viewport: {
-			width: 500,
-			height: 500
-		},
-		userAgent: "",
-		...config
-	};
+  const options = {
+    viewport: {
+      width: 500,
+      height: 500,
+    },
+    userAgent: '',
+    ...config,
+  };
 
-	return Promise.resolve()
-		.then(() => browser.newPage())
-		.then(newPage => {
-			page = newPage;
-			page.emulate(options);
+  return Promise.resolve()
+    .then(() => browser.newPage())
+    .then((newPage) => {
+      page = newPage;
+      page.emulate(options);
 
-			return page.setRequestInterception(true);
-		})
-		.then(() => {
-			page.on("request", interceptedRequest => {
-				if (interceptedRequest.isInterceptResolutionHandled()) return;
-				if (interceptedRequest.url().includes("favicon.ico")) {
-					interceptedRequest.respond({
-						status: 200,
-						contentType: "image/png",
-						body: "Empty"
-					});
-				} else {
-					interceptedRequest.continue(
-						interceptedRequest.continueRequestOverrides(),
-						10
-					);
-				}
-			});
+      return page.setRequestInterception(true);
+    })
+    .then(() => {
+      page.on('request', (interceptedRequest) => {
+        if (interceptedRequest.isInterceptResolutionHandled()) return;
+        if (interceptedRequest.url().includes('favicon.ico')) {
+          interceptedRequest.respond({
+            status: 200,
+            contentType: 'image/png',
+            body: 'Empty',
+          });
+        } else {
+          interceptedRequest.continue(
+            interceptedRequest.continueRequestOverrides(),
+            10,
+          );
+        }
+      });
 
-			return page;
-		});
+      return page;
+    });
 }
 
 module.exports = runBrowser;
diff --git a/tests/helpers/sequencer.js b/tests/helpers/sequencer.js
index b813fa3..b59264d 100644
--- a/tests/helpers/sequencer.js
+++ b/tests/helpers/sequencer.js
@@ -1,10 +1,10 @@
-const Sequencer = require("@jest/test-sequencer").default;
+const Sequencer = require('@jest/test-sequencer').default;
 
 class NamedSequencer extends Sequencer {
-	sort(tests) {
-		const copyTests = [...tests];
-		return copyTests.sort((testA, testB) => (testA.path > testB.path ? 1 : -1));
-	}
+  sort(tests) {
+    const copyTests = [...tests];
+    return copyTests.sort((testA, testB) => (testA.path > testB.path ? 1 : -1));
+  }
 }
 
 module.exports = NamedSequencer;
diff --git a/tests/helpers/session-subscribe.js b/tests/helpers/session-subscribe.js
index c25f7f2..bc0c832 100644
--- a/tests/helpers/session-subscribe.js
+++ b/tests/helpers/session-subscribe.js
@@ -1,7 +1,7 @@
 module.exports = async function sessionSubscribe(session) {
-	session.on("sessionattached", s => {
-		sessionSubscribe(s);
-	});
-	session.send("Network.enable");
-	session.send("Runtime.runIfWaitingForDebugger");
+  session.on('sessionattached', (s) => {
+    sessionSubscribe(s);
+  });
+  session.send('Network.enable');
+  session.send('Runtime.runIfWaitingForDebugger');
 };
diff --git a/tests/helpers/snapshot-resolver.js b/tests/helpers/snapshot-resolver.js
index 5199cc6..f0c86c0 100644
--- a/tests/helpers/snapshot-resolver.js
+++ b/tests/helpers/snapshot-resolver.js
@@ -1,23 +1,23 @@
-const path = require("node:path");
-const webpack = require("@rspack/core");
+const path = require('node:path');
+const webpack = require('@rspack/core');
 
 const [webpackVersion] = webpack.version;
 const snapshotExtension = `.snap.webpack${webpackVersion}`;
 
 module.exports = {
-	resolveSnapshotPath: testPath =>
-		path.join(
-			path.dirname(testPath),
-			"__snapshots__",
-			`${path.basename(testPath)}${snapshotExtension}`
-		),
-	resolveTestPath: snapshotPath =>
-		snapshotPath
-			.replace(`${path.sep}__snapshots__`, "")
-			.slice(0, -snapshotExtension.length),
-	testPathForConsistencyCheck: path.join(
-		"consistency_check",
-		"__tests__",
-		"example.test.js"
-	)
+  resolveSnapshotPath: (testPath) =>
+    path.join(
+      path.dirname(testPath),
+      '__snapshots__',
+      `${path.basename(testPath)}${snapshotExtension}`,
+    ),
+  resolveTestPath: (snapshotPath) =>
+    snapshotPath
+      .replace(`${path.sep}__snapshots__`, '')
+      .slice(0, -snapshotExtension.length),
+  testPathForConsistencyCheck: path.join(
+    'consistency_check',
+    '__tests__',
+    'example.test.js',
+  ),
 };
diff --git a/tests/helpers/test-server.js b/tests/helpers/test-server.js
index a315913..dd62df9 100644
--- a/tests/helpers/test-server.js
+++ b/tests/helpers/test-server.js
@@ -1,93 +1,93 @@
-const webpack = require("@rspack/core");
-const { RspackDevServer: Server } = require("@rspack/dev-server");
+const webpack = require('@rspack/core');
+const { RspackDevServer: Server } = require('@rspack/dev-server');
 
 let server;
 
 // start server, returning the full setup of the server
 // (both the server and the compiler)
 function startFullSetup(config, options, done) {
-	// disable watching by default for tests
-	if (typeof options.static === "undefined") {
-		options.static = false;
-	} else if (options.static === null) {
-		// this provides a way of using the default static value
-		options.static = undefined;
-	}
-
-	const compiler = webpack(config);
-
-	server = new Server(options, compiler);
-
-	server.startCallback(error => {
-		if (error && done) {
-			return done(error);
-		}
-
-		if (done) {
-			done();
-		}
-	});
-
-	return {
-		server,
-		compiler
-	};
+  // disable watching by default for tests
+  if (typeof options.static === 'undefined') {
+    options.static = false;
+  } else if (options.static === null) {
+    // this provides a way of using the default static value
+    options.static = undefined;
+  }
+
+  const compiler = webpack(config);
+
+  server = new Server(options, compiler);
+
+  server.startCallback((error) => {
+    if (error && done) {
+      return done(error);
+    }
+
+    if (done) {
+      done();
+    }
+  });
+
+  return {
+    server,
+    compiler,
+  };
 }
 
 function startAwaitingCompilationFullSetup(config, options, done) {
-	let readyCount = 0;
+  let readyCount = 0;
 
-	const ready = error => {
-		if (error && done) {
-			done(error);
+  const ready = (error) => {
+    if (error && done) {
+      done(error);
 
-			return;
-		}
+      return;
+    }
 
-		readyCount += 1;
+    readyCount += 1;
 
-		if (readyCount === 2) {
-			done();
-		}
-	};
+    if (readyCount === 2) {
+      done();
+    }
+  };
 
-	const fullSetup = startFullSetup(config, options, ready);
+  const fullSetup = startFullSetup(config, options, ready);
 
-	// wait for compilation, since dev server can start before this
-	// https://github.com/webpack/webpack-dev-server/issues/847
-	fullSetup.compiler.hooks.done.tap("done", () => {
-		ready();
-	});
+  // wait for compilation, since dev server can start before this
+  // https://github.com/webpack/webpack-dev-server/issues/847
+  fullSetup.compiler.hooks.done.tap('done', () => {
+    ready();
+  });
 
-	return fullSetup;
+  return fullSetup;
 }
 
 function startAwaitingCompilation(config, options, done) {
-	return startAwaitingCompilationFullSetup(config, options, done).server;
+  return startAwaitingCompilationFullSetup(config, options, done).server;
 }
 
 function start(config, options, done) {
-	// I suspect that almost all tests need to wait for compilation to
-	// finish, because not doing so leaves open handles for jest,
-	// in the case where a compilation didn't finish before destroying
-	// the server and moving on. Thus, the default "start" should wait
-	// for compilation, and only special cases where you don't expect
-	// a compilation happen should use startBeforeCompilation
-	return startAwaitingCompilation(config, options, done);
+  // I suspect that almost all tests need to wait for compilation to
+  // finish, because not doing so leaves open handles for jest,
+  // in the case where a compilation didn't finish before destroying
+  // the server and moving on. Thus, the default "start" should wait
+  // for compilation, and only special cases where you don't expect
+  // a compilation happen should use startBeforeCompilation
+  return startAwaitingCompilation(config, options, done);
 }
 
 function close(done) {
-	if (server) {
-		server.stopCallback(() => {
-			server = null;
-			done();
-		});
-	} else {
-		done();
-	}
+  if (server) {
+    server.stopCallback(() => {
+      server = null;
+      done();
+    });
+  } else {
+    done();
+  }
 }
 
 module.exports = {
-	start,
-	close
+  start,
+  close,
 };
diff --git a/tests/helpers/trusted-types-html-generator-plugin.js b/tests/helpers/trusted-types-html-generator-plugin.js
index 22fa763..0a80580 100644
--- a/tests/helpers/trusted-types-html-generator-plugin.js
+++ b/tests/helpers/trusted-types-html-generator-plugin.js
@@ -34,47 +34,47 @@ const HTMLContentForTest = `
 `;
 
 module.exports = class HTMLGeneratorPlugin {
-	// eslint-disable-next-line class-methods-use-this
-	apply(compiler) {
-		const pluginName = "html-generator-plugin";
+  // eslint-disable-next-line class-methods-use-this
+  apply(compiler) {
+    const pluginName = 'html-generator-plugin';
 
-		compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-			if (compiler.webpack) {
-				const { RawSource } = compiler.webpack.sources;
+    compiler.hooks.thisCompilation.tap(pluginName, (compilation) => {
+      if (compiler.webpack) {
+        const { RawSource } = compiler.webpack.sources;
 
-				compilation.hooks.processAssets.tap(
-					{
-						name: pluginName,
-						stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
-					},
-					() => {
-						const indexSource = new RawSource(HTMLContentForIndex);
-						const testSource = new RawSource(HTMLContentForTest);
+        compilation.hooks.processAssets.tap(
+          {
+            name: pluginName,
+            stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
+          },
+          () => {
+            const indexSource = new RawSource(HTMLContentForIndex);
+            const testSource = new RawSource(HTMLContentForTest);
 
-						compilation.emitAsset("index.html", indexSource);
-						compilation.emitAsset("test.html", testSource);
-					}
-				);
-			} else {
-				compilation.hooks.additionalAssets.tap(pluginName, () => {
-					compilation.emitAsset("index.html", {
-						source() {
-							return HTMLContentForIndex;
-						},
-						size() {
-							return HTMLContentForIndex.length;
-						}
-					});
-					compilation.emitAsset("test.html", {
-						source() {
-							return HTMLContentForTest;
-						},
-						size() {
-							return HTMLContentForTest.length;
-						}
-					});
-				});
-			}
-		});
-	}
+            compilation.emitAsset('index.html', indexSource);
+            compilation.emitAsset('test.html', testSource);
+          },
+        );
+      } else {
+        compilation.hooks.additionalAssets.tap(pluginName, () => {
+          compilation.emitAsset('index.html', {
+            source() {
+              return HTMLContentForIndex;
+            },
+            size() {
+              return HTMLContentForIndex.length;
+            },
+          });
+          compilation.emitAsset('test.html', {
+            source() {
+              return HTMLContentForTest;
+            },
+            size() {
+              return HTMLContentForTest.length;
+            },
+          });
+        });
+      }
+    });
+  }
 };
diff --git a/tests/normalizeOptions.test.ts b/tests/normalizeOptions.test.ts
index ec52f6c..a8f8eba 100644
--- a/tests/normalizeOptions.test.ts
+++ b/tests/normalizeOptions.test.ts
@@ -1,183 +1,183 @@
-import { type RspackOptions, rspack } from "@rspack/core";
-import { type Configuration, RspackDevServer } from "@rspack/dev-server";
-import ReactRefreshPlugin from "@rspack/plugin-react-refresh";
+import { type RspackOptions, rspack } from '@rspack/core';
+import { type Configuration, RspackDevServer } from '@rspack/dev-server';
+import ReactRefreshPlugin from '@rspack/plugin-react-refresh';
 // @ts-expect-error
-import serializer from "jest-serializer-path";
-import customConfig from "./fixtures/provide-plugin-custom/webpack.config";
+import serializer from 'jest-serializer-path';
+import customConfig from './fixtures/provide-plugin-custom/webpack.config';
 
 expect.addSnapshotSerializer(serializer);
 
 // The aims of use a cutstom value rather than
 // default is to avoid stack overflow trigged
 // by `webpack/schemas/WebpackOption.check.js` in debug mode
-const ENTRY = "./placeholder.js";
-const ENTRY1 = "./placeholder1.js";
+const ENTRY = './placeholder.js';
+const ENTRY1 = './placeholder1.js';
 
 // TODO: node 20 works but node 18 and 16 failed
-describe.skip("normalize options snapshot", () => {
-	it("no options", async () => {
-		await match({});
-	});
+describe.skip('normalize options snapshot', () => {
+  it('no options', async () => {
+    await match({});
+  });
 
-	it("port string", async () => {
-		await match({
-			devServer: {
-				port: "9000"
-			}
-		});
-	});
+  it('port string', async () => {
+    await match({
+      devServer: {
+        port: '9000',
+      },
+    });
+  });
 
-	it("additional entires should added", async () => {
-		expect(
-			await getAdditionEntries({}, { entry: ["something"] })
-		).toMatchSnapshot();
-	});
+  it('additional entires should added', async () => {
+    expect(
+      await getAdditionEntries({}, { entry: ['something'] }),
+    ).toMatchSnapshot();
+  });
 
-	it("shouldn't have reactRefreshEntry.js by default when in production mode", async () => {
-		const reactRefreshEntry =
-			"plugin-react-refresh/client/reactRefreshEntry.js";
-		const entries1 = await getAdditionEntries(
-			{},
-			{
-				mode: "production",
-				entry: ["something"]
-			}
-		);
-		expect(entries1.undefined).not.toContain(reactRefreshEntry);
-		const entries2 = await getAdditionEntries(
-			{},
-			{
-				mode: "production",
-				entry: ["something"],
-				plugins: [new ReactRefreshPlugin({ forceEnable: true })]
-			}
-		);
-		expect(entries2.undefined).toContain(reactRefreshEntry);
-		const entries3 = await getAdditionEntries(
-			{},
-			{
-				mode: "development",
-				entry: ["something"],
-				plugins: [new ReactRefreshPlugin()]
-			}
-		);
-		expect(entries3.undefined).toContain(reactRefreshEntry);
-		const entries4 = await getAdditionEntries(
-			{},
-			{
-				mode: "production",
-				entry: ["something"],
-				plugins: [new ReactRefreshPlugin()]
-			}
-		);
-		expect(entries4.undefined).not.toContain(reactRefreshEntry);
-	});
+  it("shouldn't have reactRefreshEntry.js by default when in production mode", async () => {
+    const reactRefreshEntry =
+      'plugin-react-refresh/client/reactRefreshEntry.js';
+    const entries1 = await getAdditionEntries(
+      {},
+      {
+        mode: 'production',
+        entry: ['something'],
+      },
+    );
+    expect(entries1.undefined).not.toContain(reactRefreshEntry);
+    const entries2 = await getAdditionEntries(
+      {},
+      {
+        mode: 'production',
+        entry: ['something'],
+        plugins: [new ReactRefreshPlugin({ forceEnable: true })],
+      },
+    );
+    expect(entries2.undefined).toContain(reactRefreshEntry);
+    const entries3 = await getAdditionEntries(
+      {},
+      {
+        mode: 'development',
+        entry: ['something'],
+        plugins: [new ReactRefreshPlugin()],
+      },
+    );
+    expect(entries3.undefined).toContain(reactRefreshEntry);
+    const entries4 = await getAdditionEntries(
+      {},
+      {
+        mode: 'production',
+        entry: ['something'],
+        plugins: [new ReactRefreshPlugin()],
+      },
+    );
+    expect(entries4.undefined).not.toContain(reactRefreshEntry);
+  });
 
-	it("should apply HMR plugin by default", async () => {
-		const compiler = rspack({
-			entry: ENTRY,
-			stats: "none"
-		});
-		const server = new RspackDevServer({}, compiler);
-		await server.start();
-		const hmrPlugins = compiler.__internal__builtinPlugins.filter(
-			p => p.name === "HotModuleReplacementPlugin"
-		);
-		expect(hmrPlugins.length).toBe(1);
-		expect(server.options.hot).toBe(true);
-		await server.stop();
-	});
+  it('should apply HMR plugin by default', async () => {
+    const compiler = rspack({
+      entry: ENTRY,
+      stats: 'none',
+    });
+    const server = new RspackDevServer({}, compiler);
+    await server.start();
+    const hmrPlugins = compiler.__internal__builtinPlugins.filter(
+      (p) => p.name === 'HotModuleReplacementPlugin',
+    );
+    expect(hmrPlugins.length).toBe(1);
+    expect(server.options.hot).toBe(true);
+    await server.stop();
+  });
 
-	it("should support multi-compiler", async () => {
-		const compiler = rspack([
-			{
-				entry: ENTRY,
-				stats: "none"
-			},
-			{
-				entry: ENTRY1,
-				stats: "none"
-			}
-		]);
-		const server = new RspackDevServer({}, compiler);
-		await server.start();
-		await server.stop();
-	});
+  it('should support multi-compiler', async () => {
+    const compiler = rspack([
+      {
+        entry: ENTRY,
+        stats: 'none',
+      },
+      {
+        entry: ENTRY1,
+        stats: 'none',
+      },
+    ]);
+    const server = new RspackDevServer({}, compiler);
+    await server.start();
+    await server.stop();
+  });
 
-	it("should support custom client transport", async () => {
-		const compiler = rspack(customConfig);
-		const devServerOptions = {
-			client: {
-				webSocketTransport: require.resolve(
-					"./fixtures/custom-client/CustomSockJSClient"
-				)
-			},
-			webSocketServer: "sockjs"
-		};
-		const server = new RspackDevServer(devServerOptions, compiler);
-		await server.start();
-		await server.stop();
-	});
+  it('should support custom client transport', async () => {
+    const compiler = rspack(customConfig);
+    const devServerOptions = {
+      client: {
+        webSocketTransport: require.resolve(
+          './fixtures/custom-client/CustomSockJSClient',
+        ),
+      },
+      webSocketServer: 'sockjs',
+    };
+    const server = new RspackDevServer(devServerOptions, compiler);
+    await server.start();
+    await server.stop();
+  });
 });
 
 async function match(config: RspackOptions) {
-	const compiler = rspack({
-		...config,
-		entry: ENTRY,
-		stats: "none"
-	});
-	const server = new RspackDevServer(
-		compiler.options.devServer ?? {},
-		compiler
-	);
-	await server.start();
-	// it will break ci
-	//@ts-ignore
-	server.options.port = undefined;
-	expect(server.options).toMatchSnapshot();
-	await server.stop();
+  const compiler = rspack({
+    ...config,
+    entry: ENTRY,
+    stats: 'none',
+  });
+  const server = new RspackDevServer(
+    compiler.options.devServer ?? {},
+    compiler,
+  );
+  await server.start();
+  // it will break ci
+  //@ts-ignore
+  server.options.port = undefined;
+  expect(server.options).toMatchSnapshot();
+  await server.stop();
 }
 
 async function getAdditionEntries(
-	serverConfig: Configuration,
-	config: RspackOptions
+  serverConfig: Configuration,
+  config: RspackOptions,
 ) {
-	const compiler = rspack({
-		...config,
-		stats: "none",
-		entry: ENTRY
-	});
+  const compiler = rspack({
+    ...config,
+    stats: 'none',
+    entry: ENTRY,
+  });
 
-	const server = new RspackDevServer(serverConfig, compiler);
-	await server.start();
-	const entries = compiler.__internal__builtinPlugins
-		.filter(p => p.name === "EntryPlugin")
-		.map(p => p.options)
-		// biome-ignore lint/suspicious/noExplicitAny: _
-		.reduce<Record<string, any>>((acc: any, cur: any) => {
-			const name = cur.options.name;
-			const request = cur.entry;
-			if (acc[name]) {
-				acc[name].import.push(request);
-			} else {
-				acc[name] = { import: [request] };
-			}
-			return acc;
-		}, {});
-	// some hack for snapshot
-	const value = Object.fromEntries(
-		Object.entries(entries).map(([key, item]) => {
-			// @ts-expect-error
-			const replaced = item.import?.map(entry => {
-				const array = entry
-					.replace(/\\/g, "/")
-					.replace(/port=\d+/g, "")
-					.split("/");
-				return `<prefix>/${array.slice(-3).join("/")}`;
-			});
-			return [key, replaced];
-		})
-	);
-	await server.stop();
-	return value;
+  const server = new RspackDevServer(serverConfig, compiler);
+  await server.start();
+  const entries = compiler.__internal__builtinPlugins
+    .filter((p) => p.name === 'EntryPlugin')
+    .map((p) => p.options)
+    // biome-ignore lint/suspicious/noExplicitAny: _
+    .reduce<Record<string, any>>((acc: any, cur: any) => {
+      const name = cur.options.name;
+      const request = cur.entry;
+      if (acc[name]) {
+        acc[name].import.push(request);
+      } else {
+        acc[name] = { import: [request] };
+      }
+      return acc;
+    }, {});
+  // some hack for snapshot
+  const value = Object.fromEntries(
+    Object.entries(entries).map(([key, item]) => {
+      // @ts-expect-error
+      const replaced = item.import?.map((entry) => {
+        const array = entry
+          .replace(/\\/g, '/')
+          .replace(/port=\d+/g, '')
+          .split('/');
+        return `<prefix>/${array.slice(-3).join('/')}`;
+      });
+      return [key, replaced];
+    }),
+  );
+  await server.stop();
+  return value;
 }