Mobile version should have focus trap

I agree with mherchel → that when a user enters the mobile nav, keyboard focus must be trapped within it until the user:

* Selects the Close/OK/X button
* Selects the ESC key
* Clicks outside of the menu with their mouse

However I disagree on the WCAG success criteria that this violates. I believe that this violates 2.1.2 No Keyboard Trap (Level A). Under an example in this SC titled "A modal dialog box", it mentions:

A Web application brings up a dialog box. At the bottom of the dialog are two buttons, Cancel and OK. When the dialog has been opened, focus is trapped within the dialog; tabbing from the last control in the dialog takes focus to the first control in the dialog. The dialog is dismissed by activating the Cancel button or the OK button.

The WCAG 2.4.7 Focus Visible (Level AA) SC refers to the visible focus indicator for focusable elements.

I like Mike's idea.

Probably it is possible to merge that core/misc/focus-trap.js logic with existing arrow navigation:

https://git.drupalcode.org/project/drupal/-/blob/11.x/core/modules/navig...

Or move it on core level out of module.

Or move it on core level out of module.

Yeah, this is my thought. In the MR above, I abstracted it to be on the core level, and then make use of it in both navigation and olivero (to show that it can be used in multiple places).

imo it should be possible to ignore desktop somehow.

imo it should be possible to ignore desktop somehow.

Yeah, that makes sense. Should be doable!

The existing tabbingmanager feature has tests, this one should too

I believe this would be SC 2.4.11 Focus Not Obscured (Minimum) (Level AA). It directly addresses user openable, persistent disclosures and uses slide-out navigation as an example.

When the additional content is opened, it takes focus and the tab ring is constrained to the new content until it is dismissed. This modality is somewhat like a dialog, in that a user cannot navigate beyond the opened content by keyboard without dismissing it first (typically by pressing Esc). However, unlike in a modal dialog, in some implementations a pointer user may be able to interact with content outside the opened section without dismissing it. Since this pattern potentially creates an inequitable experience between keyboard and pointer users, it should be used cautiously. That said, it does prevent the opened content from obscuring the keyboard focus in the main content, and thus should pass this SC. This is described and demonstrated in a short video in the Knowbility article in the reference section, under the section heading Keep keyboard focus in the slide-out navigation until it's closed.

Tagging