[MGTP-Samples-General-Localization-Select user]: The language of part is not defined for the 'Select user', 'Select channel' combo edit fields.

[vagpt]

Test Environment:
OS Build: Windows 11
Version: 22H2 (OS Build 25300.1000)
Browser: Edge dev
Browser Version 114.0.1807.5 (Official build) dev (64-bit)
URL: https://mgt.dev/next/v3/?path=/story/samples-general--localization
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' keys.
3. 'Microsoft Graph Toolkit Playground' Overview page will get displayed.
4. Navigate to 'Components' button using tab key and expand it.
5. Navigate to 'Samples' button using tab key and expand it.
6. Navigate to 'General' button using arrow key and expand it.
7. Navigate to 'Localization' link using arrow key and activate it.
8. Navigate to 'Select user' combo edit field using tab key.
9. Observe the issue with screen reader announcement.

Actual Result:
Lang attribute is not defined for the 'Select user', 'Select channel' combo edit fields. When the screen reader focuses on 'Select user' combo edit field It's not announcing anything.

Expected Result:
Lang attribute should be defined for the 'Select user', 'Select channel' combo edit fields which is presented in different language from the rest of the page. When focus lands on the combo edit fields, it should announce the control information.

Note:

1. Same issue is repro for 'sign out' button under 'User Profile flyout'(Navigation path: Samples>>General>>Localization>>Megan Bowen>>Sign out) (Note_1)
2. Same issue is repro with NVDA screen reader.

User Experience:
If the language of part is not defined for the content defined in the list, then the user who depends upon Screen Reader for navigation might get affected and hence fail to proper information of the control present on page.

WCAG Reference Link:
https://www.w3.org/WAI/WCAG21/Understanding/language-of-parts.html

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

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]

This is an example of how a developer can use the localization tools that the Toolkit exposes to change the provided text to match the page that they are using the components in.

The expectation is that the developer would ensure that the language they provide matches the lang attribute for the page used to host this content. These tools very deliberately don't know about the language in the content provided.

In the context of this example would you suggest that we wrap these controls with a div with the lang attribute expected?
The reality here is that the content coming from the Graph tenant that this is connected to is in English, so we're always going to have mixed language and not have a mechanism for splitting them. We operate on the assumption these will be used in a context where the localization content and tenant context provide a heterogeneous language environment for a given page.

[gavinbarron]

@vagpt or @KarunaNarang can you please provide guidance here?