From 66967e1d96c5b970a66be7f1d269635a66385a59 Mon Sep 17 00:00:00 2001
From: Katie Smith <katie.smith@digital.cabinet-office.gov.uk>
Date: Wed, 29 Jan 2020 14:07:40 +0000
Subject: [PATCH] Import / require all code for the govuk frontend button

---
 app/assets/javascripts/modules/all.mjs | 5 +++++
 gulpfile.js                            | 3 ++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/modules/all.mjs b/app/assets/javascripts/modules/all.mjs
index 7041044d3..1d30e666d 100644
--- a/app/assets/javascripts/modules/all.mjs
+++ b/app/assets/javascripts/modules/all.mjs
@@ -8,6 +8,7 @@
 // For example, `export { Frontend }` will assign `Frontend` to `window.Frontend`
 import Header from 'govuk-frontend/components/header/header';
 import Details from 'govuk-frontend/components/details/details';
+import Button from 'govuk-frontend/components/button/button';
 
 /**
  * TODO: Ideally this would be a NodeList.prototype.forEach polyfill
@@ -33,6 +34,9 @@ function initAll (options) {
   // Defaults to the entire document if nothing is set.
   var scope = typeof options.scope !== 'undefined' ? options.scope : document
 
+  // Find all buttons with [role=button] on the scope to enhance.
+  new Button(scope).init()
+
   // Find all global details elements to enhance.
   var $details = scope.querySelectorAll('details')
   nodeListForEach($details, function ($detail) {
@@ -48,6 +52,7 @@ function initAll (options) {
 var Frontend = {
   "Header": Header,
   "Details": Details,
+  "Button": Button,
   "initAll": initAll
 }
 
diff --git a/gulpfile.js b/gulpfile.js
index 52f713f2b..fc9fab7a6 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -64,7 +64,8 @@ const copy = {
         'header',
         'footer',
         'back-link',
-        'details'
+        'details',
+        'button'
       ];
       let done = 0;