Narrator announces the ContextualMenu separator

[amitkumariiit]

Please provide a reproduction of the bug in a codepen:

Please check the developer site for the contextualMenu
https://developer.microsoft.com/en-us/fabric#/components/contextualmenu

Bug Report

Priorities and help requested:

Are you willing to submit a PR to fix? No

Requested priority: Low

Products/sites affected: (if applicable)

Describe the issue:

The separator of the contextual menu is announced separator by narrator. (on chrome browser)

Repro Steps:
-Open narrator
-Expand the dropdown of ContextualMenu (the first variant in which separator is there).
-Try to take the focus to the separator.

Please use the dev site for the repo-
https://developer.microsoft.com/en-us/fabric#/components/contextualmenu

Actual behavior:

Narrator reads the separator as separator

Expected behavior:

Narrator should not announce the unnecessary things in a page. As per aria-label standard also, we should not announce separator.

[KevinTCoughlin]

Thanks for the report @amitkumariiit. Do you think the above issue will be resolved if the following from issue #6360 is addressed:

Bug 9 : [Accessibility][Screen reader]: Narrator focus moves onto the separator line in scan mode.

It seems to me that the separator shouldn't receive focus at all. So if that is addressed the element should not be announced by Narrator.

[KevinTCoughlin]

Is there a better way to address this than the following?

1. Add aria-disabled to the divider
2. Add tabindex="-1" to the divider

[cliffkoh]

I cannot repro if I am not in scan mode, so this looks like a scan mode only issue.

[cliffkoh]

I'm going to close this as a duplicate of #6360.

[cliffkoh]

Adding this to Fabric shield since it seems like a pretty low-hanging fruit to add aria-hidden on the separator...

cc: @aneeshack4 @JasonGore @cschlechty

[amitkumariiit]

thanks @KevinTCoughlin for taking taking bug. I see that the fix is merged.

[msft-github-bot]

🎉This issue was addressed in #6876, which has now been successfully released as office-ui-fabric-react@v6.93.1.:tada:

Handy Links:

• Release Notes
• Official NPM Release
• Test the release with Developer Demo Site