Fabric Panel focus order is improper with choice group in the panel

[AkshanshSrivastava03]

Bug Report

• Package version(s): 5.55.1002
• Browser and OS versions: Chrome

Describe the issue:

Panel focus order is improper when choice group is rendered within the Panel.

Actual behavior:

Suppose you have choice group with options "a" and "b" in the panel.

The focus first goes to cross button of the panel, then the choice group option "a", then tabbing will make you focus the page title/window etc.

If you select option "b" my moving key down, then the focus will remain inside the Panel which is the expected behavior. But by default, as "a" is selected, the focus goes out of the Panel

Expected behavior:

Focus order should remain inside the panel ony

If applicable, please provide a codepen repro:

https://codepen.io/AkshanshSrivastava03/pen/mXZpwp

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions to Fabric React!

[KevinTCoughlin]

@AkshanshSrivastava03 is this still an issue? In testing this today, focus order seems to be:

["a", "b", "X (close cross)"]

https://s.codepen.io/AkshanshSrivastava03/debug/mXZpwp/DqADdEOJEXwA

Once a choice group item is selected UP/DOWN is required to toggle the selection similar to a standard radio group.

[KevinTCoughlin]

@AkshanshSrivastava03, I'm going to close as this seems to not be an issue (provided an example). Please re-open if I misunderstood so that we can address properly. Thanks for using the library and for your feedback :).

[AkshanshSrivastava03]

@KevinTCoughlin The code pen which you have attached has the repro. After radio button focus, tab should take me to the close button of the panel and not to the address bar.
Get the focus on radion button "a", then press tab the focus goes to address bar (which is incorrect behavior). If you select "b", then the focus remains to move inside panel only (which is correct behavior).

I think the bug needs to re-open.

[SumiranAgg]

+1 We are also facing the same issue.

[msft-github-bot]

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

Handy links:

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