palantir / blueprint

A React-based UI toolkit for the web
https://blueprintjs.com/
Apache License 2.0
20.75k stars 2.18k forks source link

ContextMenuPopover browser context menu occasionally appears #6469

Open bdenhollander opened 1 year ago

bdenhollander commented 1 year ago

Environment

Code Sandbox

https://blueprintjs.com/docs/#core/components/context-menu-popover.imperative-api

Steps to reproduce

This issue was previously reported as #6005. That was closed as resolved but the problem is still occurring. It's difficult to get it to happen in the documentation site but in a project that uses Blueprint.js it can be 1 in 3 right clicks will display the browser context menu.

The following code will log <div class="bp5-overlay-backdrop bp5-popover-backdrop bp5-context-menu-backdrop bp5-popover-appear-done bp5-popover-enter-done"></div> on a right click that triggers the browser context menu.

window.addEventListener('contextmenu', (e) => { console.log(e.target); });

Actual behavior

Recording-20231017_104614.webm

Expected behavior

Browser context menu is suppressed successfully. Repeating the same steps on ContextMenu does not show the browser's context menu.

Possible solution

There may be a short moment in time that the right click is propagated to the newly added overlay, before the overlay has its event set up to close the new ContextPopoverMenu on right click.

  1. Right click launches ContextMenu2 and calls preventDefault()
  2. Overlay is added quickly
  3. Right click propagates to overlay
  4. Right click menu appears <-- Problem might be here
  5. Overlay adds event to dismiss itself on any click event
bdenhollander commented 7 months ago

Returned to check if any progress had been made on this issue and noticed that it was unintentionally closed via commit message. I checked the latest doc site and can still reproduce the issue.