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

{Linked:Bug3432717}[BUG] Voiceover does not announce the Person component if present in List component #2120

Closed saahilchawande123 closed 1 year ago

saahilchawande123 commented 1 year ago

Describe the bug This bug is happening when the component from Microsoft Graph Toolkit is used inside a list item of the and component from React Northstar (Link to doc: https://fluentsite.z22.web.core.windows.net/0.66.2/components/list/definition)

To Reproduce Steps to reproduce the behavior:

  1. Create a list using the component from React Northstar
  2. Create a child for the component
  3. Add component in the component
  4. Use VoiceOver on iOS mobile to see this error. Voiceover reads "Menu Item" instead of reading the contents displayed by the component.

Expected behavior Voiceover should read the contents displayed by the component.

Screenshots (Video Recording) https://user-images.githubusercontent.com/116312427/223588456-6b46b44a-13ff-401b-b6dc-d5c725029c9d.mp4

Code Snippet causing the issue: image

Environment (please complete the following information):

Additional context I also tried to check if this issue is caused due to the or component from react-northstar by changing the component to component and the Voiceover was announcing the contents perfectly fine (meaning voiceover was reading the contents and not "menu item").

ghost commented 1 year ago

Hello saahilchawande123, 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

Thank for raising this @saahilchawande123 do you have a code reproduction available that we can use to start investigating this issue?

saahilchawande123 commented 1 year ago

I don't have a stand-alone code representation but this issue also happens when the Person component is rendered in a standard html ul list. Do let me know if it is still unclear and the reproduction is still needed. Thanks.

gavinbarron commented 1 year ago

I understood the description, I asked if there was an available reproduction to save time on building one.

saahilchawande123 commented 1 year ago

Alright, is there a canvas link that I can create and share? Because it is very difficult to write the code on mobile and copy/pasting is not working.