Skip to content

Commit

Permalink
feat: allow to configure more client options via resource URL (#4274)
Browse files Browse the repository at this point in the history
  • Loading branch information
@snitin315
snitin315 committed Jul 25, 2022
1 parent cffffba commit 216e3cb
Show file tree
Hide file tree
Showing 50 changed files with 854 additions and 1,187 deletions.
42 changes: 34 additions & 8 deletions client-src/index.js
View file
Expand Up @@ -5,7 +5,7 @@ import stripAnsi from "./utils/stripAnsi.js";
import parseURL from "./utils/parseURL.js";
import socket from "./socket.js";
import { formatProblem, show, hide } from "./overlay.js";
import { log, setLogLevel } from "./utils/log.js";
import { log, logEnabledFeatures, setLogLevel } from "./utils/log.js";
import sendMessage from "./utils/sendMessage.js";
import reloadApp from "./utils/reloadApp.js";
import createSocketURL from "./utils/createSocketURL.js";
Expand Down Expand Up @@ -46,16 +46,44 @@ const options = {
};
const parsedResourceQuery = parseURL(__resourceQuery);

const enabledFeatures = {
"Hot Module Replacement": false,
"Live Reloading": false,
Progress: false,
Overlay: false,
};

if (parsedResourceQuery.hot === "true") {
options.hot = true;

log.info("Hot Module Replacement enabled.");
enabledFeatures["Hot Module Replacement"] = true;
}

if (parsedResourceQuery["live-reload"] === "true") {
options.liveReload = true;
enabledFeatures["Live Reloading"] = true;
}

log.info("Live Reloading enabled.");
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,
...options.overlay,
};
}
enabledFeatures.Overlay = true;
}

if (parsedResourceQuery.logging) {
Expand All @@ -66,6 +94,8 @@ if (typeof parsedResourceQuery.reconnect !== "undefined") {
options.reconnect = Number(parsedResourceQuery.reconnect);
}

logEnabledFeatures(enabledFeatures);

/**
* @param {string} level
*/
Expand All @@ -92,17 +122,13 @@ const onSocketMessage = {
}

options.hot = true;

log.info("Hot Module Replacement enabled.");
},
liveReload() {
if (parsedResourceQuery["live-reload"] === "false") {
return;
}

options.liveReload = true;

log.info("Live Reloading enabled.");
},
invalid() {
log.info("App updated. Recompiling...");
Expand Down
20 changes: 19 additions & 1 deletion client-src/utils/log.js
View file
Expand Up @@ -18,4 +18,22 @@ setLogLevel(defaultLevel);

const log = logger.getLogger(name);

export { log, setLogLevel };
const logEnabledFeatures = (features) => {
const enabledFeatures = Object.entries(features);
if (!features || enabledFeatures.length === 0) {
return;
}

let logString = "Server started:";

// Server started: Hot Module Replacement enabled, Live Reloading enabled, Overlay disabled.
for (const [key, value] of Object.entries(features)) {
logString += ` ${key} ${value ? "enabled" : "disabled"},`;
}
// replace last comma with a period
logString = logString.slice(0, -1).concat(".");

log.info(logString);
};

export { log, logEnabledFeatures, setLogLevel };
21 changes: 21 additions & 0 deletions lib/Server.js
View file
Expand Up @@ -597,6 +597,19 @@ class Server {
searchParams.set("logging", client.logging);
}

if (typeof client.progress !== "undefined") {
searchParams.set("progress", String(client.progress));
}

if (typeof client.overlay !== "undefined") {
searchParams.set(
"overlay",
typeof client.overlay === "boolean"
? String(client.overlay)
: JSON.stringify(client.overlay)
);
}

if (typeof client.reconnect !== "undefined") {
searchParams.set(
"reconnect",
Expand All @@ -606,6 +619,14 @@ class Server {
);
}

if (typeof this.options.hot !== "undefined") {
searchParams.set("hot", String(this.options.hot));
}

if (typeof this.options.liveReload !== "undefined") {
searchParams.set("live-reload", String(this.options.liveReload));
}

webSocketURLStr = searchParams.toString();
}

Expand Down
4 changes: 0 additions & 4 deletions test/client/__snapshots__/index.test.js.snap.webpack4
View file
Expand Up @@ -14,10 +14,6 @@ exports[`index should run onSocketMessage.close 2`] = `"Close"`;

exports[`index should run onSocketMessage.error 1`] = `"error!!"`;

exports[`index should run onSocketMessage.hot 1`] = `"Hot Module Replacement enabled."`;

exports[`index should run onSocketMessage.liveReload 1`] = `"Live Reloading enabled."`;

exports[`index should run onSocketMessage.ok 1`] = `"Ok"`;

exports[`index should run onSocketMessage.ok 2`] = `
Expand Down
4 changes: 0 additions & 4 deletions test/client/__snapshots__/index.test.js.snap.webpack5
View file
Expand Up @@ -14,10 +14,6 @@ exports[`index should run onSocketMessage.close 2`] = `"Close"`;

exports[`index should run onSocketMessage.error 1`] = `"error!!"`;

exports[`index should run onSocketMessage.hot 1`] = `"Hot Module Replacement enabled."`;

exports[`index should run onSocketMessage.liveReload 1`] = `"Live Reloading enabled."`;

exports[`index should run onSocketMessage.ok 1`] = `"Ok"`;

exports[`index should run onSocketMessage.ok 2`] = `
Expand Down
71 changes: 57 additions & 14 deletions test/client/index.test.js
View file
Expand Up @@ -25,6 +25,7 @@ describe("index", () => {
warn: jest.fn(),
error: jest.fn(),
},
logEnabledFeatures: jest.fn(),
setLogLevel: jest.fn(),
});

Expand Down Expand Up @@ -83,18 +84,6 @@ describe("index", () => {
expect(socket.mock.calls[0]).toMatchSnapshot();
});

test("should run onSocketMessage.hot", () => {
onSocketMessage.hot();

expect(log.log.info.mock.calls[0][0]).toMatchSnapshot();
});

test("should run onSocketMessage.liveReload", () => {
onSocketMessage.liveReload();

expect(log.log.info.mock.calls[0][0]).toMatchSnapshot();
});

test("should run onSocketMessage['still-ok']", () => {
onSocketMessage["still-ok"]();

Expand Down Expand Up @@ -207,6 +196,60 @@ describe("index", () => {
expect(overlay.show).toBeCalled();
});

test("should parse overlay options from resource query", () => {
jest.isolateModules(() => {
// Pass JSON config with warnings disabled
global.__resourceQuery = `?overlay=${encodeURIComponent(
`{"warnings": false}`
)}`;
overlay.show.mockReset();
socket.mockReset();
jest.unmock("../../client-src/utils/parseURL.js");
require("../../client-src");
onSocketMessage = socket.mock.calls[0][1];

onSocketMessage.warnings(["warn1"]);
expect(overlay.show).not.toBeCalled();

onSocketMessage.errors(["error1"]);
expect(overlay.show).toBeCalledTimes(1);
});

jest.isolateModules(() => {
// Pass JSON config with errors disabled
global.__resourceQuery = `?overlay=${encodeURIComponent(
`{"errors": false}`
)}`;
overlay.show.mockReset();
socket.mockReset();
jest.unmock("../../client-src/utils/parseURL.js");
require("../../client-src");
onSocketMessage = socket.mock.calls[0][1];

onSocketMessage.errors(["error1"]);
expect(overlay.show).not.toBeCalled();

onSocketMessage.warnings(["warn1"]);
expect(overlay.show).toBeCalledTimes(1);
});

jest.isolateModules(() => {
// Use simple boolean
global.__resourceQuery = "?overlay=true";
jest.unmock("../../client-src/utils/parseURL.js");
socket.mockReset();
overlay.show.mockReset();
require("../../client-src");
onSocketMessage = socket.mock.calls[0][1];

onSocketMessage.warnings(["warn2"]);
expect(overlay.show).toBeCalledTimes(1);

onSocketMessage.errors(["error2"]);
expect(overlay.show).toBeCalledTimes(2);
});
});

test("should run onSocketMessage.error", () => {
onSocketMessage.error("error!!");

Expand All @@ -225,7 +268,7 @@ describe("index", () => {
onSocketMessage.hot();
onSocketMessage.close();

expect(log.log.info.mock.calls[1][0]).toMatchSnapshot();
expect(log.log.info.mock.calls[0][0]).toMatchSnapshot();
expect(sendMessage.mock.calls[0][0]).toMatchSnapshot();
});

Expand All @@ -234,7 +277,7 @@ describe("index", () => {
onSocketMessage.liveReload();
onSocketMessage.close();

expect(log.log.info.mock.calls[1][0]).toMatchSnapshot();
expect(log.log.info.mock.calls[0][0]).toMatchSnapshot();
expect(sendMessage.mock.calls[0][0]).toMatchSnapshot();
});

Expand Down

0 comments on commit 216e3cb

Please sign in to comment.