Navigation Menu

Skip to content

Commit

Permalink
fix: close overlay on disconnection (#3825)
Browse files Browse the repository at this point in the history
  • Loading branch information
@alexander-akait
alexander-akait committed Sep 9, 2021
1 parent 94c398b commit 011bcf1
Show file tree
Hide file tree
Showing 4 changed files with 322 additions and 119 deletions.
12 changes: 8 additions & 4 deletions client-src/index.js
View file
Expand Up @@ -161,12 +161,12 @@ const onSocketMessage = {
log.warn(strippedWarnings[i]);
}

const needShowOverlay =
const needShowOverlayForWarnings =
typeof options.overlay === "boolean"
? options.overlay
: options.overlay && options.overlay.warnings;

if (needShowOverlay) {
if (needShowOverlayForWarnings) {
show(warnings, "warnings");
}

Expand All @@ -185,12 +185,12 @@ const onSocketMessage = {
log.error(strippedErrors[i]);
}

const needShowOverlay =
const needShowOverlayForErrors =
typeof options.overlay === "boolean"
? options.overlay
: options.overlay && options.overlay.errors;

if (needShowOverlay) {
if (needShowOverlayForErrors) {
show(errors, "errors");
}
},
Expand All @@ -200,6 +200,10 @@ const onSocketMessage = {
close() {
log.info("Disconnected!");

if (options.overlay) {
hide();
}

sendMessage("Close");
},
};
Expand Down
170 changes: 120 additions & 50 deletions test/e2e/__snapshots__/overlay.test.js.snap.webpack4
View file
@@ -1,5 +1,33 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`overlay should not show a warning when "client.overlay" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show a warning when "client.overlay.warnings" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show an error when "client.overlay" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show an error when "client.overlay.errors" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show initially, then show on an error and allow to close: overlay html 1`] = `
"<body>
<div
Expand Down Expand Up @@ -314,35 +342,7 @@ exports[`overlay should not show initially, then show on an error, then show oth
"
`;

exports[`overlay should not show on a warning when "client.overlay" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show on a warning when "client.overlay.warnings" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show on an error when "client.overlay" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should not show on an error when "client.overlay.errors" is "false": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should show on a warning and error for initial compilation and protects against xss: overlay html 1`] = `
exports[`overlay should show a warning and error for initial compilation and protects against xss: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -391,7 +391,7 @@ exports[`overlay should show on a warning and error for initial compilation and
"
`;

exports[`overlay should show on a warning and error for initial compilation and protects against xss: page html 1`] = `
exports[`overlay should show a warning and error for initial compilation and protects against xss: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -410,7 +410,7 @@ exports[`overlay should show on a warning and error for initial compilation and
"
`;

exports[`overlay should show on a warning and error for initial compilation: overlay html 1`] = `
exports[`overlay should show a warning and error for initial compilation: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -474,7 +474,7 @@ exports[`overlay should show on a warning and error for initial compilation: ove
"
`;

exports[`overlay should show on a warning and error for initial compilation: page html 1`] = `
exports[`overlay should show a warning and error for initial compilation: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -493,7 +493,77 @@ exports[`overlay should show on a warning and error for initial compilation: pag
"
`;

exports[`overlay should show on a warning for initial compilation: overlay html 1`] = `
exports[`overlay should show a warning and hide them after closing connection: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
style=\\"
position: fixed;
box-sizing: border-box;
inset: 0px;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.85);
color: rgb(232, 232, 232);
font-family: Menlo, Consolas, monospace;
font-size: large;
padding: 2rem;
line-height: 1.2;
white-space: pre-wrap;
overflow: auto;
\\"
>
<span>Compiled with problems:</span
><button
style=\\"
background: transparent;
border: none;
font-size: 20px;
font-weight: bold;
color: white;
cursor: pointer;
float: right;
\\"
>
X</button
><br /><br />
<div>
<span style=\\"color: rgb(227, 96, 73)\\">Warning:</span><br /><br />
<div>Warning from compilation</div>
<br /><br />
</div>
</div>
</body>
"
`;

exports[`overlay should show a warning and hide them after closing connection: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
id=\\"webpack-dev-server-client-overlay\\"
src=\\"about:blank\\"
style=\\"
position: fixed;
inset: 0px;
width: 100vw;
height: 100vh;
border: none;
z-index: 2147483647;
\\"
></iframe>
</body>
"
`;

exports[`overlay should show a warning and hide them after closing connection: page html 2`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
</body>
"
`;

exports[`overlay should show a warning for initial compilation: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -537,7 +607,7 @@ exports[`overlay should show on a warning for initial compilation: overlay html
"
`;

exports[`overlay should show on a warning for initial compilation: page html 1`] = `
exports[`overlay should show a warning for initial compilation: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -556,7 +626,7 @@ exports[`overlay should show on a warning for initial compilation: page html 1`]
"
`;

exports[`overlay should show on a warning when "client.overlay" is "true": overlay html 1`] = `
exports[`overlay should show a warning when "client.overlay" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -600,7 +670,7 @@ exports[`overlay should show on a warning when "client.overlay" is "true": overl
"
`;

exports[`overlay should show on a warning when "client.overlay" is "true": page html 1`] = `
exports[`overlay should show a warning when "client.overlay" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -619,7 +689,7 @@ exports[`overlay should show on a warning when "client.overlay" is "true": page
"
`;

exports[`overlay should show on a warning when "client.overlay.errors" is "true": overlay html 1`] = `
exports[`overlay should show a warning when "client.overlay.errors" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -663,7 +733,7 @@ exports[`overlay should show on a warning when "client.overlay.errors" is "true"
"
`;

exports[`overlay should show on a warning when "client.overlay.errors" is "true": page html 1`] = `
exports[`overlay should show a warning when "client.overlay.errors" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -682,7 +752,7 @@ exports[`overlay should show on a warning when "client.overlay.errors" is "true"
"
`;

exports[`overlay should show on a warning when "client.overlay.warnings" is "true": overlay html 1`] = `
exports[`overlay should show a warning when "client.overlay.warnings" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -726,7 +796,7 @@ exports[`overlay should show on a warning when "client.overlay.warnings" is "tru
"
`;

exports[`overlay should show on a warning when "client.overlay.warnings" is "true": page html 1`] = `
exports[`overlay should show a warning when "client.overlay.warnings" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -745,7 +815,7 @@ exports[`overlay should show on a warning when "client.overlay.warnings" is "tru
"
`;

exports[`overlay should show on an ansi formatted error for initial compilation: overlay html 1`] = `
exports[`overlay should show an ansi formatted error for initial compilation: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -802,7 +872,7 @@ exports[`overlay should show on an ansi formatted error for initial compilation:
"
`;

exports[`overlay should show on an ansi formatted error for initial compilation: page html 1`] = `
exports[`overlay should show an ansi formatted error for initial compilation: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -821,7 +891,7 @@ exports[`overlay should show on an ansi formatted error for initial compilation:
"
`;

exports[`overlay should show on an error for initial compilation: overlay html 1`] = `
exports[`overlay should show an error for initial compilation: overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -865,7 +935,7 @@ exports[`overlay should show on an error for initial compilation: overlay html 1
"
`;

exports[`overlay should show on an error for initial compilation: page html 1`] = `
exports[`overlay should show an error for initial compilation: page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -884,7 +954,7 @@ exports[`overlay should show on an error for initial compilation: page html 1`]
"
`;

exports[`overlay should show on an error when "client.overlay" is "true": overlay html 1`] = `
exports[`overlay should show an error when "client.overlay" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -928,7 +998,7 @@ exports[`overlay should show on an error when "client.overlay" is "true": overla
"
`;

exports[`overlay should show on an error when "client.overlay" is "true": page html 1`] = `
exports[`overlay should show an error when "client.overlay" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -947,7 +1017,7 @@ exports[`overlay should show on an error when "client.overlay" is "true": page h
"
`;

exports[`overlay should show on an error when "client.overlay.errors" is "true": overlay html 1`] = `
exports[`overlay should show an error when "client.overlay.errors" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -991,7 +1061,7 @@ exports[`overlay should show on an error when "client.overlay.errors" is "true":
"
`;

exports[`overlay should show on an error when "client.overlay.errors" is "true": page html 1`] = `
exports[`overlay should show an error when "client.overlay.errors" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand All @@ -1010,7 +1080,7 @@ exports[`overlay should show on an error when "client.overlay.errors" is "true":
"
`;

exports[`overlay should show on an error when "client.overlay.warnings" is "true": overlay html 1`] = `
exports[`overlay should show an error when "client.overlay.warnings" is "true": overlay html 1`] = `
"<body>
<div
id=\\"webpack-dev-server-client-overlay-div\\"
Expand Down Expand Up @@ -1054,7 +1124,7 @@ exports[`overlay should show on an error when "client.overlay.warnings" is "true
"
`;

exports[`overlay should show on an error when "client.overlay.warnings" is "true": page html 1`] = `
exports[`overlay should show an error when "client.overlay.warnings" is "true": page html 1`] = `
"<body>
<script type=\\"text/javascript\\" charset=\\"utf-8\\" src=\\"/main.js\\"></script>
<iframe
Expand Down

0 comments on commit 011bcf1

Please sign in to comment.