[MGTP-Samples-General-Localization-Select a task list-Add a task]: Keyboard Focus loss is observed when user closes 'Task item' by activating 'Close' button using enter/spacebar key.

[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: Components / mgt-agenda / Properties - Preferred Timezone ⋅ Storybook
User ID: V-id

Prerequisites:

1. Navigate using keyboard only.

Repro Steps:

1. Open the above URL and login with valid credentials.
2. 'Microsoft Graph Toolkit Playground' Overview page will get displayed.
3. Navigate to the 'Components' button using tab key and expand it.
4. Navigate to 'Samples' button using tab key and expand it.
5. Navigate to 'General' button using arrow key and expand it.
6. Navigate to 'Localization' link using arrow key and activate it.
7. Navigate to 'Select a task list' combo edit field and select 'Task' item from the list.
8. Navigate to 'Add a task' text field using tab key and type any task name.
9. Navigate to the 'Close' button using tab key and activate using enter/spacebar key.
10. Observe where keyboard focus lands.

Actual Result:
Keyboard focus is lost when the user activates the 'Close' button to remove task item using enter/spacebar key.
When the user presses tab, focus lands on the 'Color mode' switch button.

Expected Result:
Keyboard focus should land/retain on 'Add a task' text field when user activates 'Close' button to remove task item.

Note:
This issue is reproducing for all 'Close' buttons present beside 'Add a task' text field throughout application.

Observations:
Focus land on same controls when user press shift tab key after activating Close button using enter/space key.

User Experience:
Keyboard users need to tab unnecessarily on the page whenever user activates 'Close button using enter key Hence the user needs to renavigate back to that text field by pressing tab key several times.

WCAG Reference:
https://www.w3.org/WAI/WCAG21/quickref/?currentsidebar=%23col_overview#focus-order

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

WCAG2.4.3-.Keyboard.focus.is.lost.when.the.user.activates.Close.button.to.remove.task.item.using.enter.spacebar.key.mp4

[ghost]

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 🙌

[vagpt]

Hi @gavinbarron,

Could you please let us know the ETA to fix this issue as of now issue is still repro?

[sebastienlevert]

A lot of improvements are currently in flight for this component (To Do). On https://mgt.dev/next this still reproes though.

[vagpt]

This issue is working fine on the environment below, hence closing this issue. Attachment is added for the reference.

Test Environment:
OS Build: Windows 11
Version: 23H2 (OS Build 26040.1000)
Browser: Edge dev
Browser Version 122.0.2386.3 (Official build) dev (64-bit)
URL: https://mgt.dev/next/pr/3005/?path=/story/samples-general--localization
User ID: V-id

Issue.is.fixed.on.MGTP.mp4