WCAG 2.2: Investigate thickness of input focus state border

[owenatgov]

What

Investigate if the increased black border for the focus state of form inputs needs to be thicker.

Why

During testing of components against WCAG 2.2 criterion 2.4.13: focus appearance as part of https://github.com/alphagov/govuk-frontend/issues/4347, it was discovered that several form input components that use a similar "box highlight" style focus state fail this criterion. This is because the black border isn't thick enough to meet the size requirements for this criterion and the yellow highlight can't count towards this as it's too low contrast against the white background. Increasing the black border could fix this.

This impacts the following components:

• Date input
• Select
• Text input
• Textarea (which will also impact character count)

It additionally effects radios and checkboxes but for slightly different reasons, although it's valuable to tackle these at the same time.

Further reading

• Testing spreadsheet (internal only)
• https://github.com/alphagov/govuk-design-system/issues/3007 - related issue on focus state rationalisation

Who needs to work on this

Developers, designers

Who needs to review this

Developers, designers