search

microsoftgraph / microsoft-graph-toolkit

Authentication Providers and UI components for Microsoft Graph 🦒
https://docs.microsoft.com/graph/toolkit/overview
Other
944 stars 303 forks source link

[MGTP- Mgt-teams - Teams Channel Picker]: Screen Reader is conveying information of the channel name twice while navigating to the list of channel. #2293

Closed vagpt closed 9 months ago

vagpt commented 1 year ago

Test Environment: OS Build: Windows 11 Version: 22H2 (OS Build 25346.1001) Browser: Edge dev Browser Version 115.0.1843.0 (Official build) dev (64-bit) URL: https://mgt.dev/next/v3/?path=/story/components-mgt-teams-channel-picker--get-selected-channel User ID: V-id Screen reader: Narrator

Repro Steps:

  1. Open the above URL and login with valid credentials.
  2. Turn on Narrator using 'Ctrl+ win+ enter' key.
  3. 'Microsoft Graph Toolkit Playground' Overview page will get displayed.
  4. Navigate to the 'Component' and press tab key to navigate to the 'mgt-tasks'.
  5. Press enter key to select 'Get selected Channel'.
  6. Navigate to the 'Select a Channel' edit field and press spacebar key to expand it.
  7. Navigate to the 'Channel List' and observe the issue.

Actual Result: While navigating to the 'Channel List', screen reader conveys the name twice for every channel list name.- It is announcing as 'HR Taskforce HR Taskforce level 1 of 3' collapsed selected.

Expected Result: Screen Reader should convey the 'Channel List' name only one time, while navigating to the list it should announce as 'HR Taskforce Level 1 of 3 collapsed selected'.

Note:

  1. Same issue is reproduced with NVDA screen reader.
  2. This issue is repro throughout the Teams channel screen.

User impact: This will impact the screen reader user as it will annoy the user if the screen reader does convey the information twice for the channel names.

WCAG Reference Link: https://www.w3.org/TR/UNDERSTANDING-WCAG20/content-structure-separation-programmatic.html

Have feedback to share on Bugs? Please help fill Trusted Tester Bug Feedback (office.com)"

WCAG1 3 1-Screen Reader is conveying information of the channel name twice while navigating to the list of channel

https://github.com/microsoftgraph/microsoft-graph-toolkit/assets/95913748/386a372f-869b-47f0-905b-6594cdb22f27

ghost commented 1 year ago

Hello vagpt, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will analyze and investigate the issue, and escalate it to the relevant team if possible. Other community members may also look into the issue and provide feedback 🙌

gavinbarron commented 1 year ago

@vagpt I believe the first announcement is coming from the alt text for the image and the second from the text. During other work the alt text was updated to use the form Teams photo for {TeamName} as such the announcements by the screen reader are different now.

Could you please re-test this and either close or provide more guidance on how we should announce these items, do we make the image have role=presentation as it's not conveying a lot of information?

vagpt commented 1 year ago

Hi @gavinbarron,

Could you please provide us updated URL to retest this issue? Once we retest this issue then only we can provide any guidance on it.

CC@ @Raisul123

sebastienlevert commented 1 year ago

https://mgt.dev should be good for this one

vagpt commented 1 year ago

Hi @gavinbarron and @sebastienlevert

We have retest this issue on the provided URL by you and issue is still repro.

Here you can set the 'alt=null' so that screen reader will not announce the name twice. Also, if you make image role=presentation in this case user is not able to access the image in scan mode so it is good to set the 'alt' as null.

gavinbarron commented 1 year ago

@vagpt For me I hear "Teams photo for HR Taskforce HR Taskforce" not "HR Taskforce HR Taskforce" can you confirm that is what you are hearing announced?

vagpt commented 9 months ago

This issue is not repro, hence closing this issue.