[Enhancement] Support for all available mouse buttons


#1

As far as I’m aware, in Electron there is no way to detect click events where mouse button pressed is not left, right or middle button.
In my opinion events such as document.onClick should fire if any mouse button is clicked.

Can something be done about this?


#2

It’s not really an electron thing, but a JS thing. You might want to google for Javascript capture middle mouse or similar queries.


#3

You’re that right that JS api does exists but as of now it has limited functionality in browsers. What I’m asking about is that Electron would extend on that by handling all native mouse click events and forwarding them to JS code using the already defined way.


#4

What do you mean by limited functionality? Please do explain.

Edit: Also what do you mean by the already defined way? Electron was built upon CSS and JS, and there’s only one approach to events natively, and because that’s the only way to use native events, I don’t see what you mean by that.

var Container = document.getElementById("container");
Container.addEventListener('click', function(event){
  if(e.which !== 2) return ;
  e.preventDefault();
  alert("middle button pressed"); 
});

The above code works fine in every single browser I know (latest versions).
Edit #2: Using document.onClick won’t work, the correct one is document.onclick. and It’s DOM-1-styled events and are strongly discouraged.


#5

Some mouse models have only two buttons while specialized ones may have over ten buttons (MMO mouse
for example.)
My mouse has two extra buttons on the side (often referred as MouseButton4 & MouseButton5) but when I press either of them, no event is emitted.
As I mentioned above all different click related events handle only the three main buttons. I actually use addEventListener in my code. document.onclick was just simplest example I came from the top of my head.


#6

Those extra buttons are non-standard. You might want to try a listener of keydown and if that works, filter using e.which. and If it doesn’t work, then don’t regret it, that’s what happens to non-standard stuff. Also if you listen for the 3rd and 4th button, how will people with 2 mouse buttons use it?
I love the standards, they are made for a reason.


#7

You might want to try a listener of keydown and if that works

KeyboardEvent !== MouseEvent.

that’s what happens to non-standard stuff

This is one of the areas I’ve found that is still behind on what’s available to native apps. Closest thing I’ve found is MouseEvent.buttons but that only tells which buttons are pressed when one of the three main buttons is pressed.

if you listen for the 3rd and 4th button, how will people with 2 mouse buttons use it?

They don’t. The most common use case is to use the extra buttons as replacements for keyboard shortcuts. It’s all just an additional way to do things.

Mostly I’m just wondering whether this will be supported in Electron or do I have to do some cowboy coding to attach my own event listener to the native window when I’ve the time.