202408 skiplink ios keyboard

[anthonylindsay]

What does this change?

This is a workaround for an IOS/keyboard navigation bug which means focus never really gets to main content when using the skip link, and keyboard-navigation IOS users effectively cannot use the skip link.

It forces focus and a tabindex 0 value on the main content element. It also introduces an <a> as the target for main content, rather than <main>

How to test

This is primarily only testable with the correct hardware: an IOS device & external keyboard.

1. Load a page.
2. Navigate to the skip link
3. Hit ENTER to activate it.
4. Verify that you have been brought to the main content area (i.e. past main nav/header)
5. Hit TAB again.
6. Verify that focus is now on the next available link or focusable element within main content.

NB

• It is worth testing with a regular ol' browser via keyboard navigation and mouse click to make sure there is no regression.
• It can only really be validated with the correct hardware.

[anthonylindsay]

closing as there's a better way: tabindex=-1