fix(a11y): announce when no matches are found in people-picker

[Mnickii]

Closes #3117

PR Type

Bugfix

Description of the changes

PR checklist

• Project builds (yarn build) and changes have been tested in at least two supported browsers (Edge + non-Chromium based browser)
• All public APIs (classes, methods, etc) have been documented following the jsdoc syntax
• Stories have been added and existing stories have been tested
• Added appropriate documentation. Docs PR:

• License header has been added to all new source files (yarn setLicense)
• Contains NO breaking changes

Other information

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[Mnickii]

@Raisul123 @vagpt please confirm that this fixes the narration issue

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[gavinbarron]

This is fine. In future we should look to see if we can capture the loading, no results, and results list under a single aria-live parent by refactoring the HTML that we emit.

[vagpt]

This issue is still repro at oue end.

URL: https://mgt.dev/next/pr/3180/?path=/docs/components-mgt-people-picker--docs

MGTP-.issue.is.repro.mp4

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[vagpt]

This issue is still repro on the URL below. Please find the attachment below.

URL - https://mgt.dev/next/pr/3180/?path=/docs/components-mgt-people-picker--docs

Attachment:

SR.is.still.not.announcing.the.message.mp4

[github-actions]

📖 The updated storybook is available here

[Mnickii]

@Raisul123 @vagpt see below, it does announce when no matches are found.

2024-05-29-13-00-01.mp4

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[vagpt]

Hi @Mnickii
This issue is partially fixed as of now Screen reader is announcing the message when there is no data but as mention in Actual and Expected result when user type any character than it should also announce the information about the same.

Attaching the video for the reference.

MGTP-.issue.is.partially.fixed.mp4

[Mnickii]

@vagpt , as the issue around mentioning the Actual and Expected results when user types any character is related to #3118, please include there.

[github-actions]

📖 The updated storybook is available here

[Raisul123]

Hi @Mnickii @gavinbarron, As discussed on MGTP group chat tracking "The Actual and Expected results when user types any character" related issue with Bug #3118 .

Closing the issue #3117 as Currently screen reader is announcing the information “We dint fined any suggestion” shown when navigating to the 'Search for a Name' edit field.

CC: @vagpt

[github-actions]

📖 The updated storybook is available here

[github-actions]

📖 The updated storybook is available here

[github-actions]

Package	Line Rate	Branch Rate	Complexity	Health
mgt-components.src.components	86%	75%	0	✔
mgt-components.src.components.mgt-contact	68%	83%	0	➖
mgt-components.src.components.mgt-file	62%	100%	0	➖
mgt-components.src.components.mgt-file-list	46%	100%	0	❌
mgt-components.src.components.mgt-file-list.mgt-file-upload	49%	86%	0	❌
mgt-components.src.components.mgt-get	22%	100%	0	❌
mgt-components.src.components.mgt-messages	68%	100%	0	➖
mgt-components.src.components.mgt-organization	47%	100%	0	❌
mgt-components.src.components.mgt-person	82%	100%	0	✔
mgt-components.src.components.mgt-person-card	77%	49%	0	✔
mgt-components.src.components.mgt-picker	80%	100%	0	✔
mgt-components.src.components.mgt-profile	40%	100%	0	❌
mgt-components.src.components.mgt-tasks-base	87%	100%	0	✔
mgt-components.src.components.mgt-theme-toggle	100%	100%	0	✔
mgt-components.src.components.mgt-todo	79%	100%	0	✔
mgt-components.src.components.sub-components.mgt-flyout	78%	53%	0	✔
mgt-components.src.components.sub-components.mgt-spinner	100%	100%	0	✔
mgt-components.src.graph	38%	78%	0	❌
mgt-components.src.styles	92%	80%	0	✔
mgt-components.src.utils	79%	27%	0	✔
mgt-element.dist.es6.components.src.components	72%	73%	0	➖
mgt-element.dist.es6.mock.src.mock	91%	73%	0	✔
mgt-element.dist.es6.providers.src.providers	85%	76%	0	✔
mgt-element.dist.es6.src	91%	80%	0	✔
mgt-element.dist.es6.utils.src.utils	68%	71%	0	➖
mgt-element.src	93%	40%	0	✔
mgt-element.src.components	78%	100%	0	✔
mgt-element.src.mock	81%	56%	0	✔
mgt-element.src.providers	84%	100%	0	✔
mgt-element.src.utils	72%	91%	0	➖
Summary	67% (14557 / 21577)	74% (519 / 699)	0	➖