feat: WebAuthn credential management methods [v0.50.0]

CHANGELOG.md

@@ -7,6 +7,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [unreleased]
 
+## [0.50] - 2025-08-11
+
+-   Add WebAuthn credential management methods: `listCredentials`, `removeCredential`
+-   Added `createAndRegisterCredentialWithUser` method that creates and registers a credential with a user
+
+### Breaking changes
+
+-   The `registerCredential` method has been renamed to `createCredential`. This was done to better represent the creation of a credential and not the actual registration of it with the backend API. The new `registerCredential` implementation now calls the backend API.
+
 ## [0.49.1] - 2025-03-27
 
 -   Fixed a type issue making the WebauthnPreBuitlUI not produce a type error when added to the prebuiltUIList

lib/ts/recipe/webauthn/components/features/recoverAccountWithToken/index.tsx

@@ -131,7 +131,7 @@ export const RecoverAccountUsingToken: React.FC<RecoverAccountWithTokenProps> =
 
         // Use the register options to register the credential and recover the account.
         // We should have received a valid registration options response.
-        const registerCredentialResponse = await props.recipe.webJSRecipe.registerCredential({
+        const registerCredentialResponse = await props.recipe.webJSRecipe.createCredential({
             registrationOptions: registerOptions,
             userContext: props.userContext,
         });

lib/ts/recipe/webauthn/index.ts

@@ -247,7 +247,7 @@ export default class Wrapper {
         return Webauthn.getInstanceOrThrow().webJSRecipe.recoverAccount(input);
     }
 
-    static registerCredential(input: {
+    static createCredential(input: {
         registrationOptions: Omit<RegistrationOptions, "fetchResponse" | "status">;
         userContext: any;
     }): Promise<
@@ -267,7 +267,7 @@ export default class Wrapper {
               error: any;
           }
     > {
-        return Webauthn.getInstanceOrThrow().webJSRecipe.registerCredential(input);
+        return Webauthn.getInstanceOrThrow().webJSRecipe.createCredential(input);
     }
 
     static authenticateCredential(input: {
@@ -439,6 +439,69 @@ export default class Wrapper {
         return Webauthn.getInstanceOrThrow().webJSRecipe.registerCredentialWithRecoverAccount(input);
     }
 
+    static listCredentials(input: { options?: RecipeFunctionOptions; userContext: any }): Promise<
+        | {
+              status: "OK";
+              credentials: {
+                  webauthnCredentialId: string;
+                  relyingPartyId: string;
+                  recipeUserId: string;
+                  createdAt: number;
+              }[];
+          }
+        | GeneralErrorResponse
+    > {
+        return Webauthn.getInstanceOrThrow().webJSRecipe.listCredentials(input);
+    }
+
+    static removeCredential(input: {
+        webauthnCredentialId: string;
+        userContext: any;
+    }): Promise<
+        { status: "OK" } | GeneralErrorResponse | { status: "CREDENTIAL_NOT_FOUND_ERROR"; fetchResponse: Response }
+    > {
+        return Webauthn.getInstanceOrThrow().webJSRecipe.removeCredential(input);
+    }
+
+    static createAndRegisterCredentialForSessionUser(input: {
+        recipeUserId: string;
+        email: string;
+        options?: RecipeFunctionOptions;
+        userContext: any;
+    }): Promise<
+        | { status: "OK" }
+        | GeneralErrorResponse
+        | { status: "REGISTER_CREDENTIAL_NOT_ALLOWED"; reason?: string }
+        | { status: "INVALID_EMAIL_ERROR"; err: string }
+        | { status: "INVALID_CREDENTIALS_ERROR" }
+        | { status: "OPTIONS_NOT_FOUND_ERROR" }
+        | { status: "INVALID_OPTIONS_ERROR" }
+        | { status: "INVALID_AUTHENTICATOR_ERROR"; reason?: string }
+        | { status: "AUTHENTICATOR_ALREADY_REGISTERED" }
+        | { status: "FAILED_TO_REGISTER_USER"; error: any }
+        | { status: "WEBAUTHN_NOT_SUPPORTED"; error: any }
+    > {
+        return Webauthn.getInstanceOrThrow().webJSRecipe.createAndRegisterCredentialForSessionUser(input);
+    }
+
+    static registerCredential(input: {
+        recipeUserId: string;
+        webauthnGeneratedOptionsId: string;
+        credential: RegistrationResponseJSON;
+        options?: RecipeFunctionOptions;
+        userContext: any;
+    }): Promise<
+        | { status: "OK" }
+        | GeneralErrorResponse
+        | { status: "REGISTER_CREDENTIAL_NOT_ALLOWED"; reason?: string }
+        | { status: "INVALID_CREDENTIALS_ERROR" }
+        | { status: "OPTIONS_NOT_FOUND_ERROR" }
+        | { status: "INVALID_OPTIONS_ERROR" }
+        | { status: "INVALID_AUTHENTICATOR_ERROR"; reason?: string }
+    > {
+        return Webauthn.getInstanceOrThrow().webJSRecipe.registerCredential(input);
+    }
+
     static doesBrowserSupportWebAuthn(input: { userContext: any }): Promise<
         | {
               status: "OK";
@@ -464,11 +527,15 @@ const signIn = Wrapper.signIn;
 const getEmailExists = Wrapper.getEmailExists;
 const generateRecoverAccountToken = Wrapper.generateRecoverAccountToken;
 const recoverAccount = Wrapper.recoverAccount;
-const registerCredential = Wrapper.registerCredential;
+const createCredential = Wrapper.createCredential;
 const authenticateCredential = Wrapper.authenticateCredential;
 const registerCredentialWithSignUp = Wrapper.registerCredentialWithSignUp;
 const authenticateCredentialWithSignIn = Wrapper.authenticateCredentialWithSignIn;
 const registerCredentialWithRecoverAccount = Wrapper.registerCredentialWithRecoverAccount;
+const createAndRegisterCredentialForSessionUser = Wrapper.createAndRegisterCredentialForSessionUser;
+const listCredentials = Wrapper.listCredentials;
+const removeCredential = Wrapper.removeCredential;
+const registerCredential = Wrapper.registerCredential;
 const doesBrowserSupportWebAuthn = Wrapper.doesBrowserSupportWebAuthn;
 const WebauthnComponentsOverrideProvider = Wrapper.ComponentsOverrideProvider;
 
@@ -481,11 +548,15 @@ export {
     getEmailExists,
     generateRecoverAccountToken,
     recoverAccount,
-    registerCredential,
+    createCredential,
     authenticateCredential,
     registerCredentialWithSignUp,
     authenticateCredentialWithSignIn,
     registerCredentialWithRecoverAccount,
+    createAndRegisterCredentialForSessionUser,
     doesBrowserSupportWebAuthn,
     WebauthnComponentsOverrideProvider,
+    listCredentials,
+    removeCredential,
+    registerCredential,
 };

lib/ts/recipe/webauthn/types.ts

@@ -57,7 +57,10 @@ export type PreAndPostAPIHookAction =
     | "SIGN_IN"
     | "EMAIL_EXISTS"
     | "GENERATE_RECOVER_ACCOUNT_TOKEN"
-    | "RECOVER_ACCOUNT";
+    | "RECOVER_ACCOUNT"
+    | "REGISTER_CREDENTIAL"
+    | "REMOVE_CREDENTIAL"
+    | "LIST_CREDENTIALS";
 
 export type OnHandleEventContext =
     | {