Update to 'Exit this page' default text may cause issues for voice control users

[matteason]

#3989 updated the default content of the 'Exit this page' button to add 'Emergency' as visually-hidden text at the start of the button.

Adding visually-hidden content to the start or middle of text on interactive elements can cause issues activating them for voice control users (eg Dragon, Apple Voice Control) because the label exposed to these tools ('Emergency Exit this page') doesn't match what the user will say ("Click 'Exit this page'"). Generally voice control needs an exact match on the start of the string, but anything extra at the end is fine - so making it something like Exit this page<span class="govuk-visually-hidden"> in an emergency</span> would probably be OK.

References:
https://www.smashingmagazine.com/2022/06/voice-control-usability-considerations-partially-visually-hidden-link-names/#problems-with-partially-visually-hidden-text
https://www.sarasoueidan.com/blog/accessible-text-labels/#improving-the-experience-for-screen-reader-users-whilst-keeping-it-accessible-to-speech-input-users

I haven't tested yet but I have access to Dragon so I'll test in that to confirm ASAP. I just spotted this change in the v5 beta release notes and wanted to flag it as quickly as possible.

[matteason]

I've now had a chance to test this in Dragon on Windows and Voice Control on iOS

Surprisingly, Dragon 15 with Chrome is actually fine. I could say 'click exit this page' and the button activated without any problems.

In iOS Voice Control, saying 'tap exit this page' didn't work, I had to say 'tap emergency exit this page'. But moving the visually hidden text to the end didn't actually help - I had to say the full text of the label every time. This problem isn't unique to ETP, I tested change links on summary lists and the same issue exists there. Voice Control isn't on the list of AT to test with in the Service Standard though.

The same issue exists in Voice Control if you use an aria-label instead (it expects you to say the text of the aria-label). aria-description could be a solution - the element text could stay as "Exit this page" with aria-description="Exit page in an emergency" to give the added context to screen reader users. That would mean the extra text wouldn't show up in some places though, eg the element list in NVDA

I'll leave this open for you to decide what to do with it (if anything) but I understand if you close it without any changes because Voice Control isn't mandated in the Service Standard