auxclick event in FireFox or Pale Moon

Post information about bugs here

auxclick event in FireFox or Pale Moon

Postby astewart » Wed Aug 30, 2017 11:57 pm

Pale Moon recently introduced a new auxclick event which fires on non-primary buttons - mid and right clicks, in addition to the click event. I don't run FireFox, but I read that it has had auxclick since v53.

If I have a button that uses the CustomButtons API click handler, and has a function other than default for rightclick
Code: Select all
this.rightclick = function(event) { alert("  rightclick"); };
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");

the auxclick event occurs first and is not handled here, so it opens the contextmenu by default, and then the click event shows the alert, which closes the menu. My solution has been to add a "duplicate" handler to "suppress" the auxclick
Code: Select all
this.rightclick = function(event) { alert("  rightclick"); };
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.setAttribute("onauxclick", "custombuttons.gQuot.mHandler(event, this)");

This is easy, but doesn't feel right. Is anyone having this problem with FireFox, or is the Pale Moon auxclick implemenation different?

Alan
astewart
 
Posts: 9
Joined: Sat Apr 11, 2015 5:04 pm

Re: auxclick event in FireFox or Pale Moon

Postby morat » Thu Aug 31, 2017 12:19 am

Is a click event triggered for a right click? If so, then the cb api should work correctly.

lithopsian wrote:For now, auxclick is an additional event sent along with the click event when the non-primary button is used.

Implement auxclick
http://forums.mozillazine.org/viewtopic ... &t=3026069
morat
 
Posts: 946
Joined: Wed Dec 28, 2011 2:38 pm

Re: auxclick event in FireFox or Pale Moon

Postby astewart » Thu Aug 31, 2017 1:38 am

morat wrote:Is a click event triggered for a right click? If so, then the cb api should work correctly.

lithopsian wrote:For now, auxclick is an additional event sent along with the click event when the non-primary button is used.

Yes, the click event occurs and my rightclick function correctly executes, but as lithposian says, auxclick is also sent. In PM, that is prior to the click event. Without adding the onauxclick attribute, auxclick invokes the contextmenu by default. Then, in my example, the alert box closes the contextmenu by getting focus.

Edit: It was your response to lithopsian that mentioned adding an event listener for auxclick that I had seen earlier, but I was trying to do something in the button definition, rather than debugging the cb extension.

Is this problem not happening in FF with the latest CB?

Alan
astewart
 
Posts: 9
Joined: Sat Apr 11, 2015 5:04 pm

Re: auxclick event in FireFox or Pale Moon

Postby morat » Thu Aug 31, 2017 2:48 am

Yeah. That fixes the contextmenu problem when I test.

Code: Select all
/*Initialization code*/
// shift right click to show popup
this. leftclick = function(event) { alert(" leftclick"); }
this.  midclick = function(event) { alert("  midclick"); }
this.rightclick = function(event) { alert("rightclick"); }
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.setAttribute("onauxclick", "custombuttons.gQuot.mHandler(event, this)");

I don't know if the onauxclick workaround is a proper solution. There are no errors in the browser console.

Custom Buttons 50.0.2 (srazzano's version)
Firefox 55.0.3
Windows 7 SP1 32-bit
morat
 
Posts: 946
Joined: Wed Dec 28, 2011 2:38 pm

Re: auxclick event in FireFox or Pale Moon

Postby astewart » Thu Aug 31, 2017 3:47 am

I picked that method because it was an easy replacement across many of my buttons, but also because the mozilla discussion says that eventually the auxclick event on rightclick will replace the click event on rightclick, rather than duplicate it. If that happens, it might be desirable to separately call the cb api.

Right now, the api just checks for shift+rightclick, then
Code: Select all
evt.preventDefault();

and falls through for an auxclick event.

I tried
Code: Select all
this.setAttribute("onauxclick", "event.preventDefault");

in the button definition, but that prevented detection of shift+rightclick. I don't know why the click event doesn't pick it up.

Alan
astewart
 
Posts: 9
Joined: Sat Apr 11, 2015 5:04 pm

Re: auxclick event in FireFox or Pale Moon

Postby morat » Fri Sep 01, 2017 4:57 am

I got it working with an auxclick event listener.

Code: Select all
/*Initialization code*/
// shift right click to show popup
this. leftclick = function(event) { alert(" leftclick"); }
this.  midclick = function(event) { alert("  midclick"); }
this.rightclick = function(event) { alert("rightclick"); }
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.addEventListener("auxclick", function(event) {
  if (event.button == 2 && event.shiftKey == false) {
    event.preventDefault();
    event.stopPropagation();
    event.stopImmediatePropagation();
  }
}, false);

I got it working with a contextmenu event listener.

Code: Select all
/*Initialization code*/
// shift right click to show popup
this. leftclick = function(event) { alert(" leftclick"); }
this.  midclick = function(event) { alert("  midclick"); }
this.rightclick = function(event) { alert("rightclick"); }
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.addEventListener("contextmenu", function(event) {
  if (event.button == 2 && event.shiftKey == false) {
    event.preventDefault();
    event.stopPropagation();
    event.stopImmediatePropagation();
  }
}, false);
morat
 
Posts: 946
Joined: Wed Dec 28, 2011 2:38 pm

Re: auxclick event in FireFox or Pale Moon

Postby astewart » Fri Sep 01, 2017 6:32 am

morat wrote:I got it working with an auxclick event listener.

Code: Select all
/*Initialization code*/
// shift right click to show popup
this. leftclick = function(event) { alert(" leftclick"); }
this.  midclick = function(event) { alert("  midclick"); }
this.rightclick = function(event) { alert("rightclick"); }
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.addEventListener("auxclick", function(event) {
  if (event.button == 2 && event.shiftKey == false) {
    event.preventDefault();
    event.stopPropagation();
    event.stopImmediatePropagation();
  }
}, false);



It also works for me without
Code: Select all
    event.stopPropagation();
    event.stopImmediatePropagation();


I had done this style before
Code: Select all
/*Initialization code*/
// shift right click to show popup
this. leftclick = function(event) { alert(" leftclick"); }
this.  midclick = function(event) { alert("  midclick"); }
this.rightclick = function(event) { alert("rightclick"); }
this.setAttribute("onclick", "custombuttons.gQuot.mHandler(event, this)");
this.setAttribute("onauxclick", "this.auxhandler(event)");
this.auxhandler =  function(event) { if (event.button == 2 && event.shiftKey == false) { event.preventDefault(); } }

without the conditional button check. But that's similar to the code that custombuttons.gQuot.mHandler does internally.

The conditional would seem to prevent auxclick from acting on an unshifted rightclick. What I don't understand is, if you remove the button check, the rightclick works without a contextmenu, but the shift+rightclick doesn't do anything?!?

Anyway, if your listener code were put inside the api, perhaps we can do away with a workaround in the buttons.

I'm surprised that no one has complained about this before. I know other problems have been mentioned with recent FF versions and old buttons, but v53 has been out for some time and some buttons must have rightclick functions defined. Maybe the ones that do use other click handler code than custombuttons.gQuot.mHandler?

Alan
astewart
 
Posts: 9
Joined: Sat Apr 11, 2015 5:04 pm

Re: auxclick event in FireFox or Pale Moon

Postby astewart » Mon Sep 04, 2017 10:28 pm

My next shot at avoiding a workaround in each button separately
Code: Select all
window.addEventListener("auxclick", function(event) {
 if (event.button == 2 && event.shiftKey == false && event.target.id.match(/^custombuttons-button/) && event.target.onclick) {
   event.preventDefault();
 }
}, false);

This blocks "auxclick" for all buttons, only if an "onclick" handler is set. It works if placed in the init section of any one button, or if inserted in cb2api.js just before the definition of mHandler
Code: Select all
window.addEventListener("auxclick", function(event) {
 if (event.button == 2 && event.shiftKey == false && event.target.id.match(/^custombuttons-button/) && event.target.onclick) {
   event.preventDefault();
 }
}, false);

custombuttons.gQuot = { //{{
. . .

If a button has no "onclick" handler, preventDefault would block the normal contextmenu. I don't know if that's a sufficient check for buttons that include their own click handler code.

Alan
astewart
 
Posts: 9
Joined: Sat Apr 11, 2015 5:04 pm


Return to Bug report