On mobile devices, the first element of the Navigation block is focused by default

[skullblaka]

Hello,

i'm using twenty twenty-four, when i click on the nav icon, the first element is always focused.

From my screenshot, you can see I am on page "services" but, when i open the navbar, the "about" page is focused.

Whichever element is placed first will be focused when i open the navbar.
This is kind of misleading for the user.

Is it possible to avoid this behavior?

thanks

[audrasjb]

Hello, welcome to WordPress Core Trac and thanks for opening this ticket.

This behavior sounds logical to me as when the menu is opened via the menu button, the focus should be set to the menu so users using keyboard navigation can start to navigate through the menu items.

It wouldn't make sense to focus on the current menu item as people may want to navigate to the previous menu items as well.

By the way you can still override the menu items styles with custom css is this focus on the first item doesn't please yourself :)

Adding 2nd-opinion workflow keyword (while I'm pretty sure about this one) as it would be nice to get a confirmation from the accessibility team :)

[sabernhardt]

Since WordPress 5.9 and Twenty Twenty-Two 1.0, the Navigation block has moved focus from the button that opens and closes the menu to the first item in the (top-level) mobile menu.

In contrast, on larger screens, focus remains on a submenu's toggle button after the submenu is opened.

[skullblaka]

I'd like to point out that it doesn't really matter the device screen size.
if I use the nav icon in the desktop version, it has the same issue.

In this example, i'm on the home page but the about page is focused.

[joedolson]

I'd argue that focus should not be moved, as long as the position of the menu in the DOM is immediately after the menu toggle. Activating a toggle control to disclose content should only have a focus change if it will otherwise be difficult to reach the revealed content.

In general, unnecessary changes of focus are undesirable.

[joedolson]

The accessibility team agreed in today's bug scrub that the focus move is undesirable; focus should stay on the activating control.

I assume that this is an issue with the block, and should be moved upstream. I'll check the Gutenberg directory and report upstream if it's not already reported.

[joedolson]

Did not mean to close this.

[sabernhardt]

Yes, the focus change is already reported on GitHub:
​https://github.com/WordPress/gutenberg/issues/43947