Merge pull request #654 from sul-dlss/recaptcha-timeout

Execute reCAPTCHA on form submit
sul-dlss · Jul 1, 2024 · 69b1626 · 69b1626
2 parents 65ad53d + b39fbe7
commit 69b1626
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/app/components/top_bar_component.html.erb b/app/components/top_bar_component.html.erb
@@ -15,7 +15,7 @@
   <div data-feedback-target="container" id="feedback" class="collapse">
     <div class="container mt-3">
       <div class="row justify-content-center">
-        <%= form_with url: feedback_path, method: :post, class: 'col-md-8' do |f| %>
+        <%= form_with url: feedback_path, method: :post, class: 'col-md-8', html: { name: 'feedback_form' } do |f| %>
           <%= f.hidden_field :reporting_from, value: request.original_url %>
           <div class="alert alert-info" role="alert">
             <%= t('feedbacks.reporting_from', url: request.original_url) %>
@@ -41,7 +41,17 @@
           </div>
           <div class="mb-3 row">
             <div class="col-md-9 offset-md-3">
-              <%= recaptcha_v3(action: 'feedback', turbolinks: true) %>
+              <%= recaptcha_v3(action: 'feedback') %>
+              <script type="text/javascript">
+              document.forms.feedback_form.addEventListener('submit', async function(e) {
+                e.preventDefault();
+                const response = await window.executeRecaptchaForFeedbackAsync();
+                if (response) {
+                  setInputWithRecaptchaResponseTokenForFeedback('g-recaptcha-response-data-feedback', response);
+                }
+                this.submit();
+              });
+            </script>
             </div>
           </div>
           <div class="mb-3 row">

diff --git a/spec/features/feedback_form_spec.rb b/spec/features/feedback_form_spec.rb
@@ -9,6 +9,6 @@
     expect(page).to have_no_css('#feedback')
 
     click_on 'Feedback'
-    expect(page).to have_css('#feedback form')
+    expect(page).to have_css('#feedback form[name="feedback_form"]')
   end
 end