Events: don't execute native stop(Immediate)Propagation from simulation

In Firefox, called `stop(Immediate)Propagation` methods,
in capturing phase prevents receiving focus

Fixes gh-3111
This commit is contained in:
Oleg Gaidarenko 2016-05-19 21:56:39 +04:00
parent 69db408d82
commit 94efb79929
3 changed files with 95 additions and 27 deletions

View File

@ -558,13 +558,14 @@ jQuery.Event.prototype = {
isDefaultPrevented: returnFalse,
isPropagationStopped: returnFalse,
isImmediatePropagationStopped: returnFalse,
isSimulated: false,
preventDefault: function() {
var e = this.originalEvent;
this.isDefaultPrevented = returnTrue;
if ( e ) {
if ( e && !this.isSimulated ) {
e.preventDefault();
}
},
@ -573,7 +574,7 @@ jQuery.Event.prototype = {
this.isPropagationStopped = returnTrue;
if ( e ) {
if ( e && !this.isSimulated ) {
e.stopPropagation();
}
},
@ -582,7 +583,7 @@ jQuery.Event.prototype = {
this.isImmediatePropagationStopped = returnTrue;
if ( e ) {
if ( e && !this.isSimulated ) {
e.stopImmediatePropagation();
}

View File

@ -150,6 +150,7 @@ jQuery.extend( jQuery.event, {
},
// Piggyback on a donor event to simulate a different one
// Used only for `focus(in | out)` events
simulate: function( type, elem, event ) {
var e = jQuery.extend(
new jQuery.Event(),
@ -157,27 +158,10 @@ jQuery.extend( jQuery.event, {
{
type: type,
isSimulated: true
// Previously, `originalEvent: {}` was set here, so stopPropagation call
// would not be triggered on donor event, since in our own
// jQuery.event.stopPropagation function we had a check for existence of
// originalEvent.stopPropagation method, so, consequently it would be a noop.
//
// But now, this "simulate" function is used only for events
// for which stopPropagation() is noop, so there is no need for that anymore.
//
// For the compat branch though, guard for "click" and "submit"
// events is still used, but was moved to jQuery.event.stopPropagation function
// because `originalEvent` should point to the original event for the constancy
// with other events and for more focused logic
}
);
jQuery.event.trigger( e, null, elem );
if ( e.isDefaultPrevented() ) {
event.preventDefault();
}
}
} );

View File

@ -2790,6 +2790,81 @@ QUnit.test( "Donor event interference", function( assert ) {
jQuery( "#donor-input" )[ 0 ].click();
} );
QUnit.test(
"native stop(Immediate)Propagation/preventDefault methods shouldn't be called",
function( assert ) {
var userAgent = window.navigator.userAgent;
if ( !( /firefox/i.test( userAgent ) || /safari/i.test( userAgent ) ) ) {
assert.expect( 1 );
assert.ok( true, "Assertions should run only in Chrome, Safari, Fx & Edge" );
return;
}
assert.expect( 3 );
var checker = {};
var html = "<div id='donor-outer'>" +
"<form id='donor-form'>" +
"<input id='donor-input' type='radio' />" +
"</form>" +
"</div>";
jQuery( "#qunit-fixture" ).append( html );
var outer = jQuery( "#donor-outer" );
outer
.on( "focusin", function( event ) {
checker.prevent = sinon.stub( event.originalEvent, "preventDefault" );
event.preventDefault();
} )
.on( "focusin", function( event ) {
checker.simple = sinon.stub( event.originalEvent, "stopPropagation" );
event.stopPropagation();
} )
.on( "focusin", function( event ) {
checker.immediate = sinon.stub( event.originalEvent, "stopImmediatePropagation" );
event.stopImmediatePropagation();
} );
jQuery( "#donor-input" ).trigger( "focus" );
assert.strictEqual( checker.simple.called, false );
assert.strictEqual( checker.immediate.called, false );
assert.strictEqual( checker.prevent.called, false );
// We need to "off" it, since yes QUnit always update the fixtures
// but "focus" event listener is attached to document for focus(in | out)
// event and document doesn't get cleared obviously :)
outer.off( "focusin" );
}
);
QUnit.test(
"isSimulated property always exist on event object",
function( assert ) {
var userAgent = window.navigator.userAgent;
if ( !( /firefox/i.test( userAgent ) || /safari/i.test( userAgent ) ) ) {
assert.expect( 1 );
assert.ok( true, "Assertions should run only in Chrome, Safari, Fx & Edge" );
return;
}
assert.expect( 1 );
var element = jQuery( "<input/>" );
jQuery( "#qunit-fixture" ).append( element );
element.on( "focus", function( event ) {
assert.notOk( event.isSimulated );
} );
element.trigger( "focus" );
}
);
QUnit.test( "originalEvent property for Chrome, Safari, Fx & Edge of simulated event", function( assert ) {
var userAgent = window.navigator.userAgent;
@ -2800,6 +2875,7 @@ QUnit.test( "originalEvent property for Chrome, Safari, Fx & Edge of simulated e
}
assert.expect( 4 );
var done = assert.async();
var html = "<div id='donor-outer'>" +
"<form id='donor-form'>" +
@ -2808,19 +2884,26 @@ QUnit.test( "originalEvent property for Chrome, Safari, Fx & Edge of simulated e
"</div>";
jQuery( "#qunit-fixture" ).append( html );
var outer = jQuery( "#donor-outer" );
jQuery( "#donor-outer" ).on( "focusin", function( event ) {
assert.ok( true, "focusin bubbled to outer div" );
assert.equal( event.originalEvent.type, "focus",
"make sure originalEvent type is correct" );
assert.equal( event.type, "focusin", "make sure type is correct" );
} );
outer
.on( "focusin", function( event ) {
assert.ok( true, "focusin bubbled to outer div" );
assert.equal( event.originalEvent.type, "focus",
"make sure originalEvent type is correct" );
assert.equal( event.type, "focusin", "make sure type is correct" );
} );
jQuery( "#donor-input" ).on( "focus", function() {
assert.ok( true, "got a focus event from the input" );
done();
} );
jQuery( "#donor-input" ).trigger( "focus" );
} );
// We need to "off" it, since yes QUnit always update the fixtures
// but "focus" event listener is attached to document for focus(in | out)
// event and document doesn't get cleared obviously :)
outer.off( "focusin" );
} );
QUnit[ jQuery.fn.click ? "test" : "skip" ]( "trigger() shortcuts", function( assert ) {
assert.expect( 5 );