refactor(typescript): increase typescript type coverage to 100% for rspack-plugin-react-refresh

packages/rspack-plugin-react-refresh/src/index.ts

@@ -1,35 +1,30 @@
 import path from "node:path";
-import type { Compiler } from "@rspack/core";
-import {
-	type NormalizedPluginOptions,
-	type PluginOptions,
-	normalizeOptions
-} from "./options";
+import { normalizeOptions } from "./options";
 import { getAdditionalEntries } from "./utils/getAdditionalEntries";
-import getSocketIntegration from "./utils/getSocketIntegration";
+import { getSocketIntegration } from "./utils/getSocketIntegration";
+
+import type { Compiler } from "@rspack/core";
+import type { NormalizedPluginOptions, PluginOptions } from "./options";
 
 export type { PluginOptions };
 
 const reactRefreshPath = require.resolve("../client/reactRefresh.js");
 const reactRefreshEntryPath = require.resolve("../client/reactRefreshEntry.js");
+
 const refreshUtilsPath = require.resolve("../client/refreshUtils.js");
 const refreshRuntimeDirPath = path.dirname(
 	require.resolve("react-refresh", {
 		paths: [reactRefreshPath]
 	})
 );
+
 const runtimePaths = [
 	reactRefreshEntryPath,
 	reactRefreshPath,
 	refreshUtilsPath,
 	refreshRuntimeDirPath
 ];
 
-/**
- * @typedef {Object} Options
- * @property {(string | RegExp | (string | RegExp)[] | null)=} include included resourcePath for loader
- * @property {(string | RegExp | (string | RegExp)[] | null)=} exclude excluded resourcePath for loader
- */
 class ReactRefreshRspackPlugin {
 	options: NormalizedPluginOptions;
 

packages/rspack-plugin-react-refresh/src/sockets/WDSSocket.ts

@@ -1,6 +1,6 @@
 /**
  * The following code is modified based on
- * https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/f1c8b9a44198449093ca95f85af5df97925e1cfc/sockets/WPSSocket.js
+ * https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/f1c8b9a44198449093ca95f85af5df97925e1cfc/sockets/WDSSocket.js
  *
  * MIT Licensed
  * Author Michael Mok
@@ -10,33 +10,36 @@
 import getSocketUrlParts from "./utils/getSocketUrlParts";
 import getUrlFromParts from "./utils/getUrlFromParts";
 import getWDSMetadata from "./utils/getWDSMetadata";
+import type { SocketClient } from "./utils/getWDSMetadata";
 
 declare global {
-	var __webpack_dev_server_client__: any;
+	var __webpack_dev_server_client__: SocketClient | { default: SocketClient };
 }
 
 /**
  * Initializes a socket server for HMR for webpack-dev-server.
- * @param {function(*): void} messageHandler A handler to consume Webpack compilation messages.
- * @param {string} [resourceQuery] Webpack's `__resourceQuery` string.
- * @returns {void}
+ * @param messageHandler A handler to consume Webpack compilation messages.
+ * @param resourceQuery Webpack's `__resourceQuery` string.
+ * @returns
  */
 export function init(
 	messageHandler: (...args: any[]) => void,
 	resourceQuery: string
 ) {
 	if (typeof __webpack_dev_server_client__ !== "undefined") {
-		let SocketClient = __webpack_dev_server_client__;
-		if (typeof __webpack_dev_server_client__.default !== "undefined") {
+		let SocketClient: SocketClient;
+
+		if ("default" in __webpack_dev_server_client__) {
 			SocketClient = __webpack_dev_server_client__.default;
+		} else {
+			SocketClient = __webpack_dev_server_client__;
 		}
 
 		const wdsMeta = getWDSMetadata(SocketClient);
 		const urlParts = getSocketUrlParts(resourceQuery, wdsMeta);
 
 		const connection = new SocketClient(getUrlFromParts(urlParts, wdsMeta));
 
-		// @ts-expect-error -- ignore
 		connection.onMessage(function onSocketMessage(data) {
 			const message = JSON.parse(data);
 			messageHandler(message);

packages/rspack-plugin-react-refresh/src/sockets/utils/getCurrentScriptSource.ts

@@ -10,10 +10,10 @@ export default function getCurrentScriptSource() {
 	}
 	// Fallback to getting all scripts running in the document,
 	// and finding the last one injected.
-	const scriptElementsWithSrc = Array.prototype.filter.call(
-		(document as Document).scripts || [],
-		elem => elem.getAttribute("src")
-	);
+	const scriptElementsWithSrc: HTMLOrSVGScriptElement[] =
+		Array.prototype.filter.call((document as Document).scripts || [], elem =>
+			elem.getAttribute("src")
+		);
 	if (!scriptElementsWithSrc.length) return;
 	const currentScript = scriptElementsWithSrc[scriptElementsWithSrc.length - 1];
 	return currentScript.getAttribute("src");

packages/rspack-plugin-react-refresh/src/sockets/utils/getSocketUrlParts.ts

@@ -46,7 +46,7 @@ export default function getSocketUrlParts(
 			// 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.
-			url = new URL(scriptSource, window.location.href);
+			url = new URL(scriptSource!, window.location.href);
 		} catch (e) {
 			// URL parsing failed, do nothing.
 			// We will still proceed to see if we can recover using `resourceQuery`

packages/rspack-plugin-react-refresh/src/sockets/utils/getUrlFromParts.ts

@@ -4,7 +4,7 @@ import type { WDSMetaObj } from "./getWDSMetadata";
 /**
  * Create a valid URL from parsed URL parts.
  * @param urlParts The parsed URL parts.
- * @param [metadata] The parsed WDS metadata object.
+ * @param metadata The parsed WDS metadata object.
  * @returns The generated URL.
  */
 export default function urlFromParts(

packages/rspack-plugin-react-refresh/src/sockets/utils/getWDSMetadata.ts

@@ -3,7 +3,23 @@ export interface WDSMetaObj {
 	version?: number;
 }
 
-export default function getWDSMetadata(SocketClient: any): WDSMetaObj {
+declare class WebSocketClient {
+	public client: WebSocket;
+
+	constructor(url: string);
+
+	onOpen(f: (...args: any[]) => void): void;
+
+	onClose(f: (...args: any[]) => void): void;
+
+	onMessage(f: (...args: any[]) => void): void;
+}
+
+export interface SocketClient {
+	new (url: string): WebSocketClient;
+}
+
+export default function getWDSMetadata(SocketClient: SocketClient): WDSMetaObj {
 	let enforceWs = false;
 	if (
 		typeof SocketClient.name !== "undefined" &&

packages/rspack-plugin-react-refresh/src/utils/getSocketIntegration.ts

@@ -1,6 +1,6 @@
 export type IntegrationType = "wds";
 
-export default function getSocketIntegration(integrationType: IntegrationType) {
+export function getSocketIntegration(integrationType: IntegrationType) {
 	let resolvedSocketIntegration;
 	switch (integrationType) {
 		case "wds": {