WebAuthn Tester

Trying out passkeys in the browser

WebAuthn is the browser API behind passkeys and hardware security keys. A tester checks whether the current browser and device support it, then runs a registration ceremony so you can watch the full flow: the prompt, the authenticator interaction, and the credential that comes back. It is the fastest way to confirm an environment before wiring WebAuthn into a real login.

What the ceremony actually does

During registration the server sends a random challenge. The authenticator (a platform TPM, Touch ID, or a USB key) generates a new keypair, keeps the private key sealed in hardware, and returns the public key plus an attestation signed over the challenge. The private key never leaves the device, which is what makes passkeys phishing-resistant: there is no shared secret to steal and nothing to type.

Example

navigator.credentials.create({
  publicKey: {
    challenge: <random bytes from server>,
    rp: { name: "DevKit", id: "devkit.app" },
    user: { id, name, displayName },
    pubKeyCredParams: [{ type: "public-key", alg: -7 }]
  }
})

The alg: -7 value requests ES256, an elliptic-curve signature. The returned credential id and public key are what a server stores to recognize the user on later logins.

The origin binding gotcha

A credential is bound to the relying-party id, which must match the origin's domain. That binding is exactly why passkeys resist phishing: a credential made for your real domain will not activate on a lookalike site. It also means WebAuthn requires a secure context, so it only works over HTTPS or on localhost during development.

FAQ

Does the website ever see my fingerprint? No. Biometrics stay on the device and only unlock the local private key. The server receives public-key data and signatures, never the biometric itself.

Why does registration fail on my test page? Common causes are an insecure (non-HTTPS) origin, a relying-party id that does not match the domain, or a browser without a usable authenticator available.