[Issue]

Passkey on playground won’t work.

Issues with passkey authentication on developer playground environments (like the Auth0 OIDC Playground, Passkeys Playground / learnpasskeys.io, or custom sandbox playgrounds) typically stem from WebAuthn origin binding, browser extension routing, or tenant configuration prerequisites.

1. WebAuthn Relying Party (RP ID) & Origin Mismatch (Most Common)

Passkeys are strictly bound to the specific domain (origin) where they were created.

  • Playground vs. Hosted Domain: If the playground runs on an origin (e.g., https://oidcplayground.com or https://learnpasskeys.io) that differs from your Auth0 tenant domain (https://<tenant>.us.auth0.com or your custom domain), WebAuthn API calls will fail.

  • Allowed Web Origins (CORS): In your Auth0 Dashboard under Applications > [Your Application] > Settings, ensure the playground URL is explicitly listed in Allowed Web Origins (CORS) and Allowed Callback URLs.

  • Relying Party ID (RP ID): Under Tenant Settings > Relying Party IDs, verify that the domain hosting the flow is registered as an allowed RP ID.

2. Browser & Extension Interception Conflicts

If the browser or password manager fails to handle the WebAuthn challenge:

  • macOS / Firefox Bug: Firefox on macOS has a known issue where WebAuthn requests are intercepted by iCloud Keychain or dropped before reaching third-party password managers (like Bitwarden/1Password).

    • Fix: In Firefox, go to about:config, set security.webauthn.enable_macos_passkeys to false, or test on Chrome/Brave/Safari.
  • Competing Passkey Managers: If both a browser manager (e.g., Google Password Manager) and a third-party extension (e.g., Bitwarden, 1Password) try to capture the prompt, one may suppress the challenge. Dismiss the OS prompt or temporarily disable conflicting extensions.

3. Tenant-Level Passkey Prerequisites

If you are testing passkeys against your own Auth0 tenant from a playground, ensure the database connection meets the required prerequisites:

  1. Identifier First: The tenant’s Authentication Profile must be set to Identifier First (under Branding > Universal Login).

  2. New Universal Login Experience: Classic login / custom hosted login pages do not support native passkey authentication.

  3. Database Settings: Under Authentication > Database > [Your Connection] > Authentication Methods, ensure Passkey is toggled ON.

  4. Flexible Identifiers / Email: Passkeys require email-based or flexible identifiers (not username-only connections without user import).

4. Localhost / Insecure Origin Limitations

WebAuthn strictly requires a secure context (HTTPS). It will fail silently or throw a SecurityError if tested over plain http:// (unless using the exact string http://localhost).

Kind Regards,
Nik