Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: close overlay on disconnection #3825

Merged
merged 3 commits into from Sep 9, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
12 changes: 8 additions & 4 deletions client-src/index.js
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
@@ -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