Skip to main content
The ResetPasswordMfaWebAuthnRoamingChallenge class implements the reset-password-mfa-webauthn-roaming-challenge screen functionality. This screen prompts the user to verify their identity using a roaming security key (such as a FIDO2 USB key) as part of the MFA step during a password reset flow.

​
Constructors

Create an instance of ResetPasswordMfaWebAuthnRoamingChallenge screen manager
Example
// In your UI component for the reset-password-mfa-webauthn-roaming-challenge screen:
const sdk = new ResetPasswordMfaWebAuthnRoamingChallenge();

async function handleSecurityKeyAuth() {
  try {
    const userWantsToRemember = document.getElementById('remember-device-checkbox')?.checked || false;
    await sdk.useSecurityKey({ rememberDevice: sdk.screen.showRememberDevice && userWantsToRemember });
    // On success, Auth0 typically handles redirection.
  } catch (err) {
    console.error("Security key authentication failed:", err);
    // If it's a WebAuthn API error, report it to Auth0
    if (err.name && err.message) { // Basic check for DOMException-like error
      try {
        await sdk.showError({ error: { name: err.name, message: err.message } });
      } catch (reportError) {
        console.error("Failed to report WebAuthn error:", reportError);
      }
    }
    // Update UI to inform the user, e.g., "Security key verification failed. Please try again."
    // Also check `sdk.transaction.errors` if the page might have reloaded with an error message from the server.
  }
}

​
Properties

​
branding
BrandingMembers
Provides branding-related configurations, such as branding theme and settings.
​
client
ClientMembers
Provides client-related configurations, such as id, name, and logoUrl, for the reset-password-mfa-webauthn-roaming-challenge screen.
​
organization
OrganizationMembers
Provides information about the user’s organization, such as organization id and name.
​
prompt
PromptMembers
Contains data about the current prompt in the authentication flow.
​
screen
ScreenMembersOnResetPasswordMfaWebAuthnRoamingChallenge
Contains details specific to the reset-password-mfa-webauthn-roaming-challenge screen, including its configuration and context.
​
tenant
TenantMembers
Contains data related to the tenant, such as id and associated metadata.
​
transaction
TransactionMembers
Provides transaction-specific data for the reset-password-mfa-webauthn-roaming-challenge screen, such as active identifiers and flow states.
​
untrustedData
UntrustedDataMembers
Handles untrusted data passed to the SDK, such as user input during the MFA challenge flow.
​
user
UserMembers
Details of the active user, including username, email, and roles.

​
Methods

​
useSecurityKey
(options ?)
This method initiates the WebAuthn security key challenge and submits the resulting credential to complete the MFA step during the password reset flow. If the browser throws a WebAuthn API error (such as user cancellation), catch the error and call showError to notify Auth0.
Example
// In your UI component for the reset-password-mfa-webauthn-roaming-challenge screen:
const sdk = new ResetPasswordMfaWebAuthnRoamingChallenge();

async function handleSecurityKeyAuth() {
  try {
    const userWantsToRemember = document.getElementById('remember-device-checkbox')?.checked || false;
    await sdk.useSecurityKey({ rememberDevice: sdk.screen.showRememberDevice && userWantsToRemember });
    // On success, Auth0 typically handles redirection.
  } catch (err) {
    console.error("Security key authentication failed:", err);
    // If it's a WebAuthn API error, report it to Auth0
    if (err.name && err.message) { // Basic check for DOMException-like error
      try {
        await sdk.showError({ error: { name: err.name, message: err.message } });
      } catch (reportError) {
        console.error("Failed to report WebAuthn error:", reportError);
      }
    }
    // Update UI to inform the user, e.g., "Security key verification failed. Please try again."
    // Also check `sdk.transaction.errors` if the page might have reloaded with an error message from the server.
  }
}
​
options
OPTIONAL
Optional payload.
​
showError
(options ?)
This method reports a browser-side WebAuthn error to Auth0, such as user cancellation (NotAllowedError) or a timeout from navigator.credentials.get().
Example
// In your UI, after catching an error from `sdk.useSecurityKey()` or `navigator.credentials.get()`:
if (webAuthnError instanceof DOMException) {
  await sdk.showError({
    error: { name: webAuthnError.name, message: webAuthnError.message },
    rememberDevice: userWantsToRemember // if applicable
  });
}
​
options
OPTIONAL
Optional payload.
​
tryAnotherMethod
(options ?)
This method allows the user to select a different MFA method to complete the challenge.
Example
// When the user clicks a "Try Another Way" button:
await sdk.tryAnotherMethod({ rememberDevice: userWantsToRemember });
// Auth0 handles redirection to the MFA selection screen.
​
options
OPTIONAL
Optional payload.
​
getErrors
Error[]
This method retrieves the array of transaction errors from the context, or an empty array if none exist.