Our plans to maintain this component

[calvin-lau-sig7]

Later in 2022, we’ll carry out research to understand how we can support services that use this component.

We’ll work with other teams in GDS to find the best way to keep the component up-to-date with the latest technologies and for accessibility.

We hope to find out more about:

• services that use the current autocomplete
• their different use cases
• customisations or ‘hacks’ that teams have made
• datasets in use
• accessibility work service teams have done, and what needs they’ve discovered

If you’d like to help or share your experiences, leave a comment in this issue.

[edwardhorsford]

DfE has used the autocomplete extensively and would be happy to chat.

In particular we've done work to add our own much improved suggestion engine to greatly improve the quality of results. This was made so that it could be a drop in replacement for the existing one.

[adamliptrot-oc]

There are a good number of teams at HMRC using the accessible autocomplete and country/territory autocomplete. We've also added some improvements to make it work a little better.

[terrysimpson99]

This appears to be the single source of truth for HMG country names: https://www.gov.uk/government/publications/geographical-names-and-information

Comments?

[freyjadomville]

At Historic England, who sit under DCMS, we're using this component in the upcoming redesign of the Listing and Designations Form to enhance a select field for Counties and Unitary Authorities with autocomplete, specifically for the accessibility features it provides when enhancing a select. If you need to please feel free to get in touch with us to discuss support we might need with releasing a new version, or testing a beta of the new autocompletion engine - I'd be happy to have a back and forth with you on this.

[paulrobertlloyd]

We’re using this component at DLUHC. On the service I’m currently working on (Submit social housing lettings and sales data (CORE)), we’re using it to help users find and select a local authority, with other uses cases where a user needs to find a select from a large dataset in the works. I also worked on teams at DfE where this component was used extensively, and it was complimented by the team at DAC when they audited our service.

We’ve been referring to this as an officially-unofficial component – it’s inclusion in the design system proper would be greatly welcomed. There are a lot of fiddly aspects to this that can crop up, and I’m not sure if it can ever be perfect, but it often provides a solution that is so much better than any of the alternatives.

[paulmsmith]

I have used this component in the past. @paulrobertlloyd's description 'offically-unofficial' is good a reflection of how most teams I've used it with have viewed it.

I'd wager that this is enough of a common problem to warrant being included in the design system and would very much welcome an updated version with community improvements. I recognise that this would not be a small piece of work to build (and support) though.

[terrysimpson99]

@calvin-lau-sig7 or anyone: I looked but failed to find the source of countries.

Is it the Geographical names index (https://www.gov.uk/government/publications/geographical-names-and-information) managed by the Foreign Office?

There are also ongoing discussions about an approved set of Welsh names across government. Would you be able to support that?

[paulwaitehomeoffice]

We're using the accessible autocomplete on https://www.electronic-visa-waiver.service.gov.uk and https://www.faster-uk-entry.service.gov.uk — it's been incredibly useful to have a re-usable components that seems to meet WCAG 2.1 and work well with assistive technologies.

[Tosin-Balogun]

Thanks for creating this pool @calvin-lau-sig7

We have a number of teams using or considering autocomplete/autosuggest in their service at the moment within the NHS design estate. It would be great to share some of what we have discovered along with what you are doing.

I'm currently introducing it with a clinical admin system within national screening...

UPDATE - See the implementation and user feedback here https://github.com/nhsuk/nhsuk-service-manual-community-backlog/issues/111#issuecomment-1040135967

---

NHS autocomplete Github issue

[tvararu]

Really exciting!

Please reach out to me as well if you need any help unpicking some of the code. :)

[edwardhorsford]

We wrote up a blog post about how we've improved the sorting and filtering functions to fix several issues and improve usability. The code is intended to be 'drop-in' with minimal additional work needed.

Post: https://bat-design-history.netlify.app/register-trainee-teachers/autocomplete-improvements/

[f-marry]

Would be great to also fold in the UI improvement described here: https://bitzesty.com/2020/09/25/making-gov-uk-accessible-autocomplete-a-suitable-replacement-for-select-enhancement/

[emilieviau]

Among possible improvements :

• Focus management on dismissal : when the user is inside the list of suggestions and wants to get out of it, focus should return to the input field after dismissal).

[RichardBradley]

We are using this component on the Register to Vote service at DLUHC as well as a few related public facing services.

We have made some small customisations in our integration, notably that we need different lists of countries in different contexts (e.g. Isle of Man is allowed as a country of residence but not as a nationality), and we need to annotate countries with metadata about voting franchises in the UK.

We would be happy to discuss

[matthewford]

We still use it on the kings' awards services, with changes to make it more like a select for a select2 replacement. https://github.com/alphagov/accessible-autocomplete/pull/467

[Gcamara14]

I just reviewed this component on NVDA and it works well. But like @emilieviau says, when I press the escape key. Focus does not go to the input field, it has a focus reset, it goes to the body:

• Code Demo: https://alphagov.github.io/accessible-autocomplete/examples/form.html

Instructions to test:

1. Visit the page
2. Set a live expression to document.activeElement (https://developer.chrome.com/docs/devtools/accessibility/focus/)
3. Observe pressing the escape key to dismiss the autocomplete, it resets.

[stevenjmesser]

If you’re using Accessible Autocomplete in your service, please fill in our usage survey and we can bring together a group of services to help us.

[stephenjmcneill1971]

This component is built with 14.* version it should be the LTS so it can be installed as a dependency easily. Has anyone had trouble building this component with 18.* node version.