Merge pull request #4041 from alphagov/upgrade-to-govuk-frontend-5.1

Upgrade to govuk frontend 5.1
alphagov · Jul 15, 2024 · 18499f3 · 18499f3
2 parents ab46771 + 0f3cedc
commit 18499f3
Show file tree

Hide file tree

Showing 89 changed files with 3,145 additions and 172 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,10 @@
   useful summary for people upgrading their application, not a replication
   of the commit log.
 
+## Unreleased
+
+* **BREAKING:** Upgrade to govuk frontend 5.1 ([PR #4041](https://github.com/alphagov/govuk_publishing_components/pull/4041))
+
 ## 39.2.5
 
 * LUX version 4.0.23 ([PR #4102](https://github.com/alphagov/govuk_publishing_components/pull/4102))

diff --git a/app/assets/config/govuk_publishing_components_manifest.js b/app/assets/config/govuk_publishing_components_manifest.js
@@ -1,7 +1,7 @@
 // Pre-compile image and font assets from here and govuk-frontend
 //= link_tree ../images
-//= link_tree ../../../node_modules/govuk-frontend/govuk/assets/images
-//= link_tree ../../../node_modules/govuk-frontend/govuk/assets/fonts
+//= link_tree ../../../node_modules/govuk-frontend/dist/govuk/assets/images
+//= link_tree ../../../node_modules/govuk-frontend/dist/govuk/assets/fonts
 
 // Create asset files of each of the files in these directory
 //= link_directory ../javascripts/component_guide

diff --git a/app/assets/config/govuk_publishing_components_sassc-rails_manifest.js b/app/assets/config/govuk_publishing_components_sassc-rails_manifest.js
@@ -1,7 +1,7 @@
 // Pre-compile image and font assets from here and govuk-frontend
 //= link_tree ../images
-//= link_tree ../../../node_modules/govuk-frontend/govuk/assets/images
-//= link_tree ../../../node_modules/govuk-frontend/govuk/assets/fonts
+//= link_tree ../../../node_modules/govuk-frontend/dist/govuk/assets/images
+//= link_tree ../../../node_modules/govuk-frontend/dist/govuk/assets/fonts
 
 // Create asset files of each of the files in these directory
 //= link_directory ../javascripts/component_guide

diff --git a/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-ecommerce-tracker.js b/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-ecommerce-tracker.js
@@ -1,4 +1,4 @@
-//= require govuk/vendor/polyfills/Element/prototype/closest.js
+//= require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/closest.js
 ;(function (global) {
   'use strict'
 

diff --git a/...sets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js b/...sets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js
@@ -1,4 +1,4 @@
-// = require govuk/vendor/polyfills/Element/prototype/closest.js
+// = require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/closest.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {}
 window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analyticsModules || {};

diff --git a/app/assets/javascripts/govuk_publishing_components/analytics/external-link-tracker.js b/app/assets/javascripts/govuk_publishing_components/analytics/external-link-tracker.js
@@ -1,4 +1,4 @@
-// = require govuk/vendor/polyfills/Element/prototype/closest.js
+// = require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/closest.js
 ;(function (global) {
   'use strict'
 

diff --git a/app/assets/javascripts/govuk_publishing_components/components/accordion.js b/app/assets/javascripts/govuk_publishing_components/components/accordion.js
@@ -1,7 +1,5 @@
-/* global nodeListForEach */
-//  = require ../vendor/polyfills/common.js
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/accordion/accordion.js
+// = require govuk/components/accordion/accordion.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
@@ -85,11 +83,11 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
   GemAccordion.prototype.addEventListenersForAnchors = function () {
     var links = this.$module.querySelectorAll(this.sectionInnerContentClass + ' a[href*="#"]')
 
-    nodeListForEach(links, function (link) {
+    for (var link of links) {
       if (link.pathname === window.location.pathname) {
         link.addEventListener('click', this.openForAnchor.bind(this, link.hash.split('#')[1]))
       }
-    }.bind(this))
+    }
   }
 
   // Find the parent accordion section for the given id and open it
@@ -153,9 +151,9 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
 
   GemAccordion.prototype.addEventListenerSections = function () {
     var sections = this.$module.querySelectorAll(this.sectionButton)
-    nodeListForEach(sections, function (section) {
+    for (var section of sections) {
       section.addEventListener('click', this.addAccordionSectionTracking.bind(this, section))
-    }.bind(this))
+    }
   }
 
   // If the Accordion's sections are opened on click, then pass them to the GA event tracking

diff --git a/app/assets/javascripts/govuk_publishing_components/components/button.js b/app/assets/javascripts/govuk_publishing_components/components/button.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/button/button.js
+// = require govuk/components/button/button.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukButton = window.GOVUKFrontend.Button
diff --git a/app/assets/javascripts/govuk_publishing_components/components/character-count.js b/app/assets/javascripts/govuk_publishing_components/components/character-count.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/character-count/character-count.js
+// = require govuk/components/character-count/character-count.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukCharacterCount = window.GOVUKFrontend.CharacterCount
diff --git a/app/assets/javascripts/govuk_publishing_components/components/checkboxes.js b/app/assets/javascripts/govuk_publishing_components/components/checkboxes.js
@@ -1,5 +1,4 @@
-// = require govuk/vendor/polyfills/Element/prototype/closest.js
-// = require govuk/components/checkboxes/checkboxes.js
+// = require govuk/components/checkboxes/checkboxes.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukCheckboxes = window.GOVUKFrontend.Checkboxes;

diff --git a/app/assets/javascripts/govuk_publishing_components/components/details.js b/app/assets/javascripts/govuk_publishing_components/components/details.js
@@ -1,7 +1,5 @@
-// = require govuk/components/details/details.js
 window.GOVUK = window.GOVUK || {}
-window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend.Details;
+window.GOVUK.Modules = window.GOVUK.Modules || {};
 
 (function (Modules) {
   function GemDetails ($module) {

diff --git a/app/assets/javascripts/govuk_publishing_components/components/error-summary.js b/app/assets/javascripts/govuk_publishing_components/components/error-summary.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/error-summary/error-summary.js
+// = require govuk/components/error-summary/error-summary.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukErrorSummary = window.GOVUKFrontend.ErrorSummary
diff --git a/app/assets/javascripts/govuk_publishing_components/components/layout-header.js b/app/assets/javascripts/govuk_publishing_components/components/layout-header.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/header/header.js
+// = require govuk/components/header/header.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukHeader = window.GOVUKFrontend.Header
diff --git a/...sets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js b/...sets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js
@@ -1,4 +1,4 @@
-//= require govuk/vendor/polyfills/Element/prototype/classList.js
+//= require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/classList.js
 
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {};

diff --git a/app/assets/javascripts/govuk_publishing_components/components/option-select.js b/app/assets/javascripts/govuk_publishing_components/components/option-select.js
@@ -140,7 +140,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     }
 
     for (i = 0; i < showCheckboxes.length; i++) {
-      obj.$allCheckboxes[showCheckboxes[i]].style.display = 'block'
+      obj.$allCheckboxes[showCheckboxes[i]].style.display = 'flex'
     }
 
     var lenChecked = obj.$optionsContainer.querySelectorAll('.govuk-checkboxes__input:checked').length

diff --git a/app/assets/javascripts/govuk_publishing_components/components/radio.js b/app/assets/javascripts/govuk_publishing_components/components/radio.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/radios/radios.js
+// = require govuk/components/radios/radios.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukRadios = window.GOVUKFrontend.Radios
diff --git a/app/assets/javascripts/govuk_publishing_components/components/skip-link.js b/app/assets/javascripts/govuk_publishing_components/components/skip-link.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/skip-link/skip-link.js
+// = require govuk/components/skip-link/skip-link.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukSkipLink = window.GOVUKFrontend.SkipLink
diff --git a/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js b/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js
@@ -1,4 +1,4 @@
-//= require govuk/vendor/polyfills/Element/prototype/classList.js
+//= require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/classList.js
 //= require ../vendor/polyfills/closest.js
 //= require ../vendor/polyfills/indexOf.js
 

diff --git a/app/assets/javascripts/govuk_publishing_components/components/tabs.js b/app/assets/javascripts/govuk_publishing_components/components/tabs.js
@@ -1,5 +1,5 @@
 // This component relies on JavaScript from GOV.UK Frontend
-// = require govuk/components/tabs/tabs.js
+// = require govuk/components/tabs/tabs.bundle.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
 window.GOVUK.Modules.GovukTabs = window.GOVUKFrontend.Tabs
diff --git a/app/assets/javascripts/govuk_publishing_components/lib/govspeak/magna-charta.js b/app/assets/javascripts/govuk_publishing_components/lib/govspeak/magna-charta.js
@@ -1,4 +1,4 @@
-//= require govuk/vendor/polyfills/Element/prototype/classList.js
+//= require ../../vendor/polyfills-govuk-frontend-v4/Element/prototype/classList.js
 // This is a non-jQuery version of Magna Charta: https://github.com/alphagov/magna-charta
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {};

diff --git a/app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js b/app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js
@@ -1,4 +1,4 @@
-//= require govuk/vendor/polyfills/Element/prototype/classList.js
+//= require ../vendor/polyfills-govuk-frontend-v4/Element/prototype/classList.js
 /*
   Toggle the class 'focus' on input boxes on element focus/blur
   Used by the search component but generic enough for reuse