Menu-bar pop-up menu-things only hide on blur, not on click

[JJJ]

Describe the bug
When clicking the buttons in the top menu-bar thing that have drop-downs (vertical ellipsis, block navigator, or content structure) clicking them makes a pop-up pointer thing appear, but there is no visual indication on how to make them disappear.

Clicking them again does not hide them. Hovering off of them makes them go flat, giving the appearance that the button is unaware that the menu exists.

To Reproduce
Steps to reproduce the behavior:

1. Go to 'Add New Post'
2. Click on 'circle with an "I" in it' icon
3. A pop-up menu pointer thing appears
4. Clicking the pop-up menu pointer thing does not hide the thing
5. Clicking the 'circle with an "I" in it' button does not hide the pop-up menu pointer thing
6. These menu-buttons lack a "pressed-down" state or styling in WordPress 5.0 beta 3.

Expected behavior
These look like menus, have drop-down pop-up menu box things, so they should work similarly.

1. Clicking on a menu button should invoke a "pressed-down" state & styling
2. Re-clicking the menu button should hide the menu and restore the button state

Screenshots

Desktop (please complete the following information):

• OS: macOS
• Browser All
• Version: Any

Additional context

• WordPress 5.0 Beta 3

[designsimply]

Testing note: need to check this against the plugin to see if it happens here as well as with WP 5.0 beta.

[desrosj]

Confirming that this also happens in 4.9.x with Gutenberg 4.2 active.

[afercia]

Quickly testing the plugin version 4.2.0 the buttons don't have a "pressed" style but clicking again on them does close the popups. Instead, on current Gutenberg master 26ccc15 clicking on the buttons again does nothing. Seems to be a regression in master?

[afercia]

Same happens on the "More" button in the top bar: it is now impossible to close the menu clicking again on the button. Adding the label "regression".

[afercia]

Reverting 58725c4 fixes it for me. /Cc @aduth

[aduth]

As best I can tell, this issue includes two actionable tasks:

---

• "1. Clicking on a menu button should invoke a "pressed-down" state & styling"

This was a known compromise in transitioning focus to the modal to preserve tab order. It's not strictly unavoidable, but the technical implementation has proven challenging enough that it's been not likely to change anytime soon. See previously: #5595

---

• "2. Re-clicking the menu button should hide the menu and restore the button state"

This does appear to be a regression. I'll plan to tackle it today, including an end-to-end test to avoid similar future regressions.

Edit: Fixed by #11633

[aduth]

Pull request fixing toggle behavior at #11633

[mtias]

Main issue for 5.0 has been handled, the ability to have pressed state without focus should be discussed further in future versions.

[mtias]

Closing and moving the "pressed state" issue here: #6177

[aduth]

I assume that's meant to be #11937