[EC-598] feat: fully working credential creation

apps/browser/src/browser/webauthn-utils.ts

@@ -1,5 +1,8 @@
 import { Fido2Utils } from "@bitwarden/common/abstractions/fido2/fido2-utils";
-import { CredentialRegistrationParams } from "@bitwarden/common/abstractions/fido2/fido2.service.abstraction";
+import {
+  CredentialRegistrationParams,
+  CredentialRegistrationResult,
+} from "@bitwarden/common/abstractions/fido2/fido2.service.abstraction";
 
 export class WebauthnUtils {
   static mapCredentialCreationOptions(
@@ -44,4 +47,19 @@ export class WebauthnUtils {
       },
     };
   }
+
+  static mapCredentialRegistrationResult(
+    result: CredentialRegistrationResult
+  ): PublicKeyCredential {
+    return {
+      id: result.credentialId,
+      rawId: Fido2Utils.stringToBuffer(result.credentialId),
+      type: "public-key",
+      response: {
+        clientDataJSON: Fido2Utils.stringToBuffer(result.clientDataJSON),
+        attestationObject: Fido2Utils.stringToBuffer(result.attestationObject),
+      } as AuthenticatorAttestationResponse,
+      getClientExtensionResults: () => ({}),
+    };
+  }
 }

apps/browser/src/content/webauthn/content-script.ts

@@ -22,6 +22,7 @@ messenger.addHandler(async (message) => {
           resolve({
             type: MessageType.CredentialCreationResponse,
             approved: true,
+            result: response,
           });
         }
       );

apps/browser/src/content/webauthn/messaging/message.ts

@@ -1,4 +1,7 @@
-import { CredentialRegistrationParams } from "@bitwarden/common/abstractions/fido2/fido2.service.abstraction";
+import {
+  CredentialRegistrationParams,
+  CredentialRegistrationResult,
+} from "@bitwarden/common/abstractions/fido2/fido2.service.abstraction";
 
 export enum MessageType {
   CredentialCreationRequest,
@@ -17,6 +20,7 @@ export type CredentialCreationRequest = {
 export type CredentialCreationResponse = {
   type: MessageType.CredentialCreationResponse;
   approved: boolean;
+  result?: CredentialRegistrationResult;
 };
 
 export type CredentialGetRequest = {

apps/browser/src/content/webauthn/page-script.ts

@@ -14,12 +14,16 @@ const browserCredentials = {
 const messenger = Messenger.forDOMCommunication(window);
 
 navigator.credentials.create = async (options?: CredentialCreationOptions): Promise<Credential> => {
-  await messenger.request({
+  const response = await messenger.request({
     type: MessageType.CredentialCreationRequest,
     data: WebauthnUtils.mapCredentialCreationOptions(options, window.location.origin),
   });
 
-  return await browserCredentials.create(options);
+  if (response.type !== MessageType.CredentialCreationResponse || !response.approved) {
+    return await browserCredentials.create(options);
+  }
+
+  return WebauthnUtils.mapCredentialRegistrationResult(response.result);
 };
 
 navigator.credentials.get = async (options?: CredentialRequestOptions): Promise<Credential> => {