alphagov/govuk_frontend_toolkit

Skip link not correctly moving focus in IE9/10/11

Closed this issue · 2 comments

We've noticed that when using the "Skip to main content" link, it's not correctly moving the focus to the <main id="content" role="main"> in IE9/10/11.

This bug can also be seen when using https://www.gov.uk/vehicle-tax.

Steps to reproduce:

  1. Visit https://www.gov.uk/vehicle-tax in IE9/10/11
  2. Tab to and select the "Skip to main content" link with enter key

Expected behaviour:
Subsequent tabbing should start from the <main> content. i.e.: the next tab press should move focus to the "In Welsh" link. Works in Chrome 57, Firefox 52 and Edge 14.

Actual behaviour:
The next tab key press actually moves focus to the breadcrumb "Home" link in IE9/10/11, which is not within the <main> content area.

This is an IE bug. It scrolls the page but doesn't change the focus. Applying tabindex=0 or tabindex=1 to the target element would fix the issue.

Can be applied directly or dynamically via javascript.

Thanks @igloosi.

I'll close this out since it's fairly old, please re-open if you run into any issues! 😄