The simplest way to create progressive web apps across platforms and devices. Start here. This repo is home to several projects in the PWABuilder family of tools.
The selected menu buttons in the left navigation pane do not have a visible keyboard focus indicator, making it challenging for users to know which element is currently focused.
How do we reproduce the behavior?
Repro Steps:
Open the PWA Builder URL in Anaheim dev browser.
PWA Builder page will appear.
Navigate to the left pane controls.
Observe the issue.
What do you expect to happen?
The selected menu buttons should have a clear and visible keyboard focus indicator to provide feedback to users about which menu item is currently focused.
What environment were you using?
Test Environment:
OS Build: Windows 11 Enterprise Insider Preview 24H2 (26120.961)
Edge Browser: Version 127.0.2651.2 (Official build) dev (64-bit)
User ID: V-
URL: https://docs.pwabuilder.com/#/home/native-features
Additional context
User Impact:
Users, especially those who rely on keyboard navigation, are unable to visually determine which menu button in the left navigation pane is currently focused. This lack of a visible focus indicator can cause confusion and hinder navigation, making it difficult for users to interact with the interface effectively
What happened?
The selected menu buttons in the left navigation pane do not have a visible keyboard focus indicator, making it challenging for users to know which element is currently focused.
How do we reproduce the behavior?
Repro Steps: Open the PWA Builder URL in Anaheim dev browser. PWA Builder page will appear. Navigate to the left pane controls. Observe the issue.
What do you expect to happen?
The selected menu buttons should have a clear and visible keyboard focus indicator to provide feedback to users about which menu item is currently focused.
What environment were you using?
Test Environment: OS Build: Windows 11 Enterprise Insider Preview 24H2 (26120.961) Edge Browser: Version 127.0.2651.2 (Official build) dev (64-bit) User ID: V- URL: https://docs.pwabuilder.com/#/home/native-features
Additional context
User Impact: Users, especially those who rely on keyboard navigation, are unable to visually determine which menu button in the left navigation pane is currently focused. This lack of a visible focus indicator can cause confusion and hinder navigation, making it difficult for users to interact with the interface effectively
WCAG Reference: https://www.w3.org/WAI/WCAG22/Understanding/focus-visible
Attachments:
https://github.com/pwa-builder/PWABuilder/assets/87321866/b76c1ecd-19a2-4379-b59f-6a97af5df427