PM-2035: PRF Unlock (web + extension)

apps/browser/src/_locales/en/messages.json

@@ -28,6 +28,9 @@
   "logInWithPasskey": {
     "message": "Log in with passkey"
   },
+  "unlockWithPasskey": {
+    "message": "Unlock with passkey"
+  },
   "useSingleSignOn": {
     "message": "Use single sign-on"
   },
@@ -1507,6 +1510,15 @@
   "readSecurityKey": {
     "message": "Read security key"
   },
+  "readingPasskeyLoading": {
+    "message": "Reading passkey..."
+  },
+  "passkeyAuthenticationFailed": {
+    "message": "Passkey authentication failed"
+  },
+  "useADifferentLogInMethod": {
+    "message": "Use a different log in method"
+  },
   "awaitingSecurityKeyInteraction": {
     "message": "Awaiting security key interaction..."
   },
@@ -3141,6 +3153,12 @@
   "error": {
     "message": "Error"
   },
+  "prfUnlockFailed": {
+    "message": "Failed to unlock with passkey. Please try again or use another unlock method."
+  },
+  "noPrfCredentialsAvailable": {
+    "message": "No PRF-enabled passkeys are available for unlock. Please log in with a passkey first."
+  },
   "decryptionError": {
     "message": "Decryption error"
   },

apps/browser/src/auth/popup/login/extension-login-component.service.ts

@@ -68,4 +68,18 @@ export class ExtensionLoginComponentService
   showBackButton(showBackButton: boolean): void {
     this.extensionAnonLayoutWrapperDataService.setAnonLayoutWrapperData({ showBackButton });
   }
+
+  /**
+   * Enable passkey login support for chromium-based browsers only.
+   * Neither Firefox nor safari support overriding the relying party ID in an extension.
+   *
+   * https://github.com/w3c/webextensions/issues/238
+   *
+   * Tracking links:
+   * https://bugzilla.mozilla.org/show_bug.cgi?id=1956484
+   * https://developer.apple.com/forums/thread/774351
+   */
+  isLoginWithPasskeySupported(): boolean {
+    return !this.platformUtilsService.isFirefox() && !this.platformUtilsService.isSafari();
+  }
 }

apps/browser/src/key-management/lock/services/extension-lock-component.service.spec.ts

@@ -13,6 +13,7 @@ import {
   BiometricsService,
   BiometricsStatus,
   BiometricStateService,
+  WebAuthnPrfUnlockServiceAbstraction,
 } from "@bitwarden/key-management";
 import { UnlockOptions } from "@bitwarden/key-management-ui";
 
@@ -34,6 +35,7 @@ describe("ExtensionLockComponentService", () => {
   let vaultTimeoutSettingsService: MockProxy<VaultTimeoutSettingsService>;
   let routerService: MockProxy<BrowserRouterService>;
   let biometricStateService: MockProxy<BiometricStateService>;
+  let webAuthnPrfUnlockService: MockProxy<WebAuthnPrfUnlockServiceAbstraction>;
 
   beforeEach(() => {
     userDecryptionOptionsService = mock<UserDecryptionOptionsServiceAbstraction>();
@@ -43,6 +45,7 @@ describe("ExtensionLockComponentService", () => {
     vaultTimeoutSettingsService = mock<VaultTimeoutSettingsService>();
     routerService = mock<BrowserRouterService>();
     biometricStateService = mock<BiometricStateService>();
+    webAuthnPrfUnlockService = mock<WebAuthnPrfUnlockServiceAbstraction>();
 
     TestBed.configureTestingModule({
       providers: [
@@ -75,6 +78,10 @@ describe("ExtensionLockComponentService", () => {
           provide: BiometricStateService,
           useValue: biometricStateService,
         },
+        {
+          provide: WebAuthnPrfUnlockServiceAbstraction,
+          useValue: webAuthnPrfUnlockService,
+        },
       ],
     });
 
@@ -212,6 +219,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: true,
             biometricsStatus: BiometricsStatus.Available,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -234,6 +244,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: true,
             biometricsStatus: BiometricsStatus.Available,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -256,6 +269,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: true,
             biometricsStatus: BiometricsStatus.Available,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -278,6 +294,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: true,
             biometricsStatus: BiometricsStatus.Available,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -300,6 +319,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: false,
             biometricsStatus: BiometricsStatus.UnlockNeeded,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -322,6 +344,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: false,
             biometricsStatus: BiometricsStatus.NotEnabledInConnectedDesktopApp,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
       [
@@ -344,6 +369,9 @@ describe("ExtensionLockComponentService", () => {
             enabled: false,
             biometricsStatus: BiometricsStatus.HardwareUnavailable,
           },
+          prf: {
+            enabled: false,
+          },
         },
       ],
     ];
@@ -374,6 +402,10 @@ describe("ExtensionLockComponentService", () => {
       //  PIN
       pinService.isPinDecryptionAvailable.mockResolvedValue(mockInputs.pinDecryptionAvailable);
 
+      // PRF
+      webAuthnPrfUnlockService.isPrfUnlockAvailable.mockResolvedValue(false);
+      webAuthnPrfUnlockService.getPrfUnlockCredentials.mockResolvedValue([]);
+
       const unlockOptions = await firstValueFrom(service.getAvailableUnlockOptions$(userId));
 
       expect(unlockOptions).toEqual(expectedOutput);

apps/browser/src/key-management/lock/services/extension-lock-component.service.ts

@@ -1,12 +1,13 @@
 // FIXME (PM-22628): angular imports are forbidden in background
 // eslint-disable-next-line no-restricted-imports
-import { inject } from "@angular/core";
+import { Injectable } from "@angular/core";
 import { combineLatest, defer, firstValueFrom, map, Observable } from "rxjs";
 
 import { UserDecryptionOptionsServiceAbstraction } from "@bitwarden/auth/common";
 import { PinServiceAbstraction } from "@bitwarden/common/key-management/pin/pin.service.abstraction";
 import { UserId } from "@bitwarden/common/types/guid";
 import {
+  WebAuthnPrfUnlockServiceAbstraction,
   BiometricsService,
   BiometricsStatus,
   BiometricStateService,
@@ -20,12 +21,16 @@ import BrowserPopupUtils from "../../../platform/browser/browser-popup-utils";
 // eslint-disable-next-line no-restricted-imports
 import { BrowserRouterService } from "../../../platform/popup/services/browser-router.service";
 
+@Injectable()
 export class ExtensionLockComponentService implements LockComponentService {
-  private readonly userDecryptionOptionsService = inject(UserDecryptionOptionsServiceAbstraction);
-  private readonly biometricsService = inject(BiometricsService);
-  private readonly pinService = inject(PinServiceAbstraction);
-  private readonly routerService = inject(BrowserRouterService);
-  private readonly biometricStateService = inject(BiometricStateService);
+  constructor(
+    private readonly userDecryptionOptionsService: UserDecryptionOptionsServiceAbstraction,
+    private readonly biometricsService: BiometricsService,
+    private readonly pinService: PinServiceAbstraction,
+    private readonly biometricStateService: BiometricStateService,
+    private readonly routerService: BrowserRouterService,
+    private readonly webAuthnPrfUnlockService: WebAuthnPrfUnlockServiceAbstraction,
+  ) {}
 
   getPreviousUrl(): string | null {
     return this.routerService.getPreviousUrl() ?? null;
@@ -81,8 +86,16 @@ export class ExtensionLockComponentService implements LockComponentService {
       }),
       this.userDecryptionOptionsService.userDecryptionOptionsById$(userId),
       defer(() => this.pinService.isPinDecryptionAvailable(userId)),
+      defer(async () => {
+        try {
+          const available = await this.webAuthnPrfUnlockService.isPrfUnlockAvailable(userId);
+          return { available };
+        } catch {
+          return { available: false };
+        }
+      }),
     ]).pipe(
-      map(([biometricsStatus, userDecryptionOptions, pinDecryptionAvailable]) => {
+      map(([biometricsStatus, userDecryptionOptions, pinDecryptionAvailable, prfUnlockInfo]) => {
         const unlockOpts: UnlockOptions = {
           masterPassword: {
             enabled: userDecryptionOptions?.hasMasterPassword,
@@ -94,6 +107,9 @@ export class ExtensionLockComponentService implements LockComponentService {
             enabled: biometricsStatus === BiometricsStatus.Available,
             biometricsStatus: biometricsStatus,
           },
+          prf: {
+            enabled: prfUnlockInfo.available,
+          },
         };
         return unlockOpts;
       }),

apps/browser/src/popup/app-routing.module.ts

@@ -12,6 +12,7 @@ import {
   tdeDecryptionRequiredGuard,
   unauthGuardFn,
 } from "@bitwarden/angular/auth/guards";
+import { LoginViaWebAuthnComponent } from "@bitwarden/angular/auth/login-via-webauthn/login-via-webauthn.component";
 import { ChangePasswordComponent } from "@bitwarden/angular/auth/password-management/change-password";
 import { SetInitialPasswordComponent } from "@bitwarden/angular/auth/password-management/set-initial-password/set-initial-password.component";
 import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
@@ -23,6 +24,7 @@ import {
   UserLockIcon,
   VaultIcon,
   LockIcon,
+  TwoFactorAuthSecurityKeyIcon,
 } from "@bitwarden/assets/svg";
 import {
   LoginComponent,
@@ -401,6 +403,29 @@ const routes: Routes = [
           },
         ],
       },
+      {
+        path: "login-with-passkey",
+        canActivate: [unauthGuardFn(unauthRouteOverrides)],
+        data: {
+          pageIcon: TwoFactorAuthSecurityKeyIcon,
+          pageTitle: {
+            key: "logInWithPasskey",
+          },
+          pageSubtitle: {
+            key: "readingPasskeyLoadingInfo",
+          },
+          elevation: 1,
+          showBackButton: true,
+        } satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
+        children: [
+          { path: "", component: LoginViaWebAuthnComponent },
+          {
+            path: "",
+            component: EnvironmentSelectorComponent,
+            outlet: "environment-selector",
+          },
+        ],
+      },
       {
         path: "sso",
         canActivate: [unauthGuardFn(unauthRouteOverrides)],

apps/browser/src/popup/services/services.module.ts

@@ -35,7 +35,9 @@ import {
   LoginEmailService,
   SsoUrlService,
   LogoutService,
+  UserDecryptionOptionsServiceAbstraction,
 } from "@bitwarden/auth/common";
+import { BrowserRouterService } from "@bitwarden/browser/platform/popup/services/browser-router.service";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { EventCollectionService as EventCollectionServiceAbstraction } from "@bitwarden/common/abstractions/event/event-collection.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
@@ -49,6 +51,7 @@ import { MasterPasswordApiService } from "@bitwarden/common/auth/abstractions/ma
 import { SsoLoginServiceAbstraction } from "@bitwarden/common/auth/abstractions/sso-login.service.abstraction";
 import { TokenService } from "@bitwarden/common/auth/abstractions/token.service";
 import { UserVerificationService } from "@bitwarden/common/auth/abstractions/user-verification/user-verification.service.abstraction";
+import { WebAuthnLoginPrfKeyServiceAbstraction } from "@bitwarden/common/auth/abstractions/webauthn/webauthn-login-prf-key.service.abstraction";
 import { AuthRequestAnsweringService } from "@bitwarden/common/auth/services/auth-request-answering/auth-request-answering.service";
 import { PendingAuthRequestsStateService } from "@bitwarden/common/auth/services/auth-request-answering/pending-auth-requests.state";
 import {
@@ -134,9 +137,12 @@ import {
 import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legacy";
 import {
   BiometricsService,
+  BiometricStateService,
   DefaultKeyService,
   KdfConfigService,
   KeyService,
+  WebAuthnPrfUnlockService,
+  WebAuthnPrfUnlockServiceAbstraction,
 } from "@bitwarden/key-management";
 import { LockComponentService } from "@bitwarden/key-management-ui";
 import { DerivedStateProvider, GlobalStateProvider, StateProvider } from "@bitwarden/state";
@@ -529,15 +535,6 @@ const safeProviders: SafeProvider[] = [
     useFactory: () => new Subject<Message<Record<string, unknown>>>(),
     deps: [],
   }),
-  safeProvider({
-    provide: MessageSender,
-    useFactory: (subject: Subject<Message<Record<string, unknown>>>, logService: LogService) =>
-      MessageSender.combine(
-        new SubjectMessageSender(subject), // For sending messages in the same context
-        new ChromeMessageSender(logService), // For sending messages to different contexts
-      ),
-    deps: [INTRAPROCESS_MESSAGING_SUBJECT, LogService],
-  }),
   safeProvider({
     provide: DISK_BACKUP_LOCAL_STORAGE,
     useFactory: (diskStorage: AbstractStorageService & ObservableStorageService) =>
@@ -561,7 +558,14 @@ const safeProviders: SafeProvider[] = [
   safeProvider({
     provide: LockComponentService,
     useClass: ExtensionLockComponentService,
-    deps: [],
+    deps: [
+      UserDecryptionOptionsServiceAbstraction,
+      BiometricsService,
+      PinServiceAbstraction,
+      BiometricStateService,
+      BrowserRouterService,
+      WebAuthnPrfUnlockServiceAbstraction,
+    ],
   }),
   // TODO: PM-18182 - Refactor component services into lazy loaded modules
   safeProvider({
@@ -584,11 +588,6 @@ const safeProviders: SafeProvider[] = [
       PlatformUtilsService,
     ],
   }),
-  safeProvider({
-    provide: ActionsService,
-    useClass: BrowserActionsService,
-    deps: [LogService, PlatformUtilsService],
-  }),
   safeProvider({
     provide: SystemNotificationsService,
     useFactory: (platformUtilsService: PlatformUtilsService) => {
@@ -605,6 +604,19 @@ const safeProviders: SafeProvider[] = [
     useClass: Fido2UserVerificationService,
     deps: [PasswordRepromptService, UserVerificationService, DialogService],
   }),
+  safeProvider({
+    provide: WebAuthnPrfUnlockServiceAbstraction,
+    useClass: WebAuthnPrfUnlockService,
+    deps: [
+      WebAuthnLoginPrfKeyServiceAbstraction,
+      KeyService,
+      UserDecryptionOptionsServiceAbstraction,
+      EncryptService,
+      EnvironmentService,
+      WINDOW,
+      LogService,
+    ],
+  }),
   safeProvider({
     provide: AnimationControlService,
     useClass: DefaultAnimationControlService,