@rspack/plugin-react-refresh 1.0.0-alpha.0 → 1.0.0-alpha.1

package/dist/sockets/WDSSocket.js

@@ -0,0 +1,41 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.init = void 0;
+/**
+ * The following code is modified based on
+ * https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/f1c8b9a44198449093ca95f85af5df97925e1cfc/sockets/WPSSocket.js
+ *
+ * MIT Licensed
+ * Author Michael Mok
+ * Copyright (c) 2019 Michael Mok
+ * https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/0b960573797bf38926937994c481e4fec9ed8aa6/LICENSE
+ */
+const getSocketUrlParts_1 = __importDefault(require("./utils/getSocketUrlParts"));
+const getUrlFromParts_1 = __importDefault(require("./utils/getUrlFromParts"));
+const getWDSMetadata_1 = __importDefault(require("./utils/getWDSMetadata"));
+/**
+ * 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}
+ */
+function init(messageHandler, resourceQuery) {
+    if (typeof __webpack_dev_server_client__ !== "undefined") {
+        let SocketClient = __webpack_dev_server_client__;
+        if (typeof __webpack_dev_server_client__.default !== "undefined") {
+            SocketClient = __webpack_dev_server_client__.default;
+        }
+        const wdsMeta = (0, getWDSMetadata_1.default)(SocketClient);
+        const urlParts = (0, getSocketUrlParts_1.default)(resourceQuery, wdsMeta);
+        const connection = new SocketClient((0, getUrlFromParts_1.default)(urlParts, wdsMeta));
+        // @ts-expect-error -- ignore
+        connection.onMessage(function onSocketMessage(data) {
+            const message = JSON.parse(data);
+            messageHandler(message);
+        });
+    }
+}
+exports.init = init;

package/dist/sockets/utils/getCurrentScriptSource.d.ts

@@ -0,0 +1 @@
+export default function getCurrentScriptSource(): any;

package/dist/sockets/utils/getCurrentScriptSource.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function getCurrentScriptSource() {
+    // `document.currentScript` is the most accurate way to get the current running script,
+    // but is not supported in all browsers (most notably, IE).
+    if ("currentScript" in document) {
+        // In some cases, `document.currentScript` would be `null` even if the browser supports it:
+        // e.g. asynchronous chunks on Firefox.
+        // We should not fallback to the list-approach as it would not be safe.
+        if (document.currentScript == null)
+            return;
+        return document.currentScript.getAttribute("src");
+    }
+    else {
+        // Fallback to getting all scripts running in the document,
+        // and finding the last one injected.
+        const scriptElementsWithSrc = Array.prototype.filter.call(document.scripts || [], function (elem) {
+            return elem.getAttribute("src");
+        });
+        if (!scriptElementsWithSrc.length)
+            return;
+        const currentScript = scriptElementsWithSrc[scriptElementsWithSrc.length - 1];
+        return currentScript.getAttribute("src");
+    }
+}
+exports.default = getCurrentScriptSource;

package/dist/sockets/utils/getSocketUrlParts.d.ts

@@ -0,0 +1,9 @@
+import { WDSMetaObj } from "./getWDSMetadata";
+export interface SocketUrlParts {
+    auth?: string;
+    hostname: string;
+    protocol?: string;
+    pathname: string;
+    port?: string;
+}
+export default function getSocketUrlParts(resourceQuery?: string, metadata?: WDSMetaObj): SocketUrlParts;

package/dist/sockets/utils/getSocketUrlParts.js

@@ -0,0 +1,112 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const getCurrentScriptSource_1 = __importDefault(require("./getCurrentScriptSource"));
+function getSocketUrlParts(resourceQuery, metadata) {
+    if (typeof metadata === "undefined") {
+        metadata = {};
+    }
+    /** @type {SocketUrlParts} */
+    let urlParts = {};
+    // If the resource query is available,
+    // parse it and ignore everything we received from the script host.
+    if (resourceQuery) {
+        const parsedQuery = {};
+        const searchParams = new URLSearchParams(resourceQuery.slice(1));
+        searchParams.forEach(function (value, key) {
+            // @ts-expect-error -- ignore
+            parsedQuery[key] = value;
+        });
+        urlParts.hostname = parsedQuery.sockHost;
+        urlParts.pathname = parsedQuery.sockPath;
+        urlParts.port = parsedQuery.sockPort;
+        // Make sure the protocol from resource query has a trailing colon
+        if (parsedQuery.sockProtocol) {
+            urlParts.protocol = parsedQuery.sockProtocol + ":";
+        }
+    }
+    else {
+        const scriptSource = (0, getCurrentScriptSource_1.default)();
+        let url = {};
+        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.
+            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`
+        }
+        // Parse authentication credentials in case we need them
+        if (url.username) {
+            // Since HTTP basic authentication does not allow empty username,
+            // we only include password if the username is not empty.
+            // Result: <username> or <username>:<password>
+            urlParts.auth = url.username;
+            if (url.password) {
+                urlParts.auth += ":" + url.password;
+            }
+        }
+        // `file://` URLs has `'null'` origin
+        if (url.origin !== "null") {
+            urlParts.hostname = url.hostname;
+        }
+        urlParts.protocol = url.protocol;
+        urlParts.port = url.port;
+    }
+    if (!urlParts.pathname) {
+        if (metadata.version === 4) {
+            // This is hard-coded in WDS v4
+            urlParts.pathname = "/ws";
+        }
+        else {
+            // This is hard-coded in WDS v3
+            urlParts.pathname = "/sockjs-node";
+        }
+    }
+    // Check for IPv4 and IPv6 host addresses that correspond to any/empty.
+    // This is important because `hostname` can be empty for some hosts,
+    // such as 'about:blank' or 'file://' URLs.
+    const isEmptyHostname = urlParts.hostname === "0.0.0.0" ||
+        urlParts.hostname === "[::]" ||
+        !urlParts.hostname;
+    // We only re-assign the hostname if it is empty,
+    // and if we are using HTTP/HTTPS protocols.
+    if (isEmptyHostname &&
+        window.location.hostname &&
+        window.location.protocol.indexOf("http") === 0) {
+        urlParts.hostname = window.location.hostname;
+    }
+    // We only re-assign `protocol` when `protocol` is unavailable,
+    // or if `hostname` is available and is empty,
+    // since otherwise we risk creating an invalid URL.
+    // We also do this when 'https' is used as it mandates the use of secure sockets.
+    if (!urlParts.protocol ||
+        (urlParts.hostname &&
+            (isEmptyHostname || window.location.protocol === "https:"))) {
+        urlParts.protocol = window.location.protocol;
+    }
+    // We only re-assign port when it is not available
+    if (!urlParts.port) {
+        urlParts.port = window.location.port;
+    }
+    if (!urlParts.hostname || !urlParts.pathname) {
+        throw new Error([
+            "[React Refresh] Failed to get an URL for the socket connection.",
+            "This usually means that the current executed script doesn't have a `src` attribute set.",
+            "You should either specify the socket path parameters under the `devServer` key in your Rspack config, or use the `overlay` option.",
+            "https://www.rspack.dev/guide/tech/react#fast-refresh"
+        ].join("\n"));
+    }
+    return {
+        auth: urlParts.auth,
+        hostname: urlParts.hostname,
+        pathname: urlParts.pathname,
+        protocol: urlParts.protocol,
+        port: urlParts.port || undefined
+    };
+}
+exports.default = getSocketUrlParts;

package/dist/sockets/utils/getUrlFromParts.d.ts

@@ -0,0 +1,9 @@
+import type { SocketUrlParts } from "./getSocketUrlParts";
+import type { WDSMetaObj } from "./getWDSMetadata";
+/**
+ * Create a valid URL from parsed URL parts.
+ * @param {import('./getSocketUrlParts').SocketUrlParts} urlParts The parsed URL parts.
+ * @param {import('./getWDSMetadata').WDSMetaObj} [metadata] The parsed WDS metadata object.
+ * @returns {string} The generated URL.
+ */
+export default function urlFromParts(urlParts: SocketUrlParts, metadata: WDSMetaObj): string;

package/dist/sockets/utils/getUrlFromParts.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Create a valid URL from parsed URL parts.
+ * @param {import('./getSocketUrlParts').SocketUrlParts} urlParts The parsed URL parts.
+ * @param {import('./getWDSMetadata').WDSMetaObj} [metadata] The parsed WDS metadata object.
+ * @returns {string} The generated URL.
+ */
+function urlFromParts(urlParts, metadata) {
+    if (typeof metadata === "undefined") {
+        metadata = {};
+    }
+    let fullProtocol = "http:";
+    if (urlParts.protocol) {
+        fullProtocol = urlParts.protocol;
+    }
+    if (metadata.enforceWs) {
+        fullProtocol = fullProtocol.replace(/^(?:http|.+-extension|file)/i, "ws");
+    }
+    fullProtocol = fullProtocol + "//";
+    let fullHost = urlParts.hostname;
+    if (urlParts.auth) {
+        const fullAuth = urlParts.auth.split(":").map(encodeURIComponent).join(":") + "@";
+        fullHost = fullAuth + fullHost;
+    }
+    if (urlParts.port) {
+        fullHost = fullHost + ":" + urlParts.port;
+    }
+    const url = new URL(urlParts.pathname, fullProtocol + fullHost);
+    return url.href;
+}
+exports.default = urlFromParts;

package/dist/sockets/utils/getWDSMetadata.d.ts

@@ -0,0 +1,5 @@
+export interface WDSMetaObj {
+    enforceWs?: boolean;
+    version?: number;
+}
+export default function getWDSMetadata(SocketClient: any): WDSMetaObj;

package/dist/sockets/utils/getWDSMetadata.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function getWDSMetadata(SocketClient) {
+    let enforceWs = false;
+    if (typeof SocketClient.name !== "undefined" &&
+        SocketClient.name !== null &&
+        SocketClient.name.toLowerCase().includes("websocket")) {
+        enforceWs = true;
+    }
+    let version;
+    // WDS versions <=3.5.0
+    if (!("onMessage" in SocketClient.prototype)) {
+        version = 3;
+    }
+    else {
+        // WDS versions >=3.5.0 <4
+        if ("getClientPath" in SocketClient ||
+            Object.getPrototypeOf(SocketClient).name === "BaseClient") {
+            version = 3;
+        }
+        else {
+            version = 4;
+        }
+    }
+    return {
+        enforceWs: enforceWs,
+        version: version
+    };
+}
+exports.default = getWDSMetadata;

package/dist/utils/getAdditionalEntries.d.ts

@@ -0,0 +1,9 @@
+import type { NormalizedPluginOptions } from "../options";
+export interface AdditionalEntries {
+    prependEntries: string[];
+    overlayEntries: string[];
+}
+export declare function getAdditionalEntries({ devServer, options }: {
+    devServer: any;
+    options: NormalizedPluginOptions;
+}): AdditionalEntries;

package/dist/utils/getAdditionalEntries.js

@@ -0,0 +1,93 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAdditionalEntries = void 0;
+const node_querystring_1 = __importDefault(require("node:querystring"));
+function getAdditionalEntries({ devServer, options }) {
+    /** @type {Record<string, string | number>} */
+    let resourceQuery = {};
+    if (devServer) {
+        const { client, https, http2, sockHost, sockPath, sockPort } = devServer;
+        let { host, path, port } = devServer;
+        let protocol = https || http2 ? "https" : "http";
+        if (sockHost)
+            host = sockHost;
+        if (sockPath)
+            path = sockPath;
+        if (sockPort)
+            port = sockPort;
+        if (client && client.webSocketURL != null) {
+            let parsedUrl = client.webSocketURL;
+            if (typeof parsedUrl === "string")
+                parsedUrl = new URL(parsedUrl);
+            let auth;
+            if (parsedUrl.username) {
+                auth = parsedUrl.username;
+                if (parsedUrl.password) {
+                    auth += ":" + parsedUrl.password;
+                }
+            }
+            if (parsedUrl.hostname != null) {
+                host = [auth != null && auth, parsedUrl.hostname]
+                    .filter(Boolean)
+                    .join("@");
+            }
+            if (parsedUrl.pathname != null) {
+                path = parsedUrl.pathname;
+            }
+            if (parsedUrl.port != null) {
+                port = !["0", "auto"].includes(String(parsedUrl.port))
+                    ? parsedUrl.port
+                    : undefined;
+            }
+            if (parsedUrl.protocol != null) {
+                protocol =
+                    parsedUrl.protocol !== "auto"
+                        ? parsedUrl.protocol.replace(":", "")
+                        : "ws";
+            }
+        }
+        if (host)
+            resourceQuery.sockHost = host;
+        if (path)
+            resourceQuery.sockPath = path;
+        if (port)
+            resourceQuery.sockPort = port;
+        resourceQuery.sockProtocol = protocol;
+    }
+    if (options.overlay) {
+        const { sockHost, sockPath, sockPort, sockProtocol } = options.overlay;
+        if (sockHost)
+            resourceQuery.sockHost = sockHost;
+        if (sockPath)
+            resourceQuery.sockPath = sockPath;
+        if (sockPort)
+            resourceQuery.sockPort = sockPort;
+        if (sockProtocol)
+            resourceQuery.sockProtocol = sockProtocol;
+    }
+    // We don't need to URI encode the resourceQuery as it will be parsed by Webpack
+    const queryString = node_querystring_1.default.stringify(resourceQuery, undefined, undefined, {
+        /**
+         * @param {string} string
+         * @returns {string}
+         */
+        encodeURIComponent(string) {
+            return string;
+        }
+    });
+    const prependEntries = [
+        // React-refresh runtime
+        require.resolve("../../client/reactRefreshEntry")
+    ];
+    const overlayEntries = [
+        // Error overlay runtime
+        options.overlay &&
+            options.overlay.entry &&
+            `${require.resolve(options.overlay.entry)}${queryString ? `?${queryString}` : ""}`
+    ].filter(Boolean);
+    return { prependEntries, overlayEntries };
+}
+exports.getAdditionalEntries = getAdditionalEntries;

package/dist/utils/getSocketIntegration.d.ts

@@ -0,0 +1,2 @@
+export type IntegrationType = "wds";
+export default function getSocketIntegration(integrationType: IntegrationType): string;

package/dist/utils/getSocketIntegration.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function getSocketIntegration(integrationType) {
+    let resolvedSocketIntegration;
+    switch (integrationType) {
+        case "wds": {
+            resolvedSocketIntegration = require.resolve("../sockets/WDSSocket");
+            break;
+        }
+        default: {
+            resolvedSocketIntegration = require.resolve(integrationType);
+            break;
+        }
+    }
+    return resolvedSocketIntegration;
+}
+exports.default = getSocketIntegration;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rspack/plugin-react-refresh",
-  "version": "1.0.0-alpha.0",
+  "version": "1.0.0-alpha.1",
   "license": "MIT",
   "description": "React refresh plugin for rspack",
   "main": "dist/index.js",
@@ -30,8 +30,12 @@
   },
   "devDependencies": {
     "react-refresh": "0.14.0",
-    "@rspack/core": "1.0.0-alpha.0",
-    "@rspack/plugin-react-refresh": "1.0.0-alpha.0"
+    "@rspack/core": "1.0.0-alpha.1",
+    "@rspack/plugin-react-refresh": "1.0.0-alpha.1"
+  },
+  "dependencies": {
+    "html-entities": "^2.1.0",
+    "error-stack-parser": "^2.0.6"
   },
   "peerDependencies": {
     "react-refresh": ">=0.10.0 <1.0.0"