alphagov · patrickpatrickpatrick · Nov 14, 2023 · Nov 14, 2023 · Nov 14, 2023 · Nov 14, 2023
diff --git a/Gemfile b/Gemfile
@@ -11,15 +11,15 @@ gem "gds-api-adapters"
 gem "govuk_ab_testing"
 gem "govuk_app_config"
 gem "govuk_personalisation"
-gem "govuk_publishing_components"
+gem "govuk_publishing_components", git: "https://github.com/alphagov/govuk_publishing_components.git", branch: "deploy-try-to-update-govukfrontend"
 gem "htmlentities"
 gem "invalid_utf8_rejector"
 gem "plek"
 gem "rails-i18n"
 gem "rails_translation_manager"
 gem "slimmer"
 gem "sprockets-rails"
-gem "uglifier"
+gem "terser"
 gem "uk_postcode"
 
 group :development do

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -1,3 +1,19 @@
+GIT
+  remote: https://github.com/alphagov/govuk_publishing_components.git
+  revision: 61640e75da1085b7847219517dc12e51bb65b7dd
+  branch: deploy-try-to-update-govukfrontend
+  specs:
+    govuk_publishing_components (37.8.1)
+      govuk_app_config
+      govuk_personalisation (>= 0.7.0)
+      kramdown
+      plek
+      rails (>= 6)
+      rouge
+      sprockets (>= 3)
+      sprockets-rails
+      terser
+
 GEM
   remote: https://rubygems.org/
   specs:
@@ -166,15 +182,6 @@ GEM
     govuk_personalisation (0.16.0)
       plek (>= 1.9.0)
       rails (>= 6, < 8)
-    govuk_publishing_components (37.9.1)
-      govuk_app_config
-      govuk_personalisation (>= 0.7.0)
-      kramdown
-      plek
-      rails (>= 6)
-      rouge
-      sprockets (>= 3)
-      sprockets-rails
     govuk_schemas (4.7.0)
       json-schema (>= 2.8, < 4.2)
     govuk_test (4.0.2)
@@ -677,15 +684,15 @@ GEM
       tins (~> 1.0)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
+    terser (1.2.0)
+      execjs (>= 0.3.0, < 3)
     thor (1.3.1)
     timecop (0.9.8)
     timeout (0.4.1)
     tins (1.32.1)
       sync
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
-    uglifier (4.2.0)
-      execjs (>= 0.3.0, < 3)
     uk_postcode (2.1.8)
     unicode-display_width (2.5.0)
     webmock (3.23.0)
@@ -717,7 +724,7 @@ DEPENDENCIES
   govuk_ab_testing
   govuk_app_config
   govuk_personalisation
-  govuk_publishing_components
+  govuk_publishing_components!
   govuk_schemas
   govuk_test
   htmlentities
@@ -738,8 +745,8 @@ DEPENDENCIES
   simplecov
   slimmer
   sprockets-rails
+  terser
   timecop
-  uglifier
   uk_postcode
   webmock
 

diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js
@@ -1,5 +1,6 @@
 //= link_tree ../images
 //= link all.js
+//= link es6-components.js
 //= link application.js
 //= link test-dependencies.js
 

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -1,12 +1,9 @@
 //= require govuk_publishing_components/lib
-//= require govuk_publishing_components/components/error-summary
 //= require govuk_publishing_components/components/govspeak
 //= require govuk_publishing_components/components/image-card
 //= require govuk_publishing_components/components/intervention
-//= require govuk_publishing_components/components/radio
 //= require govuk_publishing_components/components/step-by-step-nav
 //= require govuk_publishing_components/components/table
-//= require govuk_publishing_components/components/tabs
 
 //= require support
 //= require_tree ./modules
diff --git a/app/assets/javascripts/es6-components.js b/app/assets/javascripts/es6-components.js
@@ -0,0 +1,12 @@
+// These modules from govuk_publishing_components
+// depend on govuk-frontend modules. govuk-frontend
+// now targets browsers that support `type="module"`.
+//
+// To gracefully prevent execution of these scripts
+// on browsers that don't support ES6, this script
+// should be included in a `type="module"` script tag
+// which will ensure they are never loaded.
+
+//= require govuk_publishing_components/components/error-summary
+//= require govuk_publishing_components/components/radio
+//= require govuk_publishing_components/components/tabs
diff --git a/app/assets/javascripts/modules/track-smart-answer.js b/app/assets/javascripts/modules/track-smart-answer.js
@@ -6,6 +6,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   function TrackSmartAnswer (element) {
     this.nodeType = element.getAttribute('data-smart-answer-node-type')
     this.flowSlug = element.getAttribute('data-smart-answer-slug')
+    this.init()
   }
 
   TrackSmartAnswer.prototype.init = function () {

diff --git a/app/assets/javascripts/modules/track-start-page-tabs.js b/app/assets/javascripts/modules/track-start-page-tabs.js
@@ -6,6 +6,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
   function TrackStartPageTabs (module) {
     this.module = module
+    this.init()
   }
 
   TrackStartPageTabs.prototype.init = function () {

diff --git a/app/assets/javascripts/modules/track-submit.js b/app/assets/javascripts/modules/track-submit.js
@@ -6,6 +6,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   function TrackSubmit (element) {
     this.$module = element
     this.formElement = this.$module.querySelector('form')
+    this.init()
   }
 
   TrackSubmit.prototype.init = function () {

diff --git a/app/assets/javascripts/modules/transaction-survey-form.js b/app/assets/javascripts/modules/transaction-survey-form.js
@@ -6,6 +6,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
   function TransactionSurveyForm (module) {
     this.module = module
+    this.init()
   }
 
   TransactionSurveyForm.prototype.init = function () {

diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -1,7 +1,3 @@
-$govuk-compatibility-govuktemplate: false;
-$govuk-use-legacy-palette: false;
-$govuk-new-link-styles: true;
-
 // This flag stops the font from being included in this application's
 // stylesheet - the font is being served by Static across all of GOV.UK, so is
 // not needed here.

diff --git a/app/assets/stylesheets/views/_calendars.scss b/app/assets/stylesheets/views/_calendars.scss
@@ -13,7 +13,7 @@
   left: 0;
   width: 100%;
   overflow: visible;
-  border-top: 1px solid govuk-colour("mid-grey", $legacy: "grey-2");
+  border-top: 1px solid govuk-colour("mid-grey");
   @extend %responsive-bunting-height;
 }
 

diff --git a/app/assets/stylesheets/views/_location_form.scss b/app/assets/stylesheets/views/_location_form.scss
@@ -3,5 +3,5 @@
 .location-form {
   padding: govuk-spacing(3);
   margin: govuk-spacing(6) 0;
-  background: govuk-colour("light-grey", $legacy: "grey-4");
+  background: govuk-colour("light-grey");
 }
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -41,6 +41,7 @@
     %>
 
     <%= javascript_include_tag 'test-dependencies.js' if Rails.env.test? %>
+    <%= javascript_include_tag 'es6-components.js', type: "module" %>
     <%= javascript_include_tag 'application.js', integrity: false %>
     <%= yield :extra_javascript %>
     <%= yield :extra_headers %>

diff --git a/config/environments/production.rb b/config/environments/production.rb
@@ -89,7 +89,7 @@
 
   config.assets.compress = true
   config.assets.digest = true
-  config.assets.js_compressor = :uglifier
+  config.assets.js_compressor = :terser
 
   # Specifies the header that your server uses for sending files
   config.action_dispatch.x_sendfile_header = ENV["HEROKU_APP_NAME"] ? nil : "X-Sendfile"

diff --git a/config/initializers/sprockets.rb b/config/initializers/sprockets.rb
@@ -0,0 +1,17 @@
+# This adds terser as a recognised compressor
+# to Sprockets. Without this patch, Sprockets
+# will not be able to run terser.
+#
+# Code originates from:
+# https://stackoverflow.com/a/70086366
+
+require "terser"
+
+module Sprockets
+  class Environment < Base
+    def js_compressor=(compressor)
+      register_compressor "application/javascript", :terser, Terser::Compressor
+      super
+    end
+  end
+end
diff --git a/startup.sh b/startup.sh
@@ -8,7 +8,7 @@ if [[ $1 == "--live" ]] ; then
   GOVUK_PROXY_STATIC_ENABLED=true \
   PLEK_SERVICE_LICENSIFY_URI=${PLEK_SERVICE_LICENSIFY_URI-https://licensify.publishing.service.gov.uk} \
   PLEK_SERVICE_CONTENT_STORE_URI=${PLEK_SERVICE_CONTENT_STORE_URI-https://www.gov.uk/api} \
-  PLEK_SERVICE_STATIC_URI=${PLEK_SERVICE_STATIC_URI-https://assets.publishing.service.gov.uk} \
+  PLEK_SERVICE_STATIC_URI=${PLEK_SERVICE_STATIC_URI-http://static.dev.gov.uk} \
   PLEK_SERVICE_IMMINENCE_URI=${PLEK_SERVICE_IMMINENCE_URI-https://imminence.publishing.service.gov.uk} \
   ./bin/dev
 else