CODEWITHSUNDEEP
javascriptmacosgoogle-chrome
Guillaume Brunerie
Guillaume Brunerie

Reputation: 5371

Detecting middle button mouseup outside the window on Chrome / Mac OS

Binding the mouseup event to the window object usually triggers even if the mouse button was released outside the window (as long as it was pressed down inside the window). This is very helpful to get drag and drop (and similar) to cancel even though the mouse left the window.

window.addEventListener("mouseup", () => console.log("mouseup"));

But I’m having an issue where it does not trigger with the middle mouse button on Chrome (91) on Mac OS (Catalina).

Note that it works fine with the left mouse button, it works fine in Safari on the same computer (with the middle mouse button), and it works fine on Chrome on Windows.

Is this a bug in Chrome for Mac? Is there a workaround? I’m making an app where I need to pan using the middle mouse button, so I want to cancel it even if we release the button outside the window.

Upvotes: 1

Views: 235

Answers (1)

Guillaume Brunerie
Guillaume Brunerie

Reputation: 5371

I just found out that someone already reported it on the Chromium bug tracker two months ago, so it does seem to be a Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1206068

In order to work around it, I’m now simply checking e.buttons on the mousemove event, in order to cancel the dragging if the mouse comes back to the window without any button pressed. Not perfect but better than nothing.

Upvotes: 0

Related Questions