Find out whether passkeys are supported without passing value to publicKey parameter in .get()

[nehalbhanushali]

Description

In the event where passkeys are not supported, certain apps do return NotSupportedError as expected with

navigator.credentials.get({
    publicKey: publicKeyCredentialRequestOptions
 })

However, certain apps return NotAllowedError, which is also returned in case the user cancels the operation or the operation times out. Should the latter return AbortError?

Also, if we want to find out proactively whether passkeys are supported, the following would typically return TypeError

navigator.credentials.get({
    publicKey: {}
})

Would that be the case when passkeys are not supported? Would the above return something other than TypeError?

Related Links

#2096

[timcappalli]

You should use getClientCapabilities() prior to making a create or get call to determine whether passkeys can be used.

https://www.w3.org/TR/webauthn-3/#sctn-getClientCapabilities

https://featuredetect.passkeys.dev

[emlun]

And in order to check if the browser supports some kind of WebAuthn credentials, but not necessarily user-verifying discoverable platform credentials, then you can check for the existence of window["PublicKeyCredential"]:

if (window["PublicKeyCredential"]) {
  // WebAuthn support exists in browser (but no guarantee that any authenticator is available)

  if ((await PublicKeyCredential.getClientCapabilities()).passkeyPlatformAuthenticator) {
    // Built-in passkey authenticator or hybrid transport is available
    navigator.credentials.get(/* ... */)
  } else {
    // Built-in passkey authenticator is not available, but some other kind of authenticator may be supported
    navigator.credentials.get(/* ... */)
  }
} else {
  // WebAuthn is not supported
}