Dropdown interaction issues

[mcarrano]

I found two issues when reviewing behavior of the Dropdown component:

(1) When the menu is open and the user clicks or touches the down arrow, dropdown toggle, or anywhere outside the menu, then the menu should close.

(2) When clicking a disabled menu item, nothing should happen. Currently the menu closes. This could mislead the user that an action has been taken when it has not.

[kmcfaul]

Re:

1. This looks like focus-trap-react is blocking the toggle, still looking into why and how to get around it.
2. This seems to happen because the onSelect event fires whenever the dropdown menu is clicked and not each dropdown item. Either the select method needs to have code to detect if the target has the disabled status, or I can pipe the onSelect event down to the dropdown item level so if the isDisabled status is set, no onSelect event will fire. Is there any preference on this? @mcarrano

[jgiardino]

@mcarrano Regarding (1), would your expectation be that clicking/touching anywhere outside the menu to dismiss the menu?

[mcarrano]

Yes, I think so. That's how the PF3 dropdown works (https://www.patternfly.org/pattern-library/widgets/#dropdowns). Do you agree @jgiardino ?

[jgiardino]

Yep, sounds good. I updated the description to capture that, and also include touch so that we remember to test both click and touch experiences.

[rachael-phillips]

Closing this issue