mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-23 07:46:23 -04:00
Merge pull request #3673 from alphagov/remove-page-title-hack-from-autofocus
Don't prefix with the page title when focusing on load
This commit is contained in:
@@ -4,26 +4,14 @@
|
|||||||
Modules.Autofocus = function() {
|
Modules.Autofocus = function() {
|
||||||
this.start = function(component) {
|
this.start = function(component) {
|
||||||
var $component = $(component),
|
var $component = $(component),
|
||||||
forceFocus = $component.data('forceFocus'),
|
forceFocus = $component.data('forceFocus');
|
||||||
labelText = $('label[for="' + $component.attr('id') + '"]').eq(0).text().trim(),
|
|
||||||
clearAriaLabel = evt => {
|
|
||||||
$component.removeAttr('aria-label');
|
|
||||||
$component.off('blur', clearAriaLabel);
|
|
||||||
};
|
|
||||||
|
|
||||||
// if the page loads with a scroll position, we can't assume the item to focus onload
|
// if the page loads with a scroll position, we can't assume the item to focus onload
|
||||||
// is still where users intend to start
|
// is still where users intend to start
|
||||||
if (($(window).scrollTop() > 0) && !forceFocus) { return; }
|
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');
|
$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);
|
|
||||||
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -50,28 +50,6 @@ describe('Autofocus', () => {
|
|||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test('has a label including the page title when the module starts', () => {
|
|
||||||
|
|
||||||
// start module
|
|
||||||
window.GOVUK.modules.start();
|
|
||||||
|
|
||||||
expect(search.hasAttribute('aria-label')).toBe(true);
|
|
||||||
expect(search.getAttribute('aria-label')).toEqual(document.title + ' - ' + labelText);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test('gets the original label back when focus moves away', () => {
|
|
||||||
|
|
||||||
// start module
|
|
||||||
window.GOVUK.modules.start();
|
|
||||||
|
|
||||||
// shift focus away from textbox
|
|
||||||
helpers.triggerEvent(search, 'blur');
|
|
||||||
|
|
||||||
expect(search.hasAttribute('aria-label')).toBe(false);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test('is not focused if the window has scrolled', () => {
|
test('is not focused if the window has scrolled', () => {
|
||||||
|
|
||||||
// mock the window being scrolled 25px
|
// mock the window being scrolled 25px
|
||||||
|
|||||||
Reference in New Issue
Block a user