chore!: update simplewebauthn to v11

* chore: update simplewebauthn to v11

* docs: update readme

---------

Co-authored-by: Sébastien Chopin <seb@nuxt.com>

Author: Gerbuuun

README.md

@@ -296,7 +296,7 @@ To enable WebAuthn you need to:
 1. Install the peer dependencies:
 
 ```bash
-npx nypm i @simplewebauthn/server@10 @simplewebauthn/browser@10
+npx nypm i @simplewebauthn/server@11 @simplewebauthn/browser@11
 ```
 
 2. Enable it in your `nuxt.config.ts`

package.json

@@ -43,8 +43,8 @@
     "uncrypto": "^0.1.3"
   },
   "peerDependencies": {
-    "@simplewebauthn/browser": "^10.0.0",
-    "@simplewebauthn/server": "^10.0.1"
+    "@simplewebauthn/browser": "^11.0.0",
+    "@simplewebauthn/server": "^11.0.0"
   },
   "peerDependenciesMeta": {
     "@simplewebauthn/browser": {
@@ -63,7 +63,7 @@
     "@nuxt/test-utils": "^3.14.2",
     "@nuxt/ui": "^2.18.6",
     "@nuxt/ui-pro": "^1.4.3",
-    "@simplewebauthn/types": "^10.0.0",
+    "@simplewebauthn/types": "^11.0.0",
     "changelogen": "^0.5.7",
     "eslint": "^9.12.0",
     "nuxt": "^3.13.2",

pnpm-lock.yaml

@@ -31,8 +31,18 @@ export function useWebAuthn(options: {
    * @default '/api/webauthn/authenticate'
    */
   authenticateEndpoint?: string
+  /**
+   * Enable browser autofill for authentication
+   * @default false
+   */
+  useBrowserAutofill?: boolean
 } = {}): WebAuthnComposable {
-  const { registerEndpoint = '/api/webauthn/register', authenticateEndpoint = '/api/webauthn/authenticate' } = options
+  const {
+    registerEndpoint = '/api/webauthn/register',
+    authenticateEndpoint = '/api/webauthn/authenticate',
+    useBrowserAutofill = false,
+  } = options
+
   async function register(user: { userName: string, displayName?: string }) {
     const { creationOptions, attemptId } = await $fetch<RegistrationInitResponse>(registerEndpoint, {
       method: 'POST',
@@ -42,7 +52,9 @@ export function useWebAuthn(options: {
       },
     })
 
-    const attestationResponse = await startRegistration(creationOptions)
+    const attestationResponse = await startRegistration({
+      optionsJSON: creationOptions,
+    })
     const verificationResponse = await $fetch<VerifiedRegistrationResponse>(registerEndpoint, {
       method: 'POST',
       body: {
@@ -65,7 +77,10 @@ export function useWebAuthn(options: {
       },
     })
 
-    const assertionResponse = await startAuthentication(requestOptions)
+    const assertionResponse = await startAuthentication({
+      optionsJSON: requestOptions,
+      useBrowserAutofill,
+    })
     const verificationResponse = await $fetch<VerifiedAuthenticationResponse>(authenticateEndpoint, {
       method: 'POST',
       body: {

src/runtime/app/composables/webauthn.ts

@@ -71,9 +71,9 @@ export function defineWebAuthnAuthenticateEventHandler<T extends WebAuthnCredent
         expectedChallenge,
         expectedOrigin: url.origin,
         expectedRPID: url.hostname,
-        authenticator: {
-          credentialID: credential.id,
-          credentialPublicKey: new Uint8Array(base64URLStringToBuffer(credential.publicKey)),
+        credential: {
+          id: credential.id,
+          publicKey: new Uint8Array(base64URLStringToBuffer(credential.publicKey)),
           counter: credential.counter,
           transports: credential.transports,
         },

src/runtime/server/lib/webauthn/authenticate.ts

@@ -102,11 +102,11 @@ export function defineWebAuthnRegisterEventHandler<T extends WebAuthnUser>({
       await onSuccess(event, {
         user,
         credential: {
-          id: verification.registrationInfo!.credentialID,
-          publicKey: bufferToBase64URLString(verification.registrationInfo!.credentialPublicKey),
-          counter: verification.registrationInfo!.counter,
+          id: verification.registrationInfo!.credential.id,
+          publicKey: bufferToBase64URLString(verification.registrationInfo!.credential.publicKey),
+          counter: verification.registrationInfo!.credential.counter,
           backedUp: verification.registrationInfo!.credentialBackedUp,
-          transports: body.response.response.transports,
+          transports: verification.registrationInfo!.credential.transports,
         },
         registrationInfo: verification.registrationInfo!,
       })