[EC-598] feat: half-implemented user interfacing

apps/browser/src/background/main.background.ts

@@ -9,6 +9,7 @@ import { CryptoFunctionService as CryptoFunctionServiceAbstraction } from "@bitw
 import { EncryptService } from "@bitwarden/common/abstractions/encrypt.service";
 import { EventService as EventServiceAbstraction } from "@bitwarden/common/abstractions/event.service";
 import { ExportService as ExportServiceAbstraction } from "@bitwarden/common/abstractions/export.service";
+import { Fido2UserInterfaceService as Fido2UserInterfaceServiceAbstraction } from "@bitwarden/common/abstractions/fido2/fido2-user-interface.service.abstraction";
 import { Fido2Service as Fido2ServiceAbstraction } from "@bitwarden/common/abstractions/fido2/fido2.service.abstraction";
 import { FileUploadService as FileUploadServiceAbstraction } from "@bitwarden/common/abstractions/fileUpload.service";
 import { FolderApiServiceAbstraction } from "@bitwarden/common/abstractions/folder/folder-api.service.abstraction";
@@ -99,6 +100,7 @@ import BrowserLocalStorageService from "../services/browserLocalStorage.service"
 import BrowserMessagingService from "../services/browserMessaging.service";
 import BrowserMessagingPrivateModeBackgroundService from "../services/browserMessagingPrivateModeBackground.service";
 import BrowserPlatformUtilsService from "../services/browserPlatformUtils.service";
+import { BrowserFido2UserInterfaceService } from "../services/fido2/browser-fido2-user-interface.service";
 import { FolderService } from "../services/folders/folder.service";
 import I18nService from "../services/i18n.service";
 import { KeyGenerationService } from "../services/keyGeneration.service";
@@ -117,6 +119,16 @@ import RuntimeBackground from "./runtime.background";
 import TabsBackground from "./tabs.background";
 import WebRequestBackground from "./webRequest.background";
 
+export class Fido2UserInterfaceService implements Fido2UserInterfaceServiceAbstraction {
+  async verifyUser(): Promise<boolean> {
+    return false;
+  }
+
+  async verifyPresence(): Promise<boolean> {
+    return false;
+  }
+}
+
 export default class MainBackground {
   messagingService: MessagingServiceAbstraction;
   storageService: AbstractStorageService;
@@ -167,6 +179,7 @@ export default class MainBackground {
   policyApiService: PolicyApiServiceAbstraction;
   userVerificationApiService: UserVerificationApiServiceAbstraction;
   syncNotifierService: SyncNotifierServiceAbstraction;
+  fido2UserInterfaceService: Fido2UserInterfaceServiceAbstraction;
   fido2Service: Fido2ServiceAbstraction;
 
   // Passed to the popup for Safari to workaround issues with theming, downloading, etc.
@@ -355,7 +368,7 @@ export default class MainBackground {
       // AuthService should send the messages to the background not popup.
       send = (subscriber: string, arg: any = {}) => {
         const message = Object.assign({}, { command: subscriber }, arg);
-        that.runtimeBackground.processMessage(message, that, null);
+        that.runtimeBackground.processMessage(message, that);
       };
     })();
     this.authService = new AuthService(
@@ -464,7 +477,8 @@ export default class MainBackground {
       this.userVerificationApiService
     );
 
-    this.fido2Service = new Fido2Service();
+    this.fido2UserInterfaceService = new BrowserFido2UserInterfaceService(this.popupUtilsService);
+    this.fido2Service = new Fido2Service(this.fido2UserInterfaceService);
 
     const systemUtilsServiceReloadCallback = () => {
       const forceWindowReload =

apps/browser/src/background/nativeMessaging.background.ts

@@ -334,7 +334,7 @@ export class NativeMessagingBackground {
             return;
           }
 
-          this.runtimeBackground.processMessage({ command: "unlocked" }, null, null);
+          this.runtimeBackground.processMessage({ command: "unlocked" }, null);
         }
         break;
       }

apps/browser/src/background/runtime.background.ts

@@ -47,16 +47,20 @@ export default class RuntimeBackground {
       sender: chrome.runtime.MessageSender,
       sendResponse: any
     ) => {
-      await this.processMessage(msg, sender, sendResponse);
+      const response = await this.processMessage(msg, sender);
+      sendResponse(response);
     };
 
-    BrowserApi.messageListener("runtime.background", backgroundMessageListener);
+    BrowserApi.messageListener("runtime.background", (msg, sender, sendResponse) => {
+      backgroundMessageListener(msg, sender, sendResponse);
+      return true;
+    });
     if (this.main.popupOnlyContext) {
       (window as any).bitwardenBackgroundMessageListener = backgroundMessageListener;
     }
   }
 
-  async processMessage(msg: any, sender: any, sendResponse: any) {
+  async processMessage(msg: any, sender: any): Promise<unknown> {
     switch (msg.command) {
       case "loggedIn":
       case "unlocked": {
@@ -205,11 +209,9 @@ export default class RuntimeBackground {
         this.platformUtilsService.copyToClipboard(msg.identifier, { window: window });
         break;
       case "fido2RegisterCredentialRequest":
-        sendResponse(await this.main.fido2Service.createCredential(msg.data));
+        return await this.main.fido2Service.createCredential(msg.data);
-        break;
-      default:
-        break;
     }
+    return undefined;
   }
 
   private async autofillPage(tabToAutoFill: chrome.tabs.Tab) {

apps/browser/src/browser/browserApi.ts

@@ -126,13 +126,21 @@ export class BrowserApi {
     chrome.tabs.create({ url: url, active: active });
   }
 
+  static createNewWindow(
+    url: string,
+    focused = true,
+    type: chrome.windows.createTypeEnum = "normal"
+  ) {
+    chrome.windows.create({ url, focused, type });
+  }
+
   static messageListener(
     name: string,
-    callback: (message: any, sender: chrome.runtime.MessageSender, response: any) => void
+    callback: (message: any, sender: chrome.runtime.MessageSender, response: any) => unknown
   ) {
     chrome.runtime.onMessage.addListener(
       (msg: any, sender: chrome.runtime.MessageSender, response: any) => {
-        callback(msg, sender, response);
+        return callback(msg, sender, response);
       }
     );
   }

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

@@ -67,7 +67,7 @@ export class PopupUtilsService {
         height: Math.round(bodyRect.height || 600),
       });
 
-      if (this.inPopup(win)) {
+      if (win && this.inPopup(win)) {
         BrowserApi.closePopup(win);
       }
     } else if (typeof chrome !== "undefined" && chrome.tabs && chrome.tabs.create) {

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

@@ -0,0 +1,43 @@
+import { Fido2UserInterfaceService as Fido2UserInterfaceServiceAbstraction } from "@bitwarden/common/abstractions/fido2/fido2-user-interface.service.abstraction";
+
+import { BrowserApi } from "../../browser/browserApi";
+import { PopupUtilsService } from "../../popup/services/popup-utils.service";
+
+const BrowserFido2MessageName = "BrowserFido2UserInterfaceServiceMessage";
+
+type BrowserFido2Message = {
+  type: "VerifyUserRequest";
+  id: string;
+};
+
+export interface BrowserFido2UserInterfaceRequestData {
+  requestId: string;
+}
+
+export class BrowserFido2UserInterfaceService implements Fido2UserInterfaceServiceAbstraction {
+  constructor(private popupUtilsService: PopupUtilsService) {
+    BrowserApi.messageListener(BrowserFido2MessageName, this.processMessage.bind(this));
+  }
+
+  async verifyUser(): Promise<boolean> {
+    return false;
+  }
+
+  async verifyPresence(): Promise<boolean> {
+    // eslint-disable-next-line no-console
+    console.log("User Presence Verification requested");
+    const id = "test";
+    this.popupUtilsService.popOut(null, `popup/index.html?uilocation=popout#/fido2?id=${id}`);
+    return await new Promise((resolve) => setTimeout(resolve, 60000));
+  }
+
+  private processMessage(msg: BrowserFido2Message) {
+    // eslint-disable-next-line no-console
+    console.log("BrowserFido2UserInterfaceService.processMessage", { msg });
+  }
+
+  private sendMessage(msg: BrowserFido2Message) {
+    chrome.runtime.sendMessage({ test: "wat" });
+    BrowserApi.sendMessage(BrowserFido2MessageName, msg);
+  }
+}

libs/common/src/abstractions/fido2/fido2-user-interface.service.abstraction.ts

@@ -0,0 +1,4 @@
+export abstract class Fido2UserInterfaceService {
+  verifyUser: () => Promise<boolean>;
+  verifyPresence: () => Promise<boolean>;
+}

libs/common/src/abstractions/fido2/fido2.service.abstraction.ts

@@ -34,6 +34,6 @@ export interface CredentialRegistrationParams {
 }
 
 export abstract class Fido2Service {
-  createCredential: (params: CredentialRegistrationParams) => unknown;
+  createCredential: (params: CredentialRegistrationParams) => Promise<unknown>;
   assertCredential: () => unknown;
 }

libs/common/src/services/fido2/fido2.service.ts

@@ -1,10 +1,14 @@
+import { Fido2UserInterfaceService } from "../../abstractions/fido2/fido2-user-interface.service.abstraction";
 import {
   CredentialRegistrationParams,
   Fido2Service as Fido2ServiceAbstraction,
 } from "../../abstractions/fido2/fido2.service.abstraction";
 
 export class Fido2Service implements Fido2ServiceAbstraction {
-  createCredential(params: CredentialRegistrationParams): unknown {
+  constructor(private fido2UserInterfaceService: Fido2UserInterfaceService) {}
+
+  async createCredential(params: CredentialRegistrationParams): Promise<unknown> {
+    await this.fido2UserInterfaceService.verifyPresence();
     // eslint-disable-next-line no-console
     console.log("Fido2Service.registerCredential", params);
     return "createCredential response";

libs/common/src/services/fido2/noop-fido2-user-interface.service.ts

@@ -0,0 +1,11 @@
+import { Fido2UserInterfaceService as Fido2UserInterfaceServiceAbstraction } from "../../abstractions/fido2/fido2-user-interface.service.abstraction";
+
+export class Fido2UserInterfaceService implements Fido2UserInterfaceServiceAbstraction {
+  async verifyUser(): Promise<boolean> {
+    return false;
+  }
+
+  async verifyPresence(): Promise<boolean> {
+    return false;
+  }
+}