[EC-598] feat: close popout directly from bg script

apps/browser/src/fido2/popup/fido2/fido2.component.ts

@@ -103,8 +103,6 @@ export class Fido2Component implements OnInit, OnDestroy {
               return cipher.decrypt();
             })
           );
-        } else if (message.type === "CloseRequest") {
-          window.close();
         }
 
         return {

apps/browser/src/popup/services/popup-utils.service.ts

@@ -3,6 +3,16 @@ import { fromEvent, Subscription } from "rxjs";
 
 import { BrowserApi } from "../../browser/browserApi";
 
+export type Popout =
+  | {
+      type: "window";
+      window: chrome.windows.Window;
+    }
+  | {
+      type: "tab";
+      tab: chrome.tabs.Tab;
+    };
+
 @Injectable()
 export class PopupUtilsService {
   private unloadSubscription: Subscription;
@@ -45,7 +55,8 @@ export class PopupUtilsService {
     }
   }
 
-  popOut(win: Window, href: string = null, options: { center?: boolean } = {}): void {
+  popOut(win: Window, href: string = null, options: { center?: boolean } = {}): Promise<Popout> {
+    return new Promise((resolve, reject) => {
       if (href === null) {
         href = win.location.href;
       }
@@ -67,14 +78,17 @@ export class PopupUtilsService {
         const height = Math.round(bodyRect.height || 600);
         const top = options.center ? Math.round((screen.height - height) / 2) : undefined;
         const left = options.center ? Math.round((screen.width - width) / 2) : undefined;
-      chrome.windows.create({
+        chrome.windows.create(
+          {
             url: href,
             type: "popup",
             width,
             height,
             top,
             left,
-      });
+          },
+          (window) => resolve({ type: "window", window })
+        );
 
         if (win && this.inPopup(win)) {
           BrowserApi.closePopup(win);
@@ -84,10 +98,26 @@ export class PopupUtilsService {
           .replace("uilocation=popup", "uilocation=tab")
           .replace("uilocation=popout", "uilocation=tab")
           .replace("uilocation=sidebar", "uilocation=tab");
-      chrome.tabs.create({
+        chrome.tabs.create(
+          {
             url: href,
+          },
+          (tab) => resolve({ type: "tab", tab })
+        );
+      } else {
+        reject(new Error("Cannot open tab or window"));
+      }
     });
   }
+
+  closePopOut(popout: Popout): Promise<void> {
+    return new Promise((resolve) => {
+      if (popout.type === "window") {
+        chrome.windows.remove(popout.window.id, resolve);
+      } else {
+        chrome.tabs.remove(popout.tab.id, resolve);
+      }
+    });
   }
 
   /**

apps/browser/src/services/fido2/browser-fido2-user-interface.service.ts

@@ -20,7 +20,7 @@ import {
 import { Utils } from "@bitwarden/common/misc/utils";
 
 import { BrowserApi } from "../../browser/browserApi";
-import { PopupUtilsService } from "../../popup/services/popup-utils.service";
+import { Popout, PopupUtilsService } from "../../popup/services/popup-utils.service";
 
 const BrowserFido2MessageName = "BrowserFido2UserInterfaceServiceMessage";
 
@@ -89,9 +89,6 @@ export type BrowserFido2Message = { sessionId: string } & (
       type: "AbortResponse";
       fallbackRequested: boolean;
     }
-  | {
-      type: "CloseRequest";
-    }
 );
 
 export class BrowserFido2UserInterfaceService implements Fido2UserInterfaceServiceAbstraction {
@@ -120,6 +117,7 @@ export class BrowserFido2UserInterfaceSession implements Fido2UserInterfaceSessi
   );
   private connected$ = new BehaviorSubject(false);
   private destroy$ = new Subject<void>();
+  private popout?: Popout;
 
   private constructor(
     private readonly popupUtilsService: PopupUtilsService,
@@ -252,7 +250,7 @@ export class BrowserFido2UserInterfaceSession implements Fido2UserInterfaceSessi
   }
 
   async close() {
-    await this.send({ type: "CloseRequest", sessionId: this.sessionId });
+    this.popupUtilsService.closePopOut(this.popout);
     this.closed = true;
     this.destroy$.next();
     this.destroy$.complete();
@@ -290,7 +288,7 @@ export class BrowserFido2UserInterfaceSession implements Fido2UserInterfaceSessi
     }
 
     const queryParams = new URLSearchParams({ sessionId: this.sessionId }).toString();
-    this.popupUtilsService.popOut(
+    this.popout = await this.popupUtilsService.popOut(
       null,
       `popup/index.html?uilocation=popout#/fido2?${queryParams}`,
       { center: true }