Skip to content

Commit

Permalink
Update browser support doc with drafted content
Browse files Browse the repository at this point in the history
  • Loading branch information
romaricpascal committed Dec 8, 2023
1 parent a9bccd2 commit 3c4b8da
Showing 1 changed file with 26 additions and 18 deletions.
44 changes: 26 additions & 18 deletions docs/contributing/browser-support.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@ The Design System team needs to balance how we support older browsers using Java
- engineering - for example, if a browser has an outdated APIs
- end-users (larger file sizes to download and run due to extra code for using the old APIs, or replicating features from newer APIs)

From GOV.UK Frontend v5.0.0 onwards, Internet Explorer 11 will no longer run GOV.UK Frontend JavaScript and support is completely removed for Internet Explorer 8 to 10. Our CSS are still compatible with Internet Explorer 11.

## Browsers grades

You can view [a summary of the grades and the support we provide on the GOV.UK Frontend site](https://release-5-0--govuk-frontend-docs-preview.netlify.app/browser-support/). To help manage the ever-growing number of browser versions, we group browsers into 4 grades:
You can view a summary of [the grades and the support we provide](https://frontend.design-system.service.gov.uk/browser-support/) on the GOV.UK Frontend site. To help manage the ever-growing number of browser versions, we group browsers into 4 grades:

- **grade A** - Most recent stable versions of Chrome, Firefox, Edge, Samsung Internet and Safari
- **grade B** - All stable versions of Chrome, Firefox and Edge released in the last 6 months and the last 4 major stable releases of Safari which are not supported in Grade A
- **grade C** - [All browsers that support <script type="module">](https://caniuse.com/es6-module) (Chrome 61+, Edge 16-18, Edge 79+, Safari 10.1+ (mac), Firefox 60+, Opera 48+, Safari 10.3+ (iOS), Samsung Internet 8.2+)
- **grade B** - All stable versions of Chrome, Firefox and Edge released in the last 6 months and all the major stable releases of Safari which are not supported in Grade A
- **grade C** - [All browsers that support `<script type="module">`](https://caniuse.com/es6-module) (Chrome 61+, Edge 16-18, Edge 79+, Safari 10.1+ (mac), Firefox 60+, Opera 48+, Safari 10.3+ (iOS), Samsung Internet 8.2+)
- **grade X** - All other browsers (including IE11 and older)

> **Note: Only browsers in grades A, B and C will run our JavaScript enhancements. We will not support our JavaScript enhancements for older browsers in grade X.**
Expand All @@ -22,33 +24,33 @@ You can view [a summary of the grades and the support we provide on the GOV.UK F

We distinguish between two kinds of enhancements provided by our JavaScript components:

- Necessary enhancements - which users require to complete their task once JavaScript is running. For example, accessibility fixes such as the handling of keyboard events for role=button
- Optional enhancements - which do not prevent users from using the component if theyre absent or working more simply. For example, the ability to search within sections of an Accordion without opening them
- Necessary enhancements - which users require to complete their task once JavaScript is running. For example, accessibility fixes such as the handling of keyboard events for role="button"
- Optional enhancements - which do not prevent users from using the component if they're absent or working more simply. For example, the ability to search within sections of an Accordion without opening them

## Necessary enhancements

We will make sure necessary enhancements are available in all browsers running our JavaScript enhancements (Grades A, B and C). Wherever possible, we aim to provide the same baseline experience across these browsers.
We'll make sure necessary enhancements are available in all browsers running our JavaScript enhancements (Grades A, B and C). Wherever possible, we aim to provide the same baseline experience across these browsers.

## Optional enhancements

For all grade A and grade B browsers, we aim to provide the same baseline experience. One exception is enhancements that require vendor specific features. For example, `hidden="until-found"` which is only implemented in Chrome at the time of writing.

For grade C browsers, we aim to support optional enhancements as much as possible. However, we might sometimes need to adjust the components behaviour, while still allowing the users to complete their task. This might include:
For grade C browsers, we aim to support optional enhancements as much as possible. However, we might sometimes need to adjust the component's behaviour, while still allowing the users to complete their task. This might include:

- falling back to the no-JavaScript experience
- disabling parts of the enhancement
- doing a simpler alternative

When deciding how much support we provide to grade C browsers using Javascript enhancements, we will take into account:
When deciding how much support we provide to grade C browsers using JavaScript enhancements, we'll take into account:

- what impact removing the enhancement will have on users and service teams
- whether there is wide usage of browser features used by our Javascript enhancements - for example, we'll provide support if a large number of grade C browsers have features for specific enhancements
- whether there is wide usage of browser features used by our JavaScript enhancements - for example, we'll provide support if a large number of grade C browsers have features for specific enhancements
- whether the enhancement is important for certain types of user, for example, if the feature is an accessibility enhancement that benefits screen reader users
- the overhead of polyfilling and/or transpiling, in terms of the amount of extra JavaScript users need to download, or the effect it has on loading and runtime performance
- the engineering effort required, for the initial work and to maintain and support the enhancement or polyfill over time
- our confidence in our understanding of all of the previous points in this list

Where behaviour might differ in older browsers, we will document those differences in the Design System. We will also communicate any changes in our release notes.
In instances where behaviour might differ in older browsers, we'll document those differences in the Design System. We'll also communicate any changes in our release notes.

## How we support browsers

Expand All @@ -63,7 +65,9 @@ Supporting a browser involves more than considering whether JavaScript enhanceme
- optional enhancements being available to users
- bug prioritisation

The following information shows the level of support for the 3 grades of browsers (A, B and C) which run our JavaScript. We’ve not provided detail for Grade X browsers as we’re not supporting enhancements for them and the prioritisation for bugs is ‘will not fix’.
The following shows the level of support for the 3 grades of browsers (A, B and C) which run our JavaScript.

We've excluded Grade X browsers from the following information as we're not supporting enhancements for them and the prioritisation for bugs is 'will not fix'.

## Grade A

Expand All @@ -75,7 +79,7 @@ For support we will:
- do automated testing where possible
- make sure our JavaScript downloads and parses correctly
- make sure the necessary enhancements work
- only disable optional enhancements only if needing a browser specific API
- only disable optional enhancements if a service needs a browser specific API
- give a high priority to fixing reported bugs

## Grade B
Expand All @@ -88,7 +92,7 @@ For support we will:
- where possible, do automated testing on the oldest version
- make sure our JavaScript downloads and parses correctly
- make sure the necessary enhancements work
- only disable optional enhancements only if needing a browser specific API
- only disable optional enhancements if a service needs a browser specific API
- give a lower priority to fixing reported bugs

## Grade C
Expand All @@ -104,7 +108,7 @@ This grade covers browsers not in Grade A or B which support <script type="modul
- Safari 10.3+ (iOS)
- Samsung Internet 8.2+

Safari 10.1 also supports <script type="module"> but will 'exit early' as it does not support HTMLScriptElement.prototype.noModule which is how we test support for <script type="module"> from within our JavaScript.
Safari 10.1 also supports `<script type="module">` but will 'exit early' as it does not support `HTMLScriptElement.prototype.noModule` which is how we test support for `<script type="module">` from within our JavaScript.

For support we will:

Expand All @@ -117,18 +121,22 @@ For support we will:

## How we rely on browser features

As browsers evolve, well use our browser support guidelines to decide whether or not to use a new browser feature.
As browsers evolve, we'll use our browser support guidelines to decide whether or not to use a new browser feature.

Well wait until all grade A and B browsers support a new feature before adopting it and consider if:
We'll wait until all grade A and B browsers support a new feature before adopting it and consider if:

- it allows us to do something we can only do with this feature
- we include a polyfill or other fallback mechanism to provide equivalent features in at least grade A and B browsers

Well also consider adopting a new feature if:
We'll also consider adopting a new feature if:

- all grade A browsers have shown an 'intent to ship' the feature
- the feature is included as part of the relevant specification

Where a feature is supported by all grade A and B browsers, we might also consider transpiling, including a polyfill or a fallback mechanism for grade C browsers.
Where a feature is supported by all grade A and B browsers, we might also consider ways to  accommodate grade C browsers such as:

- transpiling
- including a polyfill
- including a fallback mechanism

Once a feature is supported by all grade A and B browsers, we might decide to remove or simplify any transpilation, polyfills or fallback mechanisms, polyfills or fallback mechanisms for grade C browsers as and when it becomes appropriate.

0 comments on commit 3c4b8da

Please sign in to comment.