From c53e7f762d9582c9226a95d30643a4558b4a7572 Mon Sep 17 00:00:00 2001
From: "Stanko K.R." <stanko@stanko.io>
Date: Thu, 26 Mar 2026 13:44:44 +0100
Subject: [PATCH 1/3] Show separate error message when adding a Passkey twice

Turns out Google Passwords doesn't obey the exvlude list and allows only a single passkey per RP ID. If you try to add a new Passkey after you already created one in Google Passwords it will cause a client-side state error, which per spec can only mean that someone tried to re-add the same passkey twice and the client detected that.
---
 app/javascript/lib/action_pack/passkey.js |  5 +++--
 app/views/my/passkeys/index.html.erb      |  2 +-
 lib/action_pack/passkey/form_helper.rb    | 15 ++++++++++++---
 3 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/app/javascript/lib/action_pack/passkey.js b/app/javascript/lib/action_pack/passkey.js
index 7ee20cb84a..ae94a955ca 100644
--- a/app/javascript/lib/action_pack/passkey.js
+++ b/app/javascript/lib/action_pack/passkey.js
@@ -78,8 +78,9 @@ class PasskeyButton extends HTMLElement {
   #handleError(error) {
     console.error("Passkey ceremony failed", error)
     const cancelled = error.name === "AbortError" || error.name === "NotAllowedError"
-    this.#showError(cancelled ? "cancelled" : "error")
-    this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, cancelled } }))
+    const duplicate = error.name === "InvalidStateError"
+    this.#showError(duplicate ? "duplicate" : cancelled ? "cancelled" : "error")
+    this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, cancelled, duplicate } }))
   }
 
   #showError(type) {
diff --git a/app/views/my/passkeys/index.html.erb b/app/views/my/passkeys/index.html.erb
index de143eeb41..fea08c27bf 100644
--- a/app/views/my/passkeys/index.html.erb
+++ b/app/views/my/passkeys/index.html.erb
@@ -18,7 +18,7 @@
   <% end %>
 
   <footer>
-    <%= passkey_registration_button my_passkeys_path, options: @registration_options, error: { class: "txt-negative margin-block-half" }, cancellation: { class: "txt-subtle margin-block-half" }, class: "btn btn--link center txt-medium" do %>
+    <%= passkey_registration_button my_passkeys_path, options: @registration_options, error: { class: "txt-negative margin-block-half" }, cancellation: { class: "txt-subtle margin-block-half" }, duplicate: { class: "txt-negative margin-block-half" }, class: "btn btn--link center txt-medium" do %>
       <%= icon_tag "add" %>
       <span>Register a passkey</span>
     <% end %>
diff --git a/lib/action_pack/passkey/form_helper.rb b/lib/action_pack/passkey/form_helper.rb
index fe3767d702..2c8e7ac38c 100644
--- a/lib/action_pack/passkey/form_helper.rb
+++ b/lib/action_pack/passkey/form_helper.rb
@@ -9,6 +9,7 @@
 module ActionPack::Passkey::FormHelper
   REGISTRATION_ERROR_MESSAGE = "Something went wrong while registering your passkey."
   REGISTRATION_CANCELLED_MESSAGE = "Passkey registration was cancelled. Try again when you are ready."
+  REGISTRATION_DUPLICATE_MESSAGE = "You already have a passkey registered on this device. Remove the existing one first to re-register."
   SIGN_IN_ERROR_MESSAGE = "Something went wrong while signing in with your passkey."
   SIGN_IN_CANCELLED_MESSAGE = "Passkey sign in was cancelled. Try again when you are ready."
 
@@ -33,6 +34,7 @@ def passkey_registration_button(name = nil, url = nil, **options, &block)
     component_options, form_options, button_options, error_options = partition_passkey_options(url, options)
     error_options[:error][:message] ||= REGISTRATION_ERROR_MESSAGE
     error_options[:cancellation][:message] ||= REGISTRATION_CANCELLED_MESSAGE
+    error_options[:duplicate][:message] ||= REGISTRATION_DUPLICATE_MESSAGE
     param = form_options.delete(:param)
 
     content_tag("rails-passkey-registration-button", **component_options.transform_keys { |key| key.to_s.dasherize }) do
@@ -91,7 +93,7 @@ def partition_passkey_options(url, options)
       form_options = options
         .fetch(:form, {})
         .reverse_merge(method: :post, action: url, class: "button_to", param: :passkey)
-      error_options = options.slice(:error, :cancellation).reverse_merge(error: {}, cancellation: {})
+      error_options = options.slice(:error, :cancellation, :duplicate).reverse_merge(error: {}, cancellation: {}, duplicate: {})
 
       button_options = options.except(:options, :form, *component_options.keys, *error_options.keys)
 
@@ -106,7 +108,7 @@ def default_passkey_challenge_url
       end
     end
 
-    def passkey_error_messages(error: {}, cancellation: {})
+    def passkey_error_messages(error: {}, cancellation: {}, duplicate: {})
       error_message = error[:message]
       error_attributes = error.except(:message)
       error_attributes[:data] ||= {}
@@ -117,6 +119,13 @@ def passkey_error_messages(error: {}, cancellation: {})
       cancellation_attributes[:data] ||= {}
       cancellation_attributes[:data][:passkey_error] = "cancelled"
 
-      tag.div(error_message, hidden: true, **error_attributes) + tag.div(cancellation_message, hidden: true, **cancellation_attributes)
+      duplicate_message = duplicate[:message]
+      duplicate_attributes = duplicate.except(:message)
+      duplicate_attributes[:data] ||= {}
+      duplicate_attributes[:data][:passkey_error] = "duplicate"
+
+      tag.div(error_message, hidden: true, **error_attributes) +
+        tag.div(cancellation_message, hidden: true, **cancellation_attributes) +
+        tag.div(duplicate_message, hidden: true, **duplicate_attributes)
     end
 end

From b1eb2db922516a6634a101b90d057c74a9c1437c Mon Sep 17 00:00:00 2001
From: "Stanko K.R." <stanko@stanko.io>
Date: Thu, 26 Mar 2026 13:47:46 +0100
Subject: [PATCH 2/3] Replace code golf with something sensible

---
 app/javascript/lib/action_pack/passkey.js | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/app/javascript/lib/action_pack/passkey.js b/app/javascript/lib/action_pack/passkey.js
index ae94a955ca..324f48b95f 100644
--- a/app/javascript/lib/action_pack/passkey.js
+++ b/app/javascript/lib/action_pack/passkey.js
@@ -77,10 +77,18 @@ class PasskeyButton extends HTMLElement {
 
   #handleError(error) {
     console.error("Passkey ceremony failed", error)
-    const cancelled = error.name === "AbortError" || error.name === "NotAllowedError"
-    const duplicate = error.name === "InvalidStateError"
-    this.#showError(duplicate ? "duplicate" : cancelled ? "cancelled" : "error")
-    this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, cancelled, duplicate } }))
+    const type = this.#errorType(error)
+    this.#showError(type)
+    this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, type } }))
+  }
+
+  #errorType(error) {
+    switch (error.name) {
+      case "AbortError":
+      case "NotAllowedError": return "cancelled"
+      case "InvalidStateError": return "duplicate"
+      default: return "error"
+    }
   }
 
   #showError(type) {

From 96c383f4b93cd1e8a191fb562499ddf6e2798331 Mon Sep 17 00:00:00 2001
From: "Stanko K.R." <stanko@stanko.io>
Date: Thu, 26 Mar 2026 14:16:07 +0100
Subject: [PATCH 3/3] Only add duplicate messages if they are configured

---
 app/javascript/lib/action_pack/passkey.js | 24 +++++++++++------------
 lib/action_pack/passkey/form_helper.rb    | 16 ++++++++-------
 2 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/app/javascript/lib/action_pack/passkey.js b/app/javascript/lib/action_pack/passkey.js
index 324f48b95f..103cbc72ec 100644
--- a/app/javascript/lib/action_pack/passkey.js
+++ b/app/javascript/lib/action_pack/passkey.js
@@ -77,20 +77,11 @@ class PasskeyButton extends HTMLElement {
 
   #handleError(error) {
     console.error("Passkey ceremony failed", error)
-    const type = this.#errorType(error)
+    const type = errorType(error)
     this.#showError(type)
     this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, type } }))
   }
 
-  #errorType(error) {
-    switch (error.name) {
-      case "AbortError":
-      case "NotAllowedError": return "cancelled"
-      case "InvalidStateError": return "duplicate"
-      default: return "error"
-    }
-  }
-
   #showError(type) {
     const el = this.querySelector(`[data-passkey-error="${type}"]`)
     if (el) el.hidden = false
@@ -148,8 +139,8 @@ class PasskeySignInButton extends PasskeyButton {
         this.form.submit()
       } catch (error) {
         console.error("Passkey conditional mediation failed", error)
-        const cancelled = error.name === "AbortError" || error.name === "NotAllowedError"
-        this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, cancelled } }))
+        const type = errorType(error)
+        this.button.dispatchEvent(new CustomEvent("passkey:error", { bubbles: true, detail: { error, type } }))
       }
     }
   }
@@ -166,6 +157,15 @@ customElements.define("rails-passkey-sign-in-button", PasskeySignInButton)
 
 // -- Shared helpers ----------------------------------------------------------
 
+function errorType(error) {
+  switch (error.name) {
+    case "AbortError":
+    case "NotAllowedError": return "cancelled"
+    case "InvalidStateError": return "duplicate"
+    default: return "error"
+  }
+}
+
 function passkeysAvailable() {
   return !!window.PublicKeyCredential
 }
diff --git a/lib/action_pack/passkey/form_helper.rb b/lib/action_pack/passkey/form_helper.rb
index 2c8e7ac38c..43d023c9d5 100644
--- a/lib/action_pack/passkey/form_helper.rb
+++ b/lib/action_pack/passkey/form_helper.rb
@@ -119,13 +119,15 @@ def passkey_error_messages(error: {}, cancellation: {}, duplicate: {})
       cancellation_attributes[:data] ||= {}
       cancellation_attributes[:data][:passkey_error] = "cancelled"
 
-      duplicate_message = duplicate[:message]
-      duplicate_attributes = duplicate.except(:message)
-      duplicate_attributes[:data] ||= {}
-      duplicate_attributes[:data][:passkey_error] = "duplicate"
+      messages = tag.div(error_message, hidden: true, **error_attributes) +
+        tag.div(cancellation_message, hidden: true, **cancellation_attributes)
 
-      tag.div(error_message, hidden: true, **error_attributes) +
-        tag.div(cancellation_message, hidden: true, **cancellation_attributes) +
-        tag.div(duplicate_message, hidden: true, **duplicate_attributes)
+      if duplicate[:message]
+        duplicate_attributes = duplicate.except(:message)
+        duplicate_attributes[:data] = { passkey_error: "duplicate" }
+        messages += tag.div(duplicate[:message], hidden: true, **duplicate_attributes)
+      end
+
+      messages
     end
 end