shell: First selection is focused, even when there's an embedded widget

[garrett]

In the shell's session menu, the menu item is focused instead of the first widget, causing a hover-like selection.

It's point # 1 from #20340, which wasn't fixed. (Point # 2 was addressed with a workaround to not crop items inside the menu items, and we closed the issue based on that, even though it was just half-solved at the time.)

It turns out that PatternFly changed things to pre-focus the first item regardless, and as PatternFly-React nests widgets in menus inside the text part of the menu item element. (This was done as an intended accessibility fix, but had some side effects for anyone using non-text content inside of menus in PatternFly-React.)

Details @:

• Bug - Menus (dropdown, menutoggle, etc.) - first menu item in a dropdown has a highlight by default (and it shouldn't) patternfly/patternfly-react#10393 (comment)

We're not the only ones having an issue based on this change.

@thatblindgeye also mentioned in a direct message in Slack that we could file an issue (if one doesn't exist) about adding initial focus being an option. He then suggests considering taking inspiration from the custom inline search menu example and "replacing the search input with your toggle group, then running a setTimeout inside the MenuToggle's onClick handler to focus whatever element when the menu is open, to pseudo-override the first menu item being focused".

[garrett]

This is now fixed in PatternFly 6, and PatternFly 5.

• PF6: fix(Select/Dropdown): updated autofocus to false by default in v6 patternfly/patternfly-react#11115
• PF5: fix(Select/Dropdown): updated autofocus to false by default in v5 patternfly/patternfly-react#11114

We'll need to upgrade to the next version of PF5 (with this fix) to get this addressed across Cockpit.