Add a dialog before closing the page to inform user when there're still background tasks running

1 files changed, 11 insertions, 0 deletions

diff --git a/frontend/src/@modules/task/index.ts b/frontend/src/@modules/task/index.ts
index aee555b0d..02483e990 100644
--- a/frontend/src/@modules/task/index.ts
+++ b/frontend/src/@modules/task/index.ts
@@ -12,6 +12,17 @@ class BackgroundTask {
   private groups: Task.Group;
   constructor() {
     this.groups = {};
+    window.addEventListener("beforeunload", this.onBeforeUnload.bind(this));
+  }
+
+  private onBeforeUnload(e: BeforeUnloadEvent) {
+    const message = "Background tasks are still running";
+    if (Object.keys(this.groups).length !== 0) {
+      e.preventDefault();
+      e.returnValue = message;
+      return;
+    }
+    delete e["returnValue"];
   }
 
   dispatch<T extends Task.Callable>(groupName: string, tasks: Task.Task<T>[]) {