feat: add support for v5 of the Design System #528
Conversation
gregtyler
force-pushed
the
support-govuk-frontend-5
branch
5 times, most recently
from
ac6ecf1
to
579ee53
Compare
|
Because This is a breaking change and makes this a major release. That means this also might be a good opportunity to remove support for IE8 in line with This might also be a good opportunity to update support for Node versions: Node 16 just left maintenance and the current LTS is Node 20. |
gregtyler
force-pushed
the
support-govuk-frontend-5
branch
2 times, most recently
from
c07764d
to
6e19e78
Compare
Testing with the changes to govuk-frontend in version 5 of the Design System, alongside related changes in MOJ Pattern Library. NB: to test locally, you must copy the contents of the MOJPL `package` folder from [its WIP branch](ministryofjustice/moj-frontend#528) into a folder in the root of this repo called `./moj-frontend`. Changes we have to make: - Update path of dist files in govuk-frontend - Remove `data-module="govuk-details"` (it no longer does anything) - Use `[disabled]` attribute rather than `govuk-button--disabled` class (which has been removed) - Update body class initialisation I haven't added `type="module"` to the `<script>` tag because we don't _need_ to, but we might like to do so for closer alignment with GDS guidance. #major
Allows the Pattern Library to be used with v5 of the Design System, and uses v5 by default in the documentation. This currently continues to support IE8 by providing a copy of the `govuk-if-ie8` mixin.
This is how the GOV.UK Design System recommends installing v5+. Doing so also ensures that we can support ES modules for our users, and highlighted an issue with an undefined variable in the Password reveal JavaScript.
Directly requiring individual govuk-frontend SCSS files is risky, as govuk-frontend could move their internal files and break our compatibility. This has happened in v5 of govuk-frontend, and we cannot support both ≤v4 and v5 at the same time with the current method. Instead, we will require users to separately import govuk-frontend before moj-frontend. In reality users should already be doing this, as using moj-frontend code without govuk-frontend will cause an inconsistent UI. Anyone who _isn't_ doing so already will just need a one line import: ```scss @import "node_modules/govuk-frontend/dist/govuk/all"; ``` To still be able to build our distributable version, which also requires govuk-frontend code to be built, create a wrapper `dist.scss` with the specific imports required. BREAKING CHANGE: If you are building moj-frontend from SCSS, you must include govuk-frontend beforehand
It's the current LTS so we should be using it in tests
Switch to v5.0.0 of `govuk-frontend` now that it has been released
gregtyler
force-pushed
the
support-govuk-frontend-5
branch
from
1936cfb
to
59c4440
Compare
To give people an easier upgrade path rather than needing to do a paired upgrade. BREAKING CHANGE: if you build your CSS from this package's SCSS, you may need to update your import path
Stop building IE8 CSS distributions. Remove IE8-specific rules from SCSS. BREAKING CHANGE: This package no longer provides support for IE8
|
@gregtyler Anything I can do to help progress this? |
|
@ttbarnes If you can try out the pre-release on your service to check it works alongside v5 of the GOV.UK Design System, any feedback would be helpful. I haven't seen much feedback—positive or negative—but if we don't hear anything negative soon then hoping to release in the first weeks of 2024. |
|
Thank you @gregtyler great stuff. I have just tested the pre-release - we're only using a couple of MOJ components, but all seems great including JS/SCSS compilation alongside the latest GOV design system 👍 |
|
We're using the timeline component in our service and it also looks good under this pre-release. |
We have to wait for '@ministryofjustice/frontend' to support 'govuk-frontend' to support v5 Work is going on to support v5 ministryofjustice/moj-frontend#528
To v2.0.0
gregtyler
changed the title
# [2.0.0](v1.8.1...v2.0.0) (2024-01-08) ### Features * add support for v5 of the Design System ([#528](#528)) ([6bfd2a3](6bfd2a3)) ### BREAKING CHANGES * This package no longer supports v3 or v4 of govuk-frontend * This package no longer supports Internet Explorer 8
|
🎉 This PR is included in version 2.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
This has now been released in version 2.0.0
This is a work-in-progress to allow services using the MOJPL to test v5 of the Design System
Allows the Pattern Library to be used with v5 of the Design System, and uses v5 by default in the documentation.
Changes
We currently continue to support IE8 by providing a copy of the
govuk-if-ie8mixin which was removed in v5 of the Design System. This is so we can continue to support services which still support IE8 and use v5 of the Design System, though we may also drop support in a subsequent update.Status
The build is currently failing because of a private peer dependency in govuk-frontend. That is being moved to a dev dependency, which should unblock this build.