Skip to content

Commit 72f8612

Browse files
malcolm-keemalcolm-kee
committed
feat: open editor when clicking error on overlay
1 parent 5b846cb commit 72f8612

File tree

10 files changed

+699
-519
lines changed

10 files changed

+699
-519
lines changed

‎client-src/overlay.js

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -184,7 +184,7 @@ function formatProblem(type, item) {
184184
// Compilation with errors (e.g. syntax error or missing modules).
185185
/**
186186
* @param {string} type
187-
* @param {Array<string | { file?: string, moduleName?: string, loc?: string, message?: string }>} messages
187+
* @param {Array<string | { moduleIdentifier?: string, moduleName?: string, loc?: string, message?: string }>} messages
188188
* @param {string | null} trustedTypesPolicyName
189189
*/
190190
function show(type, messages, trustedTypesPolicyName) {
@@ -203,6 +203,15 @@ function show(type, messages, trustedTypesPolicyName) {
203203
typeElement.innerText = header;
204204
applyStyle(typeElement, msgTypeStyle);
205205

206+
if (message.moduleIdentifier) {
207+
applyStyle(typeElement, { cursor: "pointer" });
208+
typeElement.addEventListener("click", () => {
209+
fetch(
210+
`/webpack-dev-server/open-editor?fileName=${message.moduleIdentifier}`
211+
);
212+
});
213+
}
214+
206215
// Make it look similar to our terminal.
207216
const text = ansiHTML(encode(body));
208217
const messageTextNode = document.createElement("div");

‎examples/client/overlay/app.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,9 @@
22

33
const target = document.querySelector("#target");
44

5+
// eslint-disable-next-line import/no-unresolved, import/extensions
6+
const invalid = require("./invalid.js");
7+
8+
console.log(invalid);
59
target.classList.add("pass");
610
target.innerHTML = "Success!";

‎examples/client/overlay/webpack.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const { setup } = require("../../util");
77
module.exports = setup({
88
context: __dirname,
99
// create error for overlay
10-
entry: "./invalid.js",
10+
entry: "./app.js",
1111
devServer: {
1212
client: {
1313
overlay: true,

‎lib/Server.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ const defaultGateway = require("default-gateway");
1010
const express = require("express");
1111
const { validate } = require("schema-utils");
1212
const schema = require("./options.json");
13+
const launchEditor = require("./launchEditor");
1314

1415
/** @typedef {import("schema-utils/declarations/validate").Schema} Schema */
1516
/** @typedef {import("webpack").Compiler} Compiler */
@@ -2033,6 +2034,25 @@ class Server {
20332034
}
20342035
);
20352036

2037+
/** @type {import("express").Application} */
2038+
(app).get(
2039+
"/webpack-dev-server/open-editor",
2040+
/**
2041+
* @param {Request} req
2042+
* @param {Response} res
2043+
* @returns {void}
2044+
*/
2045+
(req, res) => {
2046+
const fileName = req.query.fileName;
2047+
2048+
if (typeof fileName === "string") {
2049+
launchEditor(this.logger, fileName);
2050+
}
2051+
2052+
res.end();
2053+
}
2054+
);
2055+
20362056
/** @type {import("express").Application} */
20372057
(app).get(
20382058
"/webpack-dev-server",

‎lib/launchEditor.js

Lines changed: 307 additions & 0 deletions
Large diffs are not rendered by default.

‎package-lock.json

Lines changed: 16 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@
6969
"schema-utils": "^4.0.0",
7070
"selfsigned": "^2.1.1",
7171
"serve-index": "^1.9.1",
72+
"shell-quote": "^1.7.3",
7273
"sockjs": "^0.3.24",
7374
"spdy": "^4.0.2",
7475
"webpack-dev-middleware": "^5.3.1",
@@ -88,6 +89,7 @@
8889
"@types/default-gateway": "^3.0.1",
8990
"@types/node-forge": "^1.0.4",
9091
"@types/rimraf": "^3.0.2",
92+
"@types/shell-quote": "^1.7.1",
9193
"@types/sockjs-client": "^1.5.1",
9294
"@types/trusted-types": "^2.0.2",
9395
"acorn": "^8.2.4",

‎test/e2e/__snapshots__/overlay.test.js.snap.webpack5

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,7 @@ exports[`overlay should not show initially, then show on an error and allow to c
9595
font-size: 1.2em;
9696
margin-bottom: 1rem;
9797
font-family: sans-serif;
98+
cursor: pointer;
9899
\\"
99100
>
100101
ERROR in ./foo.js 1:1
@@ -217,6 +218,7 @@ exports[`overlay should not show initially, then show on an error, then hide on
217218
font-size: 1.2em;
218219
margin-bottom: 1rem;
219220
font-family: sans-serif;
221+
cursor: pointer;
220222
\\"
221223
>
222224
ERROR in ./foo.js 1:1
@@ -339,6 +341,7 @@ exports[`overlay should not show initially, then show on an error, then show oth
339341
font-size: 1.2em;
340342
margin-bottom: 1rem;
341343
font-family: sans-serif;
344+
cursor: pointer;
342345
\\"
343346
>
344347
ERROR in ./foo.js 1:1
@@ -424,6 +427,7 @@ exports[`overlay should not show initially, then show on an error, then show oth
424427
font-size: 1.2em;
425428
margin-bottom: 1rem;
426429
font-family: sans-serif;
430+
cursor: pointer;
427431
\\"
428432
>
429433
ERROR in ./foo.js 1:1

0 commit comments

Comments
 (0)