From 9fcd6c6e5a6ba03176770eac0ef28017994ad34e Mon Sep 17 00:00:00 2001 From: Patrick Cartlidge Date: Tue, 14 Nov 2023 10:18:54 +0000 Subject: [PATCH 1/9] bump govuk_publishing_components --- Gemfile | 2 +- Gemfile.lock | 27 +++++++++++++++++---------- 2 files changed, 18 insertions(+), 11 deletions(-) diff --git a/Gemfile b/Gemfile index 8882388f0a..4ba8347742 100644 --- a/Gemfile +++ b/Gemfile @@ -11,7 +11,7 @@ gem "gds-api-adapters" gem "govuk_ab_testing" gem "govuk_app_config" gem "govuk_personalisation" -gem "govuk_publishing_components" +gem "govuk_publishing_components", path: "../govuk_publishing_components" gem "htmlentities" gem "invalid_utf8_rejector" gem "plek" diff --git a/Gemfile.lock b/Gemfile.lock index c71a0b9157..342d298860 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,3 +1,17 @@ +PATH + remote: ../govuk_publishing_components + 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 +180,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,6 +682,8 @@ 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) @@ -717,7 +724,7 @@ DEPENDENCIES govuk_ab_testing govuk_app_config govuk_personalisation - govuk_publishing_components + govuk_publishing_components! govuk_schemas govuk_test htmlentities From a8ed8093a0f0e3f1f32683a0626a33b5abcc6e9a Mon Sep 17 00:00:00 2001 From: Patrick Cartlidge Date: Tue, 14 Nov 2023 10:20:06 +0000 Subject: [PATCH 2/9] Use Terser instead of Uglifier govuk_publishing_components has govuk-frontend as a dependency. govuk-frontend v5 now targets browsers that support ES6. This means that the UMD modules used in govuk_publsihing_components from govuk-frontend use features of ES6 and so it means that Uglifier can't be used anymore because it only supports ES5. As well as installing terser and updating the config, this commit also contains a patch for getting terser working. Sprockets doesn't have an built-in loader for terser so we need to add this functionality. --- Gemfile | 2 +- Gemfile.lock | 4 +--- config/initializers/sprockets.rb | 17 +++++++++++++++++ 3 files changed, 19 insertions(+), 4 deletions(-) create mode 100644 config/initializers/sprockets.rb diff --git a/Gemfile b/Gemfile index 4ba8347742..aa3987c820 100644 --- a/Gemfile +++ b/Gemfile @@ -19,7 +19,7 @@ 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 index 342d298860..392cdc620c 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -691,8 +691,6 @@ GEM 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) @@ -745,8 +743,8 @@ DEPENDENCIES simplecov slimmer sprockets-rails + terser timecop - uglifier uk_postcode webmock diff --git a/config/initializers/sprockets.rb b/config/initializers/sprockets.rb new file mode 100644 index 0000000000..e2eb6c4a9b --- /dev/null +++ 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 From 0e74baf03d200ad40d5eb9f61a64ad1a88a206ff Mon Sep 17 00:00:00 2001 From: Patrick Cartlidge Date: Tue, 14 Nov 2023 10:27:45 +0000 Subject: [PATCH 3/9] Move Javascript modules to es6-components To prevent browsers evaluating JS that isn't supported, components that contain code from govuk-frontend have been moved to a separate file `es6-components.js` which is included in `application.html.erb` as a script tag with `type="module"`. --- app/assets/config/manifest.js | 1 + app/assets/javascripts/application.js | 2 -- app/assets/javascripts/es6-components.js | 12 ++++++++++++ app/views/layouts/application.html.erb | 1 + 4 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 app/assets/javascripts/es6-components.js diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js index 272208548f..3af87ca1de 100644 --- 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 index f02745a883..1fed4a1129 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -3,10 +3,8 @@ //= 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 new file mode 100644 index 0000000000..72a56f82f1 --- /dev/null +++ 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/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 195dc767f8..addeaf62d0 100644 --- 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 %> From 932184018309f9d84c7bf5f123dc6591cdfb995a Mon Sep 17 00:00:00 2001 From: Patrick Cartlidge Date: Tue, 14 Nov 2023 10:30:06 +0000 Subject: [PATCH 4/9] Change initialisation method to new method In govuk-frontend v5, the `init` function is now called when a module is created. This meant changing how the `initAll()` function works in govuk_publishing_components so that it does not call `init()` when initialising components JavaScript. It also meant moving `init` functions in components to the constructor to bring them in line with the new way of initialising. --- app/assets/javascripts/modules/track-smart-answer.js | 1 + app/assets/javascripts/modules/track-start-page-tabs.js | 1 + app/assets/javascripts/modules/track-submit.js | 1 + app/assets/javascripts/modules/transaction-survey-form.js | 1 + 4 files changed, 4 insertions(+) diff --git a/app/assets/javascripts/modules/track-smart-answer.js b/app/assets/javascripts/modules/track-smart-answer.js index ea55eba79b..2f3dafee32 100644 --- 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 index b2d18c12d0..a092a7c481 100644 --- 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 index a3996a920e..d1fb3ce598 100644 --- 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 index 60882dfaf9..87c256ed81 100644 --- 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 () { From 4e930eb8cb0492ad950ee5d663374ed782e44c82 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Thu, 14 Mar 2024 16:28:45 +0000 Subject: [PATCH 5/9] Remove deprecated scss variables - Remove $legacy attribute in govuk-colour - Remove $govuk-compatibility-govuktemplate - Remove $govuk-new-link-styles --- app/assets/stylesheets/application.scss | 4 ---- app/assets/stylesheets/views/_calendars.scss | 2 +- app/assets/stylesheets/views/_location_form.scss | 2 +- 3 files changed, 2 insertions(+), 6 deletions(-) diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 425134d660..1e2c4d1a5d 100644 --- 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 index 80a756416b..6e56942039 100644 --- 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 index cbe5e85b44..e190c98496 100644 --- 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"); } From f1677e6c8e4c76504474d5b223945c16e7e30eb7 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Thu, 14 Mar 2024 16:29:15 +0000 Subject: [PATCH 6/9] Update application.js --- app/assets/javascripts/application.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 1fed4a1129..55ea515694 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -1,5 +1,4 @@ //= 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 From 430e63f0f87bd12ae4f90bdfab93e242e364f5e7 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Fri, 15 Mar 2024 13:22:50 +0000 Subject: [PATCH 7/9] config.assets.js_compressor = :uglifier --- config/environments/production.rb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/config/environments/production.rb b/config/environments/production.rb index ec1c302aa0..1b62146fb9 100644 --- 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" From 9c45f1503e2eddd29333b8e2ba32a9469bb41f4f Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Thu, 14 Mar 2024 16:28:48 +0000 Subject: [PATCH 8/9] Update startup.sh --- startup.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/startup.sh b/startup.sh index 32280d9b4e..5e8df7e576 100755 --- 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 From 56d1bf572640df1747e3deda9fdf6f1889af5bd8 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Wed, 20 Mar 2024 11:30:04 +0000 Subject: [PATCH 9/9] `bundle` branch --- Gemfile | 2 +- Gemfile.lock | 6 ++++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/Gemfile b/Gemfile index aa3987c820..26f2df87ae 100644 --- a/Gemfile +++ b/Gemfile @@ -11,7 +11,7 @@ gem "gds-api-adapters" gem "govuk_ab_testing" gem "govuk_app_config" gem "govuk_personalisation" -gem "govuk_publishing_components", path: "../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" diff --git a/Gemfile.lock b/Gemfile.lock index 392cdc620c..c8a6fe544d 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,5 +1,7 @@ -PATH - remote: ../govuk_publishing_components +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