localgovdrupal / localgov_base

The base theme for LocalGov Drupal websites.
8 stars 14 forks source link

202408 skiplink ios keyboard #587

Closed anthonylindsay closed 3 weeks ago

anthonylindsay commented 3 weeks ago

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

anthonylindsay commented 3 weeks ago

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