Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit6ad3651

Browse files
authored
Event: Make trigger(focus/blur/click) work with native handlers
In `leverageNative`, instead of calling `event.stopImmediatePropagation()`which would abort both native & jQuery handlers, set the wrapper's`isImmediatePropagationStopped` property to a function returning `true`.Since for each element + type pair jQuery attaches only one native handler,there is also only one wrapper jQuery event so this achieves the goal:on the target element jQuery handlers don't fire but native ones do.Unfortunately, this workaround doesn't work for handlers on ancestors- since the native event is re-wrapped by a jQuery one on each level ofthe propagation, the only way to stop it for jQuery was to stop it foreveryone via native `stopPropagation()`. This is not a problem for`focus`/`blur` which don't bubble, but it does also stop `click` oncheckboxes and radios. We accept this limitation.Fixesgh-5015Closesgh-5228
1 parentce60d31 commit6ad3651

File tree

2 files changed

+73
-6
lines changed

2 files changed

+73
-6
lines changed

‎src/event.js

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -545,8 +545,8 @@ function leverageNative( el, type, isSetup ) {
545545
}
546546

547547
// If this is an inner synthetic event for an event with a bubbling surrogate
548-
// (focus or blur), assume that the surrogate already propagated from triggering the
549-
// native event and prevent that from happening again here.
548+
// (focus or blur), assume that the surrogate already propagated from triggering
549+
//thenative event and prevent that from happening again here.
550550
// This technically gets the ordering wrong w.r.t. to `.trigger()` (in which the
551551
// bubbling surrogate propagates *after* the non-bubbling base), but that seems
552552
// less bad than duplication.
@@ -565,8 +565,16 @@ function leverageNative( el, type, isSetup ) {
565565
this
566566
));
567567

568-
// Abort handling of the native event
569-
event.stopImmediatePropagation();
568+
// Abort handling of the native event by all jQuery handlers while allowing
569+
// native handlers on the same element to run. On target, this is achieved
570+
// by stopping immediate propagation just on the jQuery event. However,
571+
// the native event is re-wrapped by a jQuery one on each level of the
572+
// propagation so the only way to stop it for jQuery is to stop it for
573+
// everyone via native `stopPropagation()`. This is not a problem for
574+
// focus/blur which don't bubble, but it does also stop click on checkboxes
575+
// and radios. We accept this limitation.
576+
event.stopPropagation();
577+
event.isImmediatePropagationStopped=returnTrue;
570578
}
571579
}
572580
});

‎test/unit/event.js

Lines changed: 61 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3423,6 +3423,36 @@ QUnit.test( "trigger(focus) works after focusing when hidden (gh-4950)", functio
34233423
assert.equal(document.activeElement,input[0],"input has focus");
34243424
});
34253425

3426+
QUnit.test("trigger(focus) fires native & jQuery handlers (gh-5015)",function(assert){
3427+
assert.expect(3);
3428+
3429+
varinput=jQuery("<input />"),
3430+
3431+
// Support: IE 9 - 11+
3432+
// focus is async in IE; we now emulate it via sync focusin in jQuery
3433+
// but this test also attaches native handlers.
3434+
done=assert.async(3);
3435+
3436+
input.appendTo("#qunit-fixture");
3437+
3438+
input[0].addEventListener("focus",function(){
3439+
assert.ok(true,"1st native handler fired");
3440+
done();
3441+
});
3442+
3443+
input.on("focus",function(){
3444+
assert.ok(true,"jQuery handler fired");
3445+
done();
3446+
});
3447+
3448+
input[0].addEventListener("focus",function(){
3449+
assert.ok(true,"2nd native handler fired");
3450+
done();
3451+
});
3452+
3453+
input.trigger("focus");
3454+
});
3455+
34263456
// TODO replace with an adaptation of
34273457
// https://github.com/jquery/jquery/pull/1367/files#diff-a215316abbaabdf71857809e8673ea28R2464
34283458
(function(){
@@ -3431,10 +3461,13 @@ QUnit.test( "trigger(focus) works after focusing when hidden (gh-4950)", functio
34313461
checkbox:"<input type='checkbox'>",
34323462
radio:"<input type='radio'>"
34333463
},
3434-
makeTestFor3751
3464+
function(type,html){
3465+
makeTestForGh3751(type,html);
3466+
makeTestForGh5015(type,html);
3467+
}
34353468
);
34363469

3437-
functionmakeTestFor3751(type,html){
3470+
functionmakeTestForGh3751(type,html){
34383471
vartestName="native-backed namespaced clicks are handled correctly (gh-3751) - "+type;
34393472
QUnit.test(testName,function(assert){
34403473
assert.expect(2);
@@ -3461,4 +3494,30 @@ QUnit.test( "trigger(focus) works after focusing when hidden (gh-4950)", functio
34613494
target.trigger("click.fired");
34623495
});
34633496
}
3497+
3498+
functionmakeTestForGh5015(type,html){
3499+
vartestName="trigger(click) fires native & jQuery handlers (gh-5015) - "+type;
3500+
QUnit.test(testName,function(assert){
3501+
assert.expect(3);
3502+
3503+
varparent=supportjQuery("<div class='parent'>"+html+"</div>"),
3504+
input=jQuery(parent[0].firstChild);
3505+
3506+
parent.appendTo("#qunit-fixture");
3507+
3508+
input[0].addEventListener("click",function(){
3509+
assert.ok(true,"1st native handler fired");
3510+
});
3511+
3512+
input.on("click",function(){
3513+
assert.ok(true,"jQuery handler fired");
3514+
});
3515+
3516+
input[0].addEventListener("click",function(){
3517+
assert.ok(true,"2nd native handler fired");
3518+
});
3519+
3520+
input.trigger("click");
3521+
});
3522+
}
34643523
})();

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp