How do I get the mouse button pressed from a command event in XUL?

Question

It seems that the XUL command and click events are somewhat different.

Although my function does get called when using the command event, the event object does not contain the button property.

My question is: how do I detect what mouse button that was pressed without using the click event?

The simplest code that can demonstrate my problem:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="yourwindow" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
<script language="JavaScript">
    var showMeTheButton=function(e)
    {
        alert(e.button);
    }
</script>
<button onclick="showMeTheButton(event)" label="Click me with onclick"></button>
<button oncommand="showMeTheButton(event)" label="Click me with oncommand"></button>
</window>

Answer 1

The main thing to keep in mind is that oncommand is fired for any action that results in an activation of the button which can include pressing the space bar when the button has the focus, using a keyboard shortcut attached to the button, or clicking the button with the mouse. The event handler is not really supposed to care how it was called, only that it was. (I imagine this was a conscious decision to keep a consistent user interface.)

The only actions that result in the button property being added to the Event object are onclick, ondblclick, onmousedown, and onmouseup. You'll note that even if you disable your onclick button, the event still fires whereas with oncommand it won't.

To get the same functionality as oncommand, you'd need to handle both onclick and onkeydown events yourself while making sure the button is still enabled. You also might be able to create a custom button using XBL which have custom events like onleftclick or onmiddleclick that then fall back to oncommand if they are not set--but I've not tried it.