Don't prefix with the page title on focus

Doing this was helpful to Voiceover users as its
announcement of the label meant the page title
(normally announced onload) wasn't skipped.

This isn't the case with JAWS so, prefixing the
title makes it announce it twice.

JAWS has a lot more users and the title being
announced twice is more confusing than not at all
so this removes it.
This commit is contained in:
Tom Byers
2020-10-03 19:47:39 +01:00
parent 4113fabdcb
commit 90504d9b6c
2 changed files with 1 additions and 35 deletions

View File

@@ -4,26 +4,14 @@
Modules.Autofocus = function() {
this.start = function(component) {
var $component = $(component),
forceFocus = $component.data('forceFocus'),
labelText = $('label[for="' + $component.attr('id') + '"]').eq(0).text().trim(),
clearAriaLabel = evt => {
$component.removeAttr('aria-label');
$component.off('blur', clearAriaLabel);
};
forceFocus = $component.data('forceFocus');
// if the page loads with a scroll position, we can't assume the item to focus onload
// is still where users intend to start
if (($(window).scrollTop() > 0) && !forceFocus) { return; }
// screenreaders announce the page title when a new page loads
// this will be lost when focus is moved to our form control so add it to the label instead
$component.attr('aria-label', document.title + ' - ' + labelText);
$component.filter('input, textarea, select').eq(0).trigger('focus');
// the page title prefix is only needed on page load so remove once focus has shifted
$component.on('blur', clearAriaLabel);
};
};