patternfly-react icon indicating copy to clipboard operation
patternfly-react copied to clipboard

Application Launcher breaks when fragments or wrappers used

Open jessiehuff opened this issue 5 years ago • 1 comments

Describe the issue. What is the expected and unexpected behavior? Due to the fact the Dropdown keyboard interaction is handled based on their implicit index (being array children), wrapping dropdown elements in react fragments or other elements breaks the keyboard navigation. If the child is wrapped in a fragment, its implicit index is -1. If it's not wrapped, it will get the proper index based on its position in the array. We should make index a real prop on the ApplicationLauncherItem and give sequential keyboard access to increment the index by 1.

Please provide the steps to reproduce. Feel free to link CodeSandbox or another tool. Try to wrap any element in the dropdown with a react fragment, and you will notice that none of the keyboard interactions work anymore.

Is this a bug or enhancement? If this issue is a bug, is this issue blocking you or is there a work-around? Bug - workaround is to either remove the react fragment/wrapper or to add an index that overrides the implicit index

What is your product and what release version are you targeting? First noticed in OpenShift.

jessiehuff avatar Feb 24 '21 19:02 jessiehuff

Part of the epic: https://github.com/patternfly/patternfly-react/issues/6014

nicolethoen avatar Jan 05 '22 15:01 nicolethoen

It sounds like this is no longer an issue with the new recommended solution for Application Launcher. :)

jessiehuff avatar Oct 18 '23 18:10 jessiehuff