Merge pull request #111 from cedarcode/rm/use-attributes-hash-instead-of-classes

Allow form and button attributes in helper methods

Author: RenzoMinelli

CHANGELOG.md

@@ -6,16 +6,28 @@
 
 - Options for getting or creating passkeys and security keys are now served by dedicated Rails controllers and retrieved via JavaScript fetch requests. [#73](https://github.com/cedarcode/devise-webauthn/pull/73) [@nicolastemciuc]
 - BREAKING!: Remove helpers for generating WebAuthn options. [#106](https://github.com/cedarcode/devise-webauthn/pull/115) [@nicolastemciuc]
+- BREAKING!: Replace `form_classes:` keyword argument with direct keyword arguments in all form helper methods (`passkey_creation_form_for`, `login_with_passkey_form_for`, `security_key_creation_form_for`, `login_with_security_key_form_for`). All options are delegated to `form_with`, allowing you to pass any HTML attributes or form options directly. [@RenzoMinelli]
+```erb
+<%# Before %>
+<%= passkey_creation_form_for(:user, form_classes: "my-class") do |form| %>
+  ...
+<% end %>
+
+<%# After %>
+<%= passkey_creation_form_for(:user, class: "my-class", id: "my-form", data: { turbo: false }) do |form| %>
+  ...
+<% end %>
+```
 
-- BREAKING: `login_with_passkey_button` and `login_with_security_key_button` helpers have been renamed to `login_with_passkey_form_for` and `login_with_security_key_form_for`. They now take a block and no longer generate the submit button automatically. You need to explicitly add the button inside the block:
+- BREAKING!: `login_with_passkey_button` and `login_with_security_key_button` helpers have been renamed to `login_with_passkey_form_for` and `login_with_security_key_form_for`. They now take a block and no longer generate the submit button automatically. You need to explicitly add the button inside the block:
 ```erb
 <%# Before %>
-<%%= login_with_passkey_button(:user, "Log in with passkeys") %>
+<%= login_with_passkey_button(:user, "Log in with passkeys") %>
 
 <%# After %>
-<%%= login_with_passkey_form_for(:user) do |form| %>
-  <%%= form.submit "Log in with passkeys" %>
-<%% end %>
+<%= login_with_passkey_form_for(:user) do |form| %>
+  <%= form.submit "Log in with passkeys" %>
+<% end %>
 ```
 
 ### Fixed

lib/devise/webauthn/helpers/credentials_helper.rb

@@ -3,11 +3,9 @@
 module Devise
   module Webauthn
     module CredentialsHelper
-      def passkey_creation_form_for(resource_or_resource_name, form_classes: nil, &block)
+      def passkey_creation_form_for(resource_or_resource_name, **options, &block)
         form_with(
-          url: passkeys_path(resource_or_resource_name),
-          method: :post,
-          class: form_classes
+          **options, url: passkeys_path(resource_or_resource_name), method: :post
         ) do |f|
           tag.webauthn_create(data: { options_url: passkey_registration_options_path(resource_or_resource_name) }) do
             concat f.hidden_field(:public_key_credential, data: { webauthn_target: "response" })
@@ -16,11 +14,9 @@ def passkey_creation_form_for(resource_or_resource_name, form_classes: nil, &blo
         end
       end
 
-      def login_with_passkey_form_for(resource_or_resource_name, form_classes: nil, &block)
+      def login_with_passkey_form_for(resource_or_resource_name, **options, &block)
         form_with(
-          url: session_path(resource_or_resource_name),
-          method: :post,
-          class: form_classes
+          **options, url: session_path(resource_or_resource_name), method: :post
         ) do |f|
           tag.webauthn_get(data: { options_url: passkey_authentication_options_path(resource_or_resource_name) }) do
             concat f.hidden_field(:public_key_credential, data: { webauthn_target: "response" })
@@ -29,11 +25,9 @@ def login_with_passkey_form_for(resource_or_resource_name, form_classes: nil, &b
         end
       end
 
-      def security_key_creation_form_for(resource_or_resource_name, form_classes: nil, &block)
+      def security_key_creation_form_for(resource_or_resource_name, **options, &block)
         form_with(
-          url: second_factor_webauthn_credentials_path(resource_or_resource_name),
-          method: :post,
-          class: form_classes
+          **options, url: second_factor_webauthn_credentials_path(resource_or_resource_name), method: :post
         ) do |f|
           tag.webauthn_create(
             data: { options_url: security_key_registration_options_path(resource_or_resource_name) }
@@ -44,11 +38,9 @@ def security_key_creation_form_for(resource_or_resource_name, form_classes: nil,
         end
       end
 
-      def login_with_security_key_form_for(resource_or_resource_name, form_classes: nil, &block)
+      def login_with_security_key_form_for(resource_or_resource_name, **options, &block)
         form_with(
-          url: two_factor_authentication_path(resource_or_resource_name),
-          method: :post,
-          class: form_classes
+          **options, url: two_factor_authentication_path(resource_or_resource_name), method: :post
         ) do |f|
           tag.webauthn_get(data: {
                              options_url: security_key_authentication_options_path(resource_or_resource_name)

spec/helpers/devise/webauthn/credentials_helper_spec.rb

@@ -38,12 +38,17 @@ def have_hidden_credential_field
       expect(page).to have_button("Create Passkey")
     end
 
-    it "accepts form_classes option" do
-      html = helper.passkey_creation_form_for(user, form_classes: "custom-form") do |form|
+    it "accepts options passed directly" do
+      html = helper.passkey_creation_form_for(
+        user,
+        class: "custom-form",
+        id: "passkey-form",
+        data: { turbo: false }
+      ) do |form|
         form.submit "Create"
       end
 
-      expect(parse(html)).to have_css("form.custom-form")
+      expect(parse(html)).to have_css('form.custom-form#passkey-form[data-turbo="false"]')
     end
 
     it "allows custom content in the block" do
@@ -72,12 +77,17 @@ def have_hidden_credential_field
       expect(page).to have_button("Log in with passkeys")
     end
 
-    it "accepts form_classes option" do
-      html = helper.login_with_passkey_form_for(:account, form_classes: "passkey-form") do |form|
+    it "accepts options passed directly" do
+      html = helper.login_with_passkey_form_for(
+        :account,
+        class: "passkey-form",
+        id: "passkey-login",
+        data: { controller: "auth" }
+      ) do |form|
         form.submit "Login"
       end
 
-      expect(parse(html)).to have_css("form.passkey-form")
+      expect(parse(html)).to have_css('form.passkey-form#passkey-login[data-controller="auth"]')
     end
 
     it "allows custom content in the block" do
@@ -109,12 +119,17 @@ def have_hidden_credential_field
       expect(page).to have_button("Add Security Key")
     end
 
-    it "accepts form_classes option" do
-      html = helper.security_key_creation_form_for(user, form_classes: "security-key-form") do |form|
+    it "accepts options passed directly" do
+      html = helper.security_key_creation_form_for(
+        user,
+        class: "security-key-form",
+        id: "security-key-registration",
+        data: { turbo: false }
+      ) do |form|
         form.submit "Add"
       end
 
-      expect(parse(html)).to have_css("form.security-key-form")
+      expect(parse(html)).to have_css('form.security-key-form#security-key-registration[data-turbo="false"]')
     end
 
     it "allows custom content in the block" do
@@ -143,12 +158,17 @@ def have_hidden_credential_field
       expect(page).to have_button("Use security key")
     end
 
-    it "accepts form_classes option" do
-      html = helper.login_with_security_key_form_for(:account, form_classes: "two-factor-form") do |form|
+    it "accepts options passed directly" do
+      html = helper.login_with_security_key_form_for(
+        :account,
+        class: "two-factor-form",
+        id: "security-key-auth",
+        data: { turbo_method: "post" }
+      ) do |form|
         form.submit "Verify"
       end
 
-      expect(parse(html)).to have_css("form.two-factor-form")
+      expect(parse(html)).to have_css('form.two-factor-form#security-key-auth[data-turbo-method="post"]')
     end
 
     it "allows custom content in the block" do