@rspack/plugin-react-refresh 1.0.0-beta.3 → 1.0.0-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +0 -1
- package/README.md +67 -3
- package/client/errorOverlayEntry.js +9 -7
- package/client/overlay/components/CompileErrorTrace.js +7 -2
- package/client/overlay/components/PageHeader.js +4 -2
- package/client/overlay/components/RuntimeErrorHeader.js +2 -1
- package/client/overlay/components/RuntimeErrorStack.js +2 -1
- package/client/overlay/index.js +10 -3
- package/client/overlay/utils.js +1 -1
- package/client/reactRefresh.js +15 -15
- package/client/reactRefreshEntry.js +41 -41
- package/client/refreshUtils.js +213 -213
- package/client/utils/ansi-html.js +80 -78
- package/client/utils/errorEventHandlers.js +2 -2
- package/client/utils/formatWebpackErrors.js +15 -5
- package/client/utils/retry.js +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +21 -19
- package/dist/options.d.ts +1 -1
- package/dist/options.js +10 -10
- package/dist/sockets/WDSSocket.d.ts +2 -2
- package/dist/sockets/WDSSocket.js +2 -2
- package/dist/sockets/utils/getCurrentScriptSource.js +4 -4
- package/dist/sockets/utils/getSocketUrlParts.d.ts +1 -1
- package/dist/sockets/utils/getSocketUrlParts.js +13 -12
- package/dist/sockets/utils/getUrlFromParts.d.ts +2 -2
- package/dist/sockets/utils/getUrlFromParts.js +3 -3
- package/dist/sockets/utils/getWDSMetadata.d.ts +3 -3
- package/dist/sockets/utils/getWDSMetadata.js +6 -6
- package/dist/utils/getAdditionalEntries.d.ts +2 -2
- package/dist/utils/getAdditionalEntries.js +11 -11
- package/dist/utils/getSocketIntegration.d.ts +1 -1
- package/dist/utils/getSocketIntegration.js +2 -2
- package/package.json +31 -21
@@ -29,6 +29,7 @@ function getSocketUrlParts(resourceQuery, metadata = {}) {
|
|
29
29
|
// The placeholder `baseURL` with `window.location.href`,
|
30
30
|
// is to allow parsing of path-relative or protocol-relative URLs,
|
31
31
|
// and will have no effect if `scriptSource` is a fully valid URL.
|
32
|
+
// biome-ignore lint: reason
|
32
33
|
url = new URL(scriptSource, window.location.href);
|
33
34
|
}
|
34
35
|
catch (e) {
|
@@ -46,7 +47,7 @@ function getSocketUrlParts(resourceQuery, metadata = {}) {
|
|
46
47
|
}
|
47
48
|
}
|
48
49
|
// `file://` URLs has `'null'` origin
|
49
|
-
if (url.origin !==
|
50
|
+
if (url.origin !== 'null') {
|
50
51
|
urlParts.hostname = url.hostname;
|
51
52
|
}
|
52
53
|
urlParts.protocol = url.protocol;
|
@@ -55,24 +56,24 @@ function getSocketUrlParts(resourceQuery, metadata = {}) {
|
|
55
56
|
if (!urlParts.pathname) {
|
56
57
|
if (metadata.version === 4) {
|
57
58
|
// This is hard-coded in WDS v4
|
58
|
-
urlParts.pathname =
|
59
|
+
urlParts.pathname = '/ws';
|
59
60
|
}
|
60
61
|
else {
|
61
62
|
// This is hard-coded in WDS v3
|
62
|
-
urlParts.pathname =
|
63
|
+
urlParts.pathname = '/sockjs-node';
|
63
64
|
}
|
64
65
|
}
|
65
66
|
// Check for IPv4 and IPv6 host addresses that correspond to any/empty.
|
66
67
|
// This is important because `hostname` can be empty for some hosts,
|
67
68
|
// such as 'about:blank' or 'file://' URLs.
|
68
|
-
const isEmptyHostname = urlParts.hostname ===
|
69
|
-
urlParts.hostname ===
|
69
|
+
const isEmptyHostname = urlParts.hostname === '0.0.0.0' ||
|
70
|
+
urlParts.hostname === '[::]' ||
|
70
71
|
!urlParts.hostname;
|
71
72
|
// We only re-assign the hostname if it is empty,
|
72
73
|
// and if we are using HTTP/HTTPS protocols.
|
73
74
|
if (isEmptyHostname &&
|
74
75
|
window.location.hostname &&
|
75
|
-
window.location.protocol.indexOf(
|
76
|
+
window.location.protocol.indexOf('http') === 0) {
|
76
77
|
urlParts.hostname = window.location.hostname;
|
77
78
|
}
|
78
79
|
// We only re-assign `protocol` when `protocol` is unavailable,
|
@@ -81,7 +82,7 @@ function getSocketUrlParts(resourceQuery, metadata = {}) {
|
|
81
82
|
// We also do this when 'https' is used as it mandates the use of secure sockets.
|
82
83
|
if (!urlParts.protocol ||
|
83
84
|
(urlParts.hostname &&
|
84
|
-
(isEmptyHostname || window.location.protocol ===
|
85
|
+
(isEmptyHostname || window.location.protocol === 'https:'))) {
|
85
86
|
urlParts.protocol = window.location.protocol;
|
86
87
|
}
|
87
88
|
// We only re-assign port when it is not available
|
@@ -90,18 +91,18 @@ function getSocketUrlParts(resourceQuery, metadata = {}) {
|
|
90
91
|
}
|
91
92
|
if (!urlParts.hostname || !urlParts.pathname) {
|
92
93
|
throw new Error([
|
93
|
-
|
94
|
+
'[React Refresh] Failed to get an URL for the socket connection.',
|
94
95
|
"This usually means that the current executed script doesn't have a `src` attribute set.",
|
95
|
-
|
96
|
-
|
97
|
-
].join(
|
96
|
+
'You should either specify the socket path parameters under the `devServer` key in your Rspack config, or use the `overlay` option.',
|
97
|
+
'https://www.rspack.dev/guide/tech/react#fast-refresh',
|
98
|
+
].join('\n'));
|
98
99
|
}
|
99
100
|
return {
|
100
101
|
auth: urlParts.auth,
|
101
102
|
hostname: urlParts.hostname,
|
102
103
|
pathname: urlParts.pathname,
|
103
104
|
protocol: urlParts.protocol,
|
104
|
-
port: urlParts.port || undefined
|
105
|
+
port: urlParts.port || undefined,
|
105
106
|
};
|
106
107
|
}
|
107
108
|
exports.default = getSocketUrlParts;
|
@@ -1,5 +1,5 @@
|
|
1
|
-
import type { SocketUrlParts } from
|
2
|
-
import type { WDSMetaObj } from
|
1
|
+
import type { SocketUrlParts } from './getSocketUrlParts';
|
2
|
+
import type { WDSMetaObj } from './getWDSMetadata';
|
3
3
|
/**
|
4
4
|
* Create a valid URL from parsed URL parts.
|
5
5
|
* @param urlParts The parsed URL parts.
|
@@ -7,17 +7,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
7
|
* @returns The generated URL.
|
8
8
|
*/
|
9
9
|
function urlFromParts(urlParts, metadata = {}) {
|
10
|
-
let fullProtocol =
|
10
|
+
let fullProtocol = 'http:';
|
11
11
|
if (urlParts.protocol) {
|
12
12
|
fullProtocol = urlParts.protocol;
|
13
13
|
}
|
14
14
|
if (metadata.enforceWs) {
|
15
|
-
fullProtocol = fullProtocol.replace(/^(?:http|.+-extension|file)/i,
|
15
|
+
fullProtocol = fullProtocol.replace(/^(?:http|.+-extension|file)/i, 'ws');
|
16
16
|
}
|
17
17
|
fullProtocol = `${fullProtocol}//`;
|
18
18
|
let fullHost = urlParts.hostname;
|
19
19
|
if (urlParts.auth) {
|
20
|
-
const fullAuth = `${urlParts.auth.split(
|
20
|
+
const fullAuth = `${urlParts.auth.split(':').map(encodeURIComponent).join(':')}@`;
|
21
21
|
fullHost = fullAuth + fullHost;
|
22
22
|
}
|
23
23
|
if (urlParts.port) {
|
@@ -5,9 +5,9 @@ export interface WDSMetaObj {
|
|
5
5
|
declare class WebSocketClient {
|
6
6
|
client: WebSocket;
|
7
7
|
constructor(url: string);
|
8
|
-
onOpen(f: (...args:
|
9
|
-
onClose(f: (...args:
|
10
|
-
onMessage(f: (...args:
|
8
|
+
onOpen(f: (...args: unknown[]) => void): void;
|
9
|
+
onClose(f: (...args: unknown[]) => void): void;
|
10
|
+
onMessage(f: (...args: unknown[]) => void): void;
|
11
11
|
}
|
12
12
|
export interface SocketClient {
|
13
13
|
new (url: string): WebSocketClient;
|
@@ -2,20 +2,20 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
function getWDSMetadata(SocketClient) {
|
4
4
|
let enforceWs = false;
|
5
|
-
if (typeof SocketClient.name !==
|
5
|
+
if (typeof SocketClient.name !== 'undefined' &&
|
6
6
|
SocketClient.name !== null &&
|
7
|
-
SocketClient.name.toLowerCase().includes(
|
7
|
+
SocketClient.name.toLowerCase().includes('websocket')) {
|
8
8
|
enforceWs = true;
|
9
9
|
}
|
10
10
|
let version;
|
11
11
|
// WDS versions <=3.5.0
|
12
|
-
if (!(
|
12
|
+
if (!('onMessage' in SocketClient.prototype)) {
|
13
13
|
version = 3;
|
14
14
|
}
|
15
15
|
else {
|
16
16
|
// WDS versions >=3.5.0 <4
|
17
|
-
if (
|
18
|
-
Object.getPrototypeOf(SocketClient).name ===
|
17
|
+
if ('getClientPath' in SocketClient ||
|
18
|
+
Object.getPrototypeOf(SocketClient).name === 'BaseClient') {
|
19
19
|
version = 3;
|
20
20
|
}
|
21
21
|
else {
|
@@ -24,7 +24,7 @@ function getWDSMetadata(SocketClient) {
|
|
24
24
|
}
|
25
25
|
return {
|
26
26
|
enforceWs: enforceWs,
|
27
|
-
version: version
|
27
|
+
version: version,
|
28
28
|
};
|
29
29
|
}
|
30
30
|
exports.default = getWDSMetadata;
|
@@ -1,9 +1,9 @@
|
|
1
|
-
import type { NormalizedPluginOptions } from
|
1
|
+
import type { NormalizedPluginOptions } from '../options';
|
2
2
|
export interface AdditionalEntries {
|
3
3
|
prependEntries: string[];
|
4
4
|
overlayEntries: string[];
|
5
5
|
}
|
6
|
-
export declare function getAdditionalEntries({ devServer, options }: {
|
6
|
+
export declare function getAdditionalEntries({ devServer, options, }: {
|
7
7
|
devServer: any;
|
8
8
|
options: NormalizedPluginOptions;
|
9
9
|
}): AdditionalEntries;
|
@@ -5,12 +5,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
6
6
|
exports.getAdditionalEntries = void 0;
|
7
7
|
const node_querystring_1 = __importDefault(require("node:querystring"));
|
8
|
-
function getAdditionalEntries({ devServer, options }) {
|
8
|
+
function getAdditionalEntries({ devServer, options, }) {
|
9
9
|
const resourceQuery = {};
|
10
10
|
if (devServer) {
|
11
11
|
const { client, https, http2, sockHost, sockPath, sockPort } = devServer;
|
12
12
|
let { host, path, port } = devServer;
|
13
|
-
let protocol = https || http2 ?
|
13
|
+
let protocol = https || http2 ? 'https' : 'http';
|
14
14
|
if (sockHost)
|
15
15
|
host = sockHost;
|
16
16
|
if (sockPath)
|
@@ -19,7 +19,7 @@ function getAdditionalEntries({ devServer, options }) {
|
|
19
19
|
port = sockPort;
|
20
20
|
if (client && client.webSocketURL != null) {
|
21
21
|
let parsedUrl = client.webSocketURL;
|
22
|
-
if (typeof parsedUrl ===
|
22
|
+
if (typeof parsedUrl === 'string')
|
23
23
|
parsedUrl = new URL(parsedUrl);
|
24
24
|
let auth;
|
25
25
|
if (parsedUrl.username) {
|
@@ -31,21 +31,21 @@ function getAdditionalEntries({ devServer, options }) {
|
|
31
31
|
if (parsedUrl.hostname != null) {
|
32
32
|
host = [auth != null && auth, parsedUrl.hostname]
|
33
33
|
.filter(Boolean)
|
34
|
-
.join(
|
34
|
+
.join('@');
|
35
35
|
}
|
36
36
|
if (parsedUrl.pathname != null) {
|
37
37
|
path = parsedUrl.pathname;
|
38
38
|
}
|
39
39
|
if (parsedUrl.port != null) {
|
40
|
-
port = ![
|
40
|
+
port = !['0', 'auto'].includes(String(parsedUrl.port))
|
41
41
|
? parsedUrl.port
|
42
42
|
: undefined;
|
43
43
|
}
|
44
44
|
if (parsedUrl.protocol != null) {
|
45
45
|
protocol =
|
46
|
-
parsedUrl.protocol !==
|
47
|
-
? parsedUrl.protocol.replace(
|
48
|
-
:
|
46
|
+
parsedUrl.protocol !== 'auto'
|
47
|
+
? parsedUrl.protocol.replace(':', '')
|
48
|
+
: 'ws';
|
49
49
|
}
|
50
50
|
}
|
51
51
|
if (host)
|
@@ -71,17 +71,17 @@ function getAdditionalEntries({ devServer, options }) {
|
|
71
71
|
const queryString = node_querystring_1.default.stringify(resourceQuery, undefined, undefined, {
|
72
72
|
encodeURIComponent(str) {
|
73
73
|
return str;
|
74
|
-
}
|
74
|
+
},
|
75
75
|
});
|
76
76
|
const prependEntries = [
|
77
77
|
// React-refresh runtime
|
78
|
-
require.resolve(
|
78
|
+
require.resolve('../../client/reactRefreshEntry'),
|
79
79
|
];
|
80
80
|
const overlayEntries = [
|
81
81
|
// Error overlay runtime
|
82
82
|
options.overlay !== false &&
|
83
83
|
options.overlay?.entry &&
|
84
|
-
`${require.resolve(options.overlay.entry)}${queryString ? `?${queryString}` :
|
84
|
+
`${require.resolve(options.overlay.entry)}${queryString ? `?${queryString}` : ''}`,
|
85
85
|
].filter(Boolean);
|
86
86
|
return { prependEntries, overlayEntries };
|
87
87
|
}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
export type IntegrationType =
|
1
|
+
export type IntegrationType = 'wds';
|
2
2
|
export declare function getSocketIntegration(integrationType: IntegrationType): string;
|
@@ -4,8 +4,8 @@ exports.getSocketIntegration = void 0;
|
|
4
4
|
function getSocketIntegration(integrationType) {
|
5
5
|
let resolvedSocketIntegration;
|
6
6
|
switch (integrationType) {
|
7
|
-
case
|
8
|
-
resolvedSocketIntegration = require.resolve(
|
7
|
+
case 'wds': {
|
8
|
+
resolvedSocketIntegration = require.resolve('../sockets/WDSSocket');
|
9
9
|
break;
|
10
10
|
}
|
11
11
|
default: {
|
package/package.json
CHANGED
@@ -1,6 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@rspack/plugin-react-refresh",
|
3
|
-
"version": "1.0.0-beta.
|
3
|
+
"version": "1.0.0-beta.4",
|
4
|
+
"repository": "https://github.com/rspack-contrib/rspack-plugin-react-refresh",
|
4
5
|
"license": "MIT",
|
5
6
|
"description": "React refresh plugin for rspack",
|
6
7
|
"main": "dist/index.js",
|
@@ -17,22 +18,33 @@
|
|
17
18
|
"client",
|
18
19
|
"dist"
|
19
20
|
],
|
20
|
-
"
|
21
|
-
"
|
22
|
-
"provenance": true
|
21
|
+
"simple-git-hooks": {
|
22
|
+
"pre-commit": "npx nano-staged"
|
23
23
|
},
|
24
|
-
"
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
"url": "https://github.com/web-infra-dev/rspack",
|
29
|
-
"directory": "packages/rspack-plugin-react-refresh"
|
24
|
+
"nano-staged": {
|
25
|
+
"*.{js,jsx,ts,tsx,mjs,cjs}": [
|
26
|
+
"biome check --write --no-errors-on-unmatched"
|
27
|
+
]
|
30
28
|
},
|
31
29
|
"devDependencies": {
|
32
|
-
"
|
33
|
-
"typescript": "5.0.2",
|
30
|
+
"@biomejs/biome": "^1.8.3",
|
34
31
|
"@rspack/core": "1.0.0-beta.3",
|
35
|
-
"@rspack/
|
32
|
+
"@rspack/test-tools": "1.0.0-beta.3",
|
33
|
+
"@rspack/dev-server": "1.0.0-beta.3",
|
34
|
+
"@types/node": "^20.14.13",
|
35
|
+
"@types/jest": "29.5.12",
|
36
|
+
"react-refresh": "^0.14.0",
|
37
|
+
"cross-env": "^7.0.3",
|
38
|
+
"execa": "9.3.0",
|
39
|
+
"fs-extra": "11.2.0",
|
40
|
+
"jest": "29.7.0",
|
41
|
+
"jest-cli": "29.7.0",
|
42
|
+
"jest-environment-node": "29.7.0",
|
43
|
+
"nano-staged": "^0.8.0",
|
44
|
+
"semver": "7.6.3",
|
45
|
+
"simple-git-hooks": "^2.11.1",
|
46
|
+
"ts-jest": "29.1.2",
|
47
|
+
"typescript": "5.0.2"
|
36
48
|
},
|
37
49
|
"dependencies": {
|
38
50
|
"error-stack-parser": "^2.0.6",
|
@@ -46,18 +58,16 @@
|
|
46
58
|
"optional": true
|
47
59
|
}
|
48
60
|
},
|
49
|
-
"
|
50
|
-
"
|
51
|
-
|
52
|
-
"<rootDir>/tests/dist"
|
53
|
-
],
|
54
|
-
"testEnvironment": "../../scripts/test/patch-node-env.cjs"
|
61
|
+
"publishConfig": {
|
62
|
+
"access": "public",
|
63
|
+
"registry": "https://registry.npmjs.org/"
|
55
64
|
},
|
56
65
|
"scripts": {
|
57
66
|
"build": "tsc -b ./tsconfig.build.json",
|
58
67
|
"dev": "tsc -b -w",
|
68
|
+
"lint": "biome check .",
|
69
|
+
"lint:write": "biome check . --write",
|
59
70
|
"test": "jest --colors",
|
60
|
-
"
|
61
|
-
"api-extractor:ci": "api-extractor run --verbose || diff temp/api.md etc/api.md"
|
71
|
+
"release": "node ./scripts/release.mjs"
|
62
72
|
}
|
63
73
|
}
|