search

pwa-builder / PWABuilder

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.
https://docs.pwabuilder.com
Other
2.54k stars 273 forks source link

[PWA Builder - DOCS]: State property not defined for the expendable buttons present in left navigation pane. #4753

Open Suriya617 opened 2 weeks ago

Suriya617 commented 2 weeks ago

What happened?

The expandable buttons in the left navigation pane do not have the expanded/collapsed state defined. As a result, screen readers do not announce whether these buttons are expanded or collapsed.

How do we reproduce the behavior?

Repro Steps: Open the PWA Builder URL in Anaheim dev browser. Turn on Narrator using 'Ctrl + Win + Enter' key. PWA Builder page will appear. Navigate to the left pane controls. Observe the issue.

What do you expect to happen?

The expandable buttons should have their expanded/collapsed state clearly defined using appropriate ARIA attributes so that screen readers can announce the state to users.

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- Screen Reader: Narrator URL: https://docs.pwabuilder.com/#/home/native-features

Additional context

User Experience: Users, particularly those who rely on screen readers, are unable to determine whether the expandable buttons in the left navigation pane are in an expanded or collapsed state. This lack of feedback can lead to confusion and hinder efficient navigation.

WCAG Reference: https://www.w3.org/WAI/WCAG21/Understanding/name-role-value

https://github.com/pwa-builder/PWABuilder/assets/87321866/d4664511-328d-4192-a9cd-d8ce70862bd8

Code_Snip (1)

microsoft-github-policy-service[bot] commented 11 hours ago

This issue has been marked as "needs attention 👋" since it has not been triaged for 7 days. Please triage the issue .