Bug: select-dropdown remains in an undetermined state when used through keyboard

[brunoscopelliti]

When you try to interact with the select-dropdown via keyboard, the UI does not update accordingly.

Steps to reproduce

1. Starting at URL: http://calypso.localhost:3000/stats/insights/$your_site_here
   or in the components gallery http://calypso.localhost:3000/devdocs/design/select-dropdown
2. Press the tab key until the dropdown gets focused.
3. Use the tab key to navigate through the options.
4. To select an option is necessary to press enter, navigate through the options with the arrows key (up/down) and press enter again.

What I expected

I expected that the UI of the dropdown, and of the view changes accordingly to the new selected option.

What happened instead

The view is updated on the basis of the new selected value.
The dropdown remains in an undetermined state.

Browser / OS version

I just tested with Chrome, and Safari on iOS Sierra.
I don't expect this to be dependent on browser version though.

Screenshot / Video

The first sequence shows me interacting with the dropdown using the mouse... and thereafter through keyboard.

Context / Source

I found this issue while I was working on #9150; it's not the most dreadful of the bugs, however it would be nice to make the dropdown responds in the same way it does when used through the mouse.

Probably it would be better to wait that #9150 is merged before working on this, because it introduces a few unit tests which may come to be in handy.

[brunoscopelliti]

It seems that this is due to the fact the dropdown items have the tabindex attribute set, even when the dropdown is closed.

That’s overriding this check

navigateItemByTabKey( event ) {
  if ( ! this.state.isOpen ) {
    return;
  }
  ...
}

so it seems effectively an undesired behaviour.

I think this could be easily fixed if we pass to DropdownItem the isOpen state property as a prop; and then set/remove the tabindex accordingly to it.

Do you see any flaw in this proposed solution?
Does someone else want to take on this?

[brunoscopelliti]

I've just opened a pull request for this (#9291).
Any feedback is appreciated!

[stale]

This issue has been marked as stale because it hasn't been updated in a while. It will be closed in a week.
If you would like it to remain open, can you please you comment below and see what you can do to get things moving with this issue?
Thanks! 🙏