Skip to content

Commit 5edad76

Browse files
snitin315snitin315
authored
feat: added client.reconnect option (#3912)
1 parent 7298114 commit 5edad76

27 files changed

+543
-23
lines changed

‎README.md

+2
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,8 @@ Options:
9393
--client-logging <value> Allows to specify options for client script in the browser or disable client script.
9494
--client-progress Prints compilation progress in percentage in the browser.
9595
--no-client-progress Does not print compilation progress in percentage in the browser.
96+
--client-reconnect [value] Tells dev-server the number of times it should try to reconnect the client.
97+
--no-client-reconnect Tells dev-server to not to try to connect the client.
9698
--client-overlay Enables a full-screen overlay in the browser when there are compiler errors or warnings.
9799
--no-client-overlay Disables a full-screen overlay in the browser when there are compiler errors or warnings.
98100
--client-overlay-errors Enables a full-screen overlay in the browser when there are compiler errors.

‎bin/cli-flags.js

+23
Original file line numberDiff line numberDiff line change
@@ -174,6 +174,29 @@ module.exports = {
174174
simpleType: "boolean",
175175
multiple: false,
176176
},
177+
"client-reconnect": {
178+
configs: [
179+
{
180+
type: "boolean",
181+
multiple: false,
182+
description:
183+
"Tells dev-server the number of times it should try to reconnect the client.",
184+
path: "client.reconnect",
185+
},
186+
{
187+
type: "number",
188+
multiple: false,
189+
description:
190+
"Tells dev-server the number of times it should try to reconnect the client.",
191+
path: "client.reconnect",
192+
},
193+
],
194+
description:
195+
"Tells dev-server the number of times it should try to reconnect the client.",
196+
negatedDescription: "Tells dev-server to not to try to connect the client.",
197+
simpleType: "string",
198+
multiple: false,
199+
},
177200
"client-web-socket-url": {
178201
configs: [
179202
{

‎client-src/index.js

+12-1
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,10 @@ if (parsedResourceQuery.logging) {
4141
options.logging = parsedResourceQuery.logging;
4242
}
4343

44+
if (typeof parsedResourceQuery.reconnect !== "undefined") {
45+
options.reconnect = Number(parsedResourceQuery.reconnect);
46+
}
47+
4448
function setAllLogLevel(level) {
4549
// This is needed because the HMR logger operate separately from dev server logger
4650
webpackHotLog.setLogLevel(
@@ -98,6 +102,13 @@ const onSocketMessage = {
98102

99103
options.overlay = value;
100104
},
105+
reconnect(value) {
106+
if (parsedResourceQuery.reconnect === "false") {
107+
return;
108+
}
109+
110+
options.reconnect = value;
111+
},
101112
progress(progress) {
102113
options.progress = progress;
103114
},
@@ -215,4 +226,4 @@ const onSocketMessage = {
215226

216227
const socketURL = createSocketURL(parsedResourceQuery);
217228

218-
socket(socketURL, onSocketMessage);
229+
socket(socketURL, onSocketMessage, options.reconnect);

‎client-src/socket.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/* global __webpack_dev_server_client__ */
22

33
import WebSocketClient from "./clients/WebSocketClient.js";
4+
import { log } from "./utils/log.js";
45

56
// this WebsocketClient is here as a default fallback, in case the client is not injected
67
/* eslint-disable camelcase */
@@ -15,13 +16,15 @@ const Client =
1516
/* eslint-enable camelcase */
1617

1718
let retries = 0;
19+
let maxRetries = 10;
1820
let client = null;
1921

20-
const socket = function initSocket(url, handlers) {
22+
const socket = function initSocket(url, handlers, reconnect) {
2123
client = new Client(url);
2224

2325
client.onOpen(() => {
2426
retries = 0;
27+
maxRetries = reconnect;
2528
});
2629

2730
client.onClose(() => {
@@ -33,14 +36,16 @@ const socket = function initSocket(url, handlers) {
3336
client = null;
3437

3538
// After 10 retries stop trying, to prevent logspam.
36-
if (retries <= 10) {
39+
if (retries < maxRetries) {
3740
// Exponentially increase timeout to reconnect.
3841
// Respectfully copied from the package `got`.
3942
// eslint-disable-next-line no-mixed-operators, no-restricted-properties
4043
const retryInMs = 1000 * Math.pow(2, retries) + Math.random() * 100;
4144

4245
retries += 1;
4346

47+
log.info("Trying to reconnect...");
48+
4449
setTimeout(() => {
4550
socket(url, handlers);
4651
}, retryInMs);

‎lib/Server.js

+16
Original file line numberDiff line numberDiff line change
@@ -258,6 +258,10 @@ class Server {
258258
searchParams.set("logging", this.options.client.logging);
259259
}
260260

261+
if (typeof this.options.client.reconnect !== "undefined") {
262+
searchParams.set("reconnect", this.options.client.reconnect);
263+
}
264+
261265
webSocketURL = searchParams.toString();
262266
}
263267

@@ -474,6 +478,14 @@ class Server {
474478
};
475479
}
476480

481+
if (typeof options.client.reconnect === "undefined") {
482+
options.client.reconnect = 10;
483+
} else if (options.client.reconnect === true) {
484+
options.client.reconnect = Infinity;
485+
} else if (options.client.reconnect === false) {
486+
options.client.reconnect = 0;
487+
}
488+
477489
// Respect infrastructureLogging.level
478490
if (typeof options.client.logging === "undefined") {
479491
options.client.logging = compilerOptions.infrastructureLogging
@@ -1627,6 +1639,10 @@ class Server {
16271639
this.sendMessage([client], "progress", this.options.client.progress);
16281640
}
16291641

1642+
if (this.options.client && this.options.client.reconnect) {
1643+
this.sendMessage([client], "reconnect", this.options.client.reconnect);
1644+
}
1645+
16301646
if (this.options.client && this.options.client.overlay) {
16311647
this.sendMessage([client], "overlay", this.options.client.overlay);
16321648
}

‎lib/options.json

+16
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,9 @@
5959
"progress": {
6060
"$ref": "#/definitions/ClientProgress"
6161
},
62+
"reconnect": {
63+
"$ref": "#/definitions/ClientReconnect"
64+
},
6265
"webSocketTransport": {
6366
"$ref": "#/definitions/ClientWebSocketTransport"
6467
},
@@ -102,6 +105,19 @@
102105
"link": "https://webpack.js.org/configuration/dev-server/#progress",
103106
"type": "boolean"
104107
},
108+
"ClientReconnect": {
109+
"description": "Tells dev-server the number of times it should try to reconnect the client.",
110+
"link": "https://webpack.js.org/configuration/dev-server/#reconnect",
111+
"anyOf": [
112+
{
113+
"type": "boolean"
114+
},
115+
{
116+
"type": "number",
117+
"minimum": 0
118+
}
119+
]
120+
},
105121
"ClientWebSocketTransport": {
106122
"anyOf": [
107123
{

‎test/__snapshots__/validate-options.test.js.snap.webpack4

+23-7
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ exports[`options validate should throw an error on the "client" option with '{"l
8383
exports[`options validate should throw an error on the "client" option with '{"overlay":""}' value 1`] = `
8484
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
8585
- options.client should be one of these:
86-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
86+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
8787
-> Allows to specify options for client script in the browser or disable client script.
8888
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
8989
Details:
@@ -122,16 +122,32 @@ exports[`options validate should throw an error on the "client" option with '{"p
122122
-> Read more at https://webpack.js.org/configuration/dev-server/#progress"
123123
`;
124124

125+
exports[`options validate should throw an error on the "client" option with '{"reconnect":""}' value 1`] = `
126+
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
127+
- options.client should be one of these:
128+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
129+
-> Allows to specify options for client script in the browser or disable client script.
130+
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
131+
Details:
132+
* options.client.reconnect should be one of these:
133+
boolean | number (should be >= 0)
134+
-> Tells dev-server the number of times it should try to reconnect the client.
135+
-> Read more at https://webpack.js.org/configuration/dev-server/#reconnect
136+
Details:
137+
* options.client.reconnect should be a boolean.
138+
* options.client.reconnect should be a number (should be >= 0)."
139+
`;
140+
125141
exports[`options validate should throw an error on the "client" option with '{"unknownOption":true}' value 1`] = `
126142
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
127143
- options.client has an unknown property 'unknownOption'. These properties are valid:
128-
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }"
144+
object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }"
129145
`;
130146

131147
exports[`options validate should throw an error on the "client" option with '{"webSocketTransport":true}' value 1`] = `
132148
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
133149
- options.client should be one of these:
134-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
150+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
135151
-> Allows to specify options for client script in the browser or disable client script.
136152
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
137153
Details:
@@ -171,7 +187,7 @@ exports[`options validate should throw an error on the "client" option with '{"w
171187
exports[`options validate should throw an error on the "client" option with '{"webSocketURL":{"port":true}}' value 1`] = `
172188
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
173189
- options.client should be one of these:
174-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
190+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
175191
-> Allows to specify options for client script in the browser or disable client script.
176192
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
177193
Details:
@@ -186,7 +202,7 @@ exports[`options validate should throw an error on the "client" option with '{"w
186202
exports[`options validate should throw an error on the "client" option with '{"webSocketURL":{"username":123,"password":976}}' value 1`] = `
187203
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
188204
- options.client should be one of these:
189-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
205+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
190206
-> Allows to specify options for client script in the browser or disable client script.
191207
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
192208
Details:
@@ -199,13 +215,13 @@ exports[`options validate should throw an error on the "client" option with '{"w
199215
exports[`options validate should throw an error on the "client" option with 'whoops!' value 1`] = `
200216
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
201217
- options.client should be one of these:
202-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
218+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
203219
-> Allows to specify options for client script in the browser or disable client script.
204220
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
205221
Details:
206222
* options.client should be false.
207223
* options.client should be an object:
208-
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }"
224+
object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }"
209225
`;
210226

211227
exports[`options validate should throw an error on the "compress" option with '' value 1`] = `

‎test/__snapshots__/validate-options.test.js.snap.webpack5

+23-7
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ exports[`options validate should throw an error on the "client" option with '{"l
8383
exports[`options validate should throw an error on the "client" option with '{"overlay":""}' value 1`] = `
8484
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
8585
- options.client should be one of these:
86-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
86+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
8787
-> Allows to specify options for client script in the browser or disable client script.
8888
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
8989
Details:
@@ -122,16 +122,32 @@ exports[`options validate should throw an error on the "client" option with '{"p
122122
-> Read more at https://webpack.js.org/configuration/dev-server/#progress"
123123
`;
124124

125+
exports[`options validate should throw an error on the "client" option with '{"reconnect":""}' value 1`] = `
126+
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
127+
- options.client should be one of these:
128+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
129+
-> Allows to specify options for client script in the browser or disable client script.
130+
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
131+
Details:
132+
* options.client.reconnect should be one of these:
133+
boolean | number (should be >= 0)
134+
-> Tells dev-server the number of times it should try to reconnect the client.
135+
-> Read more at https://webpack.js.org/configuration/dev-server/#reconnect
136+
Details:
137+
* options.client.reconnect should be a boolean.
138+
* options.client.reconnect should be a number (should be >= 0)."
139+
`;
140+
125141
exports[`options validate should throw an error on the "client" option with '{"unknownOption":true}' value 1`] = `
126142
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
127143
- options.client has an unknown property 'unknownOption'. These properties are valid:
128-
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }"
144+
object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }"
129145
`;
130146

131147
exports[`options validate should throw an error on the "client" option with '{"webSocketTransport":true}' value 1`] = `
132148
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
133149
- options.client should be one of these:
134-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
150+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
135151
-> Allows to specify options for client script in the browser or disable client script.
136152
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
137153
Details:
@@ -171,7 +187,7 @@ exports[`options validate should throw an error on the "client" option with '{"w
171187
exports[`options validate should throw an error on the "client" option with '{"webSocketURL":{"port":true}}' value 1`] = `
172188
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
173189
- options.client should be one of these:
174-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
190+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
175191
-> Allows to specify options for client script in the browser or disable client script.
176192
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
177193
Details:
@@ -186,7 +202,7 @@ exports[`options validate should throw an error on the "client" option with '{"w
186202
exports[`options validate should throw an error on the "client" option with '{"webSocketURL":{"username":123,"password":976}}' value 1`] = `
187203
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
188204
- options.client should be one of these:
189-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
205+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
190206
-> Allows to specify options for client script in the browser or disable client script.
191207
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
192208
Details:
@@ -199,13 +215,13 @@ exports[`options validate should throw an error on the "client" option with '{"w
199215
exports[`options validate should throw an error on the "client" option with 'whoops!' value 1`] = `
200216
"ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
201217
- options.client should be one of these:
202-
false | object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
218+
false | object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }
203219
-> Allows to specify options for client script in the browser or disable client script.
204220
-> Read more at https://webpack.js.org/configuration/dev-server/#devserverclient
205221
Details:
206222
* options.client should be false.
207223
* options.client should be an object:
208-
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }"
224+
object { logging?, overlay?, progress?, reconnect?, webSocketTransport?, webSocketURL? }"
209225
`;
210226

211227
exports[`options validate should throw an error on the "compress" option with '' value 1`] = `

‎test/cli/__snapshots__/basic.test.js.snap.webpack4

+2
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,8 @@ Options:
6969
--no-client-overlay-errors Negative 'client-overlay-errors' option.
7070
--client-overlay-warnings Enables a full-screen overlay in the browser when there are compiler warnings.
7171
--no-client-overlay-warnings Negative 'client-overlay-warnings' option.
72+
--client-reconnect [value] Tells dev-server the number of times it should try to reconnect the client.
73+
--no-client-reconnect Tells dev-server to not to try to connect the client.
7274
--client-web-socket-url <value> Allows to specify URL to web socket server (useful when you're proxying dev server and client script does not always know where to connect to).
7375
--client-web-socket-url-hostname <value> Tells clients connected to devServer to use the provided hostname.
7476
--client-web-socket-url-port <value> Tells clients connected to devServer to use the provided port.

‎test/cli/__snapshots__/basic.test.js.snap.webpack5

+2
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,8 @@ Options:
6969
--no-client-overlay-warnings Negative 'client-overlay-warnings' option.
7070
--client-progress Prints compilation progress in percentage in the browser.
7171
--no-client-progress Negative 'client-progress' option.
72+
--client-reconnect [value] Tells dev-server the number of times it should try to reconnect the client.
73+
--no-client-reconnect Negative 'client-reconnect' option.
7274
--client-web-socket-transport <value> Allows to set custom web socket transport to communicate with dev server.
7375
--client-web-socket-url <value> Allows to specify URL to web socket server (useful when you're proxying dev server and client script does not always know where to connect to).
7476
--client-web-socket-url-hostname <value> Tells clients connected to devServer to use the provided hostname.

0 commit comments

Comments
 (0)