Buggy mouse input event handling: Clicking toggle button opens left sidebar, but immediately thereafter closes it again

[porg]

Description

Reproduction

1. The left sidebar of the Site Editor is closed.
2. Move to the top left toggle button with the mouse (on a MacBook Pro trackpad in my case).
3. Click the toggle button

• ✅ The sidebar reveal animation (which btw is too slow) starts
• ❌ Subsequent bug: Immediately after the click the sidebar unexpectedly closes again. With a high likelyhood > 50%.
  • The cause to me seems to be unclean input event handling. See details below.

Step-by-step reproduction instructions

• During a short time frame after the click (max the first 250ms), if there is only slight mouse movement (only hover movement, no click or tap event, I'm 100% sure!) this triggers a close action.
• A few pixels of movement are enough to trigger this.
• This is very likely for two reasons: Because you move towards the toggle button, click,
  • and then might have some remaining micro momentum from moving there,
  • or are already some micro momentum for moving back into the working area again.
• And even no intentional movement at all can cause this!
  • Just lifting the finger (so no intentional movement at all!) may already causes 1-2px of movement getting registered on a high resolution, high sensitive trackpad.
  • This alone is enough to trigger the unexpected closing.

This happens on a MacBook Pro Magic Trackpad (with both the mechanical click and the tap-click active)

Screenshots, screen recording, code snippet

Click and lift finger

1a works

Click.and.lift.finger.1a.works.mp4

1b fails due to micro movement not even visible

Click.and.lift.finger.1b.fails.due.to.micro.movement.not.even.visible.mp4

1c fails due to minimal unintentional movement after click

Click.and.lift.finger.1c.fails.due.to.minimal.unintentional.movement.after.click.mp4

Click then deliberately jitter

2a triggered bug - Closed prematurely

Click.then.deliberately.jitter.2a.triggered.bug.-.Closed.prematurely.mp4

2b behaved OK - Micro moment came too late

Click.then.deliberately.jitter.2b.behaved.OK.-.Micro.moment.came.too.late.mp4

Environment info

• On the stable Wordpress releases, currently WP 6.1.1, I never ever experienced this!
• But with the Gutenberg plugin 15.3.1 I get this.

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

No

[porg]

Gutenberg plugin 15.4.0 → ✅ This bug is fixed!

• The update came just when I finished my long bug report.
• Nevertheless some acknowledgement what was the cause for this would be appreciated. Thanks!

[porg]

@glendaviesnz Can you tell what caused this? Was my analysis right (micro mouse hover events triggering this) ?

[glendaviesnz]

@glendaviesnz Can you tell what caused this? Was my analysis right (micro mouse hover events triggering this) ?

It seems like it was this PR that fixed it, it was related to routing issues rather than mouse clicks. Going to close this issue since this is resolved but this PR. Thanks for reporting this.

[porg]

I was dead sure this is input related. I could reproduce this. Tried all the different scenarios and managed to record them all on video.

Anyhow, it is gone now. So I don't mind. Should (seemingly) input related troubles regress later, I would report here.