IE 11 delegate vs direct radio click handlers behave differently #2343

Closed
baronworks opened this Issue May 22, 2015 · 4 comments

Comments

Projects
None yet
3 participants
@baronworks

With IE 11 found a case where click handler on a radio input behaves differently when delegated vs directly-bound.

// delegated click handler, works when clicked but not when using arrows.
$('#testform').on('click', '.radios', function( e ) {
     console.log('delegated click handler', $(this).val() );
});
//directly-bound click handler, always works even when using arrows
$('.radios').on('click', function( e ) {
    console.log('direct click handler', $(this).val() );
});

jquery version: 1.11.* and 2.1.3, most testing done with 1.11.3
works in browsers: Firefox: 38.0.1, IE 9 & 10, Opera 27.0.1689.66, Chrome 42.0.2311.15
does not work in: IE 11 Version: 11.0.9600.17801
OS: Windows 7 64-bit

Created a jsfiddle using jquery 1.11.0 at http://jsfiddle.net/damnmaudite/kt99moLf/24/
Note when actually clicking the radio option everything works, but when using arrows to select a value in IE-11 the delegated event is not triggered..

@dmethvin dmethvin added the Event label May 22, 2015

@dmethvin dmethvin added this to the 3.0.0 milestone May 22, 2015

@dmethvin

This comment has been minimized.

Show comment
Hide comment
@dmethvin

dmethvin May 22, 2015

Member

This arises from a combination of browser bugs and lies. We have some code to guard against a problem in Firefox regarding delegated right-click events that bubble as if they are click; TBH I am not sure Firefox still has this problem.

But to make it worse, when you use the arrow keys in this example in Firefox and Chrome the event says the left mouse button was clicked which is a lie. In IE it says no button was clicked (-1) which is true, but that triggers our Firefox bug check. I think we can fix this by changing !event.button to event.button <= 1. Or perhaps this guard can be removed completely if Firefox fixed the bug long ago.

BTW, I can't find where any standard defines what happens with the arrow keys on a radio button group.

Member

dmethvin commented May 22, 2015

This arises from a combination of browser bugs and lies. We have some code to guard against a problem in Firefox regarding delegated right-click events that bubble as if they are click; TBH I am not sure Firefox still has this problem.

But to make it worse, when you use the arrow keys in this example in Firefox and Chrome the event says the left mouse button was clicked which is a lie. In IE it says no button was clicked (-1) which is true, but that triggers our Firefox bug check. I think we can fix this by changing !event.button to event.button <= 1. Or perhaps this guard can be removed completely if Firefox fixed the bug long ago.

BTW, I can't find where any standard defines what happens with the arrow keys on a radio button group.

@baronworks

This comment has been minimized.

Show comment
Hide comment
@baronworks

baronworks May 25, 2015

Thanks for the quick response. Played with the code using event.button <= 1, and everything appears to work as expected. Will create a local patch for our purposes that overrides jQuery.event.handlers helper method until this is added to the 3.0 milestone.

Thanks for the quick response. Played with the code using event.button <= 1, and everything appears to work as expected. Will create a local patch for our purposes that overrides jQuery.event.handlers helper method until this is added to the 3.0 milestone.

@dmethvin dmethvin self-assigned this Sep 25, 2015

@dmethvin

This comment has been minimized.

Show comment
Hide comment
@dmethvin

dmethvin Sep 25, 2015

Member

It appears that Firefox hasn't fixed this bug, which is 14 years old. So we should take the conservative approach and leave our guard in place, just modifying the event.button check.

EDIT: I reproduced on Firefox 42, http://jsbin.com/vejahobise/edit?html,js,console,output

Member

dmethvin commented Sep 25, 2015

It appears that Firefox hasn't fixed this bug, which is 14 years old. So we should take the conservative approach and leave our guard in place, just modifying the event.button check.

EDIT: I reproduced on Firefox 42, http://jsbin.com/vejahobise/edit?html,js,console,output

@mgol

This comment has been minimized.

Show comment
Hide comment
Member

mgol commented Sep 27, 2015

@dmethvin I marked the issue you mentioned as one blocking our jQuery meta-issue.

dmethvin added a commit that referenced this issue Sep 28, 2015

dmethvin added a commit that referenced this issue Sep 28, 2015

@dmethvin dmethvin closed this in c82a668 Oct 18, 2015

dmethvin added a commit that referenced this issue Oct 25, 2015

@dmethvin dmethvin modified the milestones: 1.12/2.2, 3.0.0 Jan 7, 2016

@cssmagic cssmagic referenced this issue in cssmagic/ChangeLog May 18, 2016

Open

jQuery #5

@jquery jquery locked as resolved and limited conversation to collaborators Jun 19, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.