Tech debt/civ 2752 (#481)

* Bump @ministryofjustice/frontend from 1.3.0 to 1.4.2

Bumps [@ministryofjustice/frontend](https://github.com/ministryofjustice/moj-frontend) from 1.3.0 to 1.4.2.
- [Release notes](https://github.com/ministryofjustice/moj-frontend/releases)
- [Changelog](https://github.com/ministryofjustice/moj-frontend/blob/main/CHANGELOG.md)
- [Commits](ministryofjustice/moj-frontend@v1.3.0...v1.4.2)

---
updated-dependencies:
- dependency-name: "@ministryofjustice/frontend"
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

* Bump govuk-frontend from 4.0.1 to 4.1.0

Bumps [govuk-frontend](https://github.com/alphagov/govuk-frontend) from 4.0.1 to 4.1.0.
- [Release notes](https://github.com/alphagov/govuk-frontend/releases)
- [Changelog](https://github.com/alphagov/govuk-frontend/blob/main/CHANGELOG.md)
- [Commits](alphagov/govuk-frontend@v4.0.1...v4.1.0)

---
updated-dependencies:
- dependency-name: govuk-frontend
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

* techDebt(CIV-2752): Change build process
After GOV.UK Frontend v4.1.0 release build process can be slightly changed by excluding govukFrontend files from the assets and importing them directly from the dependency package

* techDebt(CIV-2752): single quotes

* techDebt(CIV-2752): fix assets resolve

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

package.json

@@ -29,7 +29,7 @@
     "@hmcts/nodejs-logging": "^4.0.2",
     "@hmcts/os-places-client": "^1.1.7",
     "@hmcts/properties-volume": "^0.0.13",
-    "@ministryofjustice/frontend": "^1.3.0",
+    "@ministryofjustice/frontend": "^1.4.2",
     "@types/config": "^0.0.41",
     "@types/cookie-parser": "^1.4.3",
     "@types/cookie-session": "^2.0.44",
@@ -61,7 +61,7 @@
     "express-nunjucks": "^2.2.5",
     "express-session": "^1.17.2",
     "glob": "^8.0.1",
-    "govuk-frontend": "4.0.1",
+    "govuk-frontend": "4.1.0",
     "helmet": "^5.1.0",
     "i18next": "^21.6.16",
     "i18next-fs-backend": "^1.1.4",

src/main/assets/scss/main.scss

@@ -1,4 +1,4 @@
-@import '~govuk-frontend';
+@import 'node_modules/govuk-frontend/govuk/all';
 @import './task-list';
 @import './citizen-ui-colours';
 

src/test/unit/routes/features/response/admission/fullAdmission/paymentOption/paymentDateController.test.ts

@@ -73,9 +73,9 @@ describe('Payment date', () => {
         .expect((res) => {
           expect(res.status).toBe(200);
           expect(res.text).toContain('What date will you pay on?');
-          expect(res.text).toContain('name="year" type="text" pattern="[0-9]*"');
-          expect(res.text).toContain('name="month" type="text" pattern="[0-9]*"');
-          expect(res.text).toContain('name="day" type="text" pattern="[0-9]*"');
+          expect(res.text).toContain('name="year" type="text"');
+          expect(res.text).toContain('name="month" type="text"');
+          expect(res.text).toContain('name="day" type="text"');
         });
     });
     test('should return payment date page with payment date loaded from Redis', async () => {
@@ -85,9 +85,9 @@ describe('Payment date', () => {
         .expect((res) => {
           expect(res.status).toBe(200);
           expect(res.text).toContain('What date will you pay on?');
-          expect(res.text).toContain('name="year" type="text" value="2025" pattern="[0-9]*');
-          expect(res.text).toContain('name="month" type="text" value="6" pattern="[0-9]*');
-          expect(res.text).toContain('name="day" type="text" value="1" pattern="[0-9]*');
+          expect(res.text).toContain('name="year" type="text" value="2025"');
+          expect(res.text).toContain('name="month" type="text" value="6"');
+          expect(res.text).toContain('name="day" type="text" value="1"');
         });
     });
   });

src/test/unit/routes/features/response/admission/partialAdmission/howMuchHaveYouPaidController.test.ts

@@ -85,9 +85,9 @@ describe('How Much Have You Paid', () => {
           expect(res.status).toBe(200);
           expect(res.text).toContain('How much have you paid the claimant?');
           expect(res.text).toContain('name="amount" type="number" spellcheck="false" value="20"');
-          expect(res.text).toContain('name="year" type="text" value="2022" pattern="[0-9]*');
-          expect(res.text).toContain('name="month" type="text" value="1" pattern="[0-9]*');
-          expect(res.text).toContain('name="day" type="text" value="1" pattern="[0-9]*');
+          expect(res.text).toContain('name="year" type="text" value="2022"');
+          expect(res.text).toContain('name="month" type="text" value="1"');
+          expect(res.text).toContain('name="day" type="text" value="1"');
         });
     });
   });

webpack.config.js

@@ -1,9 +1,9 @@
 const path = require('path');
 
 const sourcePath = path.resolve(__dirname, 'src/main/');
-const govukFrontend = require(path.resolve(__dirname, 'webpack/govukFrontend'));
 const scss = require(path.resolve(__dirname, 'webpack/scss'));
 const HtmlWebpack = require(path.resolve(__dirname, 'webpack/htmlWebpack'));
+const govukFrontend = require(path.resolve(__dirname, 'webpack/govukFrontend'));
 
 const devMode = process.env.NODE_ENV !== 'production';
 const fileNameSuffix = devMode ? '-dev' : '.[contenthash]';
@@ -22,10 +22,17 @@ module.exports = {
         use: 'ts-loader',
         exclude: /node_modules/,
       },
+      {
+        test: /\.mjs$/,
+        type: 'javascript/auto',
+        resolve: {
+          fullySpecified: false,
+        },
+      },
     ],
   },
   resolve: {
-    extensions: ['.ts', '.js'],
+    extensions: ['.ts', '.js', '.mjs'],
   },
   output: {
     path: path.resolve(__dirname, 'src/main/public/'),

webpack/govukFrontend.js

@@ -1,23 +1,13 @@
 const path = require('path');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 
-const packageJson = require.resolve('govuk-frontend/package.json');
-const root = path.resolve(packageJson, '..', 'govuk');
-const sass = path.resolve(root, 'all.scss');
-const javascript = path.resolve(root, 'all.js');
-const components = path.resolve(root, 'components');
-const assets = path.resolve(root, 'assets');
-const images = path.resolve(assets, 'images');
-const fonts = path.resolve(assets, 'fonts');
-
 const copyGovukTemplateAssets = new CopyWebpackPlugin({
   patterns: [
-    { from: images, to: 'assets/images' },
-    { from: fonts, to: 'assets/fonts' },
+    { from: path.join(__dirname, '../node_modules/govuk-frontend/govuk/assets/images'), to: 'assets/images' },
+    { from: path.join(__dirname, '../node_modules/govuk-frontend/govuk/assets/fonts'), to: 'assets/fonts' },
   ],
 });
 
 module.exports = {
-  paths: { template: root, components, sass, javascript, assets },
   plugins: [copyGovukTemplateAssets],
 };

yarn.lock

@@ -1380,10 +1380,10 @@
     "@jridgewell/resolve-uri" "^3.0.3"
     "@jridgewell/sourcemap-codec" "^1.4.10"
 
-"@ministryofjustice/frontend@^1.3.0":
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/@ministryofjustice/frontend/-/frontend-1.3.0.tgz#f1982225927024565b5365adc7d8515c8af3f065"
-  integrity sha512-YE8xbuGkX8goM0jkV4tHhnzl3A0DD+eoX01XQDzfchRXQf2yQrCfoSdCJf3Xf5oBaknhtBSq3D0eKVt+vRu6OA==
+"@ministryofjustice/frontend@^1.4.2":
+  version "1.4.2"
+  resolved "https://registry.yarnpkg.com/@ministryofjustice/frontend/-/frontend-1.4.2.tgz#d105ada3bb7abf5977dcb742213178a7820a3959"
+  integrity sha512-vkJFncllNqVoogLEjsk2k1Fn1EtOV9IJS0XB1htw0x1nhq/fX1Edac3mY04IfQyzIiA9RNwIbV/5qQ83z+Akgg==
   dependencies:
     govuk-frontend "^3.0.0 || ^4.0.0"
     moment "^2.27.0"
@@ -5917,12 +5917,7 @@ got@^9.6.0:
     to-readable-stream "^1.0.0"
     url-parse-lax "^3.0.0"
 
-govuk-frontend@4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/govuk-frontend/-/govuk-frontend-4.0.1.tgz#bceff58ecb399272cba32bd2b357fe16198e3249"
-  integrity sha512-X+B88mqYHoxAz0ID87Uxo3oHqdKBRnNHd3Cz8+u8nvQUAsrEzROFLK+t7sAu7e+fKqCCrJyIgx6Cmr6dIGnohQ==
-
-"govuk-frontend@^3.0.0 || ^4.0.0":
+govuk-frontend@4.1.0, "govuk-frontend@^3.0.0 || ^4.0.0":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/govuk-frontend/-/govuk-frontend-4.1.0.tgz#d3bc3af09baba539adee31f980ac0322b9eeb949"
   integrity sha512-xBUUarxinGWSccmXPmwa7ovg3xabEQ0+Dcv7pdq9X3F69892OFMqP2g8jvlDUrVsDVdasXLk4Jq4w8dPiaEVqQ==