[menu-button] Cannot immediately click menu item in tests - 0.16.0 regression

[IanVS]

🐛 Bug report

Current Behavior

After updating @reach/menu-button to 0.16.1 in my app, a few tests started to fail. The menus still seem to work okay in manual testing, but I think it's because the tests are running faster than a human can click things.

I've found that I need to make two clicks to a menu item for it to take effect, or add about a half-second delay after opening the menu before clicking the item.

Expected behavior

Menu items should be possible to click as soon as the menu opens.

Reproducible example

https://codesandbox.io/s/reach-menu-button-0-16-cant-click-menuitem-in-test-v93z3?file=/src/__tests__/App.test.js

Note that the test fails, but uncommenting out the delay or the second click should cause the test to pass. If not, try refreshing the browser window, I've found that codesandbox tests can be kind of flakey.

Also, if you change the version of @reach/menu-button to 0.15.3, and reload the page, the test should start to pass without the delay or double-click.

Suggested solution(s)

I think maybe something changed so that the menu items aren't ready for clicks right away?

Additional context

Your environment

Software	Name(s)	Version
Reach Package	menu-button	0.16.0
React		17.0.3
Browser	n/a
Assistive tech	n/a
Node	n/a
npm/yarn	npm
Operating System	mac

[jbanulso]

Experiencing the same issue here. I can work around it exactly as @IanVS describes: by using userEvent.dblClick() instead of a single click, or by introducing an artificial timeout like await new Promise(resolve => setTimeout(resolve, 500));. It feels kinda hacky though...

[stephenwade]

Seems to be intentional behavior. It was changed in 4e7fc92.

For more information, see the discussion in #563.

[IanVS]

@chaance is this indeed working as intended? I think it's pretty confusing behavior when writing tests, and it took me a while just to figure out why my tests were failing. It seems that this could be mentioned in the changelog, or even the docs site, as a testing tip until/unless some kind of heuristics can be used to determine whether or not the component is running in a testing environment.

[IanVS]

As far as I know this is still an open issue.

[jasikpark]

Still seems to be an issue as of July 7th

[MattThomp]

Still an issue for me as of Nov 23. Using the dblClick workaround for now.