Header | User Profile: Tab key allows navigation between menu items

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The Tab key moves focus between the individual menu items (Light, Dark, and Match browser).

      Steps to Reproduce

      1. Open the Confluence Cloud homepage.
      2. Navigate to the “cgoyal” user profile expandable button in the header section and activate it.
      3. Using a keyboard, navigate to the "Theme" menu button  and activate it.
      4. Press the Tab key to move focus forward.
      5. Observe that keyboard focus moves to each individual menu item within the Theme menu.

      Screen Recording

      Menu Focus Management Issue

      Actual Results

      When users activate the “Theme” menu button, focus initially moves to the “Light” menu item. However, when users press the Tab key, focus moves sequentially between the individual menu items (Light, Dark, and Match browser) instead of following the expected keyboard interaction pattern for a menu.

      This issue occurs because focus is not properly managed within the Theme menu. As a result, keyboard-only and screen reader users may experience unexpected and inconsistent navigation, making it difficult to understand and efficiently interact with the menu.

      Expected Results

      Focus should move through the Theme menu according to the expected keyboard interaction pattern without requiring users to press Tab to navigate between individual menu items.
      Since the component uses role="menu" with role="menuitemradio" items, implement the expected keyboard interaction pattern for an accessible menu:

      • Ensure that pressing Tab does not move focus between individual menu items.
      • Use Arrow Up/Down keys to move focus between the menu items.
      • Ensure that Tab moves focus out of the menu to the next appropriate focusable element.
      • Escape should close the menu and return focus to the Theme menu button.

      For guidance on implementing an accessible menu button and its keyboard interaction pattern, refer to the Accessible Menu Example.

      Workaround

      Currently there is no known workaround for this behavior. A workaround will be added here when available

      Environment

      MacBook Pro (16-inch, 2021)
      macOS Tahoe 26.6.2
      Windows 11
      Chrome - 153.0.8010.37 (Official Build) (64-bit)
      Microsoft Edge - 152.0.4191.66 (Official build) (64-bit)
      Safari- Version 26.6.2
      JAWS- Version 2026
      NVDA- Version 2026.2
      VoiceOver - Version Latest

              Assignee:
              Ward Oosterlijnck
              Reporter:
              Chirag Goyal
              Votes:
              0 Vote for this issue
              Watchers:
              4 Start watching this issue

                Created:
                Updated: