PP-5783 - Move to new GOV.UK Frontend double click protection

GOV.UK Frontend has a double click on buttons protector built in so favouring that. Plus moved inclusion of the GOV.UK Frontend scripts into our compiled JS rather than including as extra HTTP request. Details of how it works here - alphagov/govuk-frontend#1018
alphagov · Oct 28, 2019 · d956e23 · d956e23
1 parent 7c9faf1
commit d956e23
Show file tree

Hide file tree

Showing 6 changed files with 5 additions and 26 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -143,6 +143,7 @@ module.exports = function (grunt) {
     dist: {
       src: ['public/javascripts/application.js',
         'node_modules/promise-polyfill/dist/polyfill.min.js',
+        'node_modules/govuk-frontend/govuk/all.js',
         'app/assets/javascripts/modules/*.js'],
       dest: 'public/javascripts/application.js'
     }

diff --git a/app/assets/javascripts/modules/stop-double-submission.js b/app/assets/javascripts/modules/stop-double-submission.js
diff --git a/app/views/charge.njk b/app/views/charge.njk
@@ -455,6 +455,7 @@
           {{
             govukButton({
               text: __p("commonButtons.continueButton"),
+              preventDoubleClick: true,
               attributes: {
                 id: "submit-card-details"
               }

diff --git a/app/views/confirm.njk b/app/views/confirm.njk
@@ -104,9 +104,9 @@
       {{
         govukButton({
           html: confirmButtonHTML,
+          preventDoubleClick: true,
           attributes: {
-            id: 'confirm',
-            'data-module': 'stop-double-submit'
+            id: 'confirm'
           }
         })
       }}

diff --git a/app/views/includes/scripts.njk b/app/views/includes/scripts.njk
@@ -37,7 +37,7 @@
 
   var mainWrap = document.getElementsByTagName('main')[0]
   document.addEventListener('DOMContentLoaded', function() {
-    GOVUK.stopDoubleSubmit.init();
+    window.GOVUKFrontend.initAll();
     if (mainWrap.classList.contains('charge-new')) {
       showCardType().init();
       window.payScripts.inputConfirm.init();

diff --git a/app/views/layout.njk b/app/views/layout.njk
@@ -57,8 +57,6 @@
 
 {% block bodyEnd %}
   {# Run JavaScript at end of the <body>, to avoid blocking the initial render. #}
-  <script src="/all.js"></script>
-  <script>window.GOVUKFrontend.initAll()</script>
   {% include "includes/scripts.njk" %}
 {% endblock %}