Objects get stuck to cursor when control+clicking on MacOS

[rwshaw]

If you have questions about the API that aren't answered in the docs or FAQ, try asking in the Gitter chatroom or on Stackoverflow.

If you've found something that looks like a bug, include a link to a minimal demo on JSFilddle, Codepen with instructions to reproduce the bug with and roughly follow the following issue description format:

Expected behavior

When control+clicking an interact resizable or draggable in MacOS 12.0 the context menu should open. On clicking away from the context menu the context menu should close.

Actual behavior

When control+clicking an interact resizable or draggable in MacOS 12.0 the context menu opens, but when closing the context menu the interact object will stick to the cursor.

This bug can be replicated on the interact website, e.g. https://interactjs.io/docs/draggable/. Simply control+click the draggable then click away from the context menu. This problem is possibly caused by a MacOS firing both a contextmenu event and a mouse click/down event when control+clicking.

System configuration

interact.js version: 1.10.11 Browser name and version: Chrome 97 Operating System: macOS 12.0 (Monterey)

[ggreco]

I can confirm this happening also on macOS 10.15, it seems a general problem with the macOS "builtin" shortcut (enabled by default on all macs!) ctrl + left click to emulate the right click. This is because historically macs had a single button mouse....

[taye]

I think this should work to at prevent the context menu

interact(target).on('contextmenu', event => {
  event.originalEvent.preventDefault()
})