Triggering after an `alert()` in an event handler results in a JS error about jquery

[mgol]

Thanks for the report. That's an interesting bug.

The issue on the browser side is caused by Firefox apparently dispatching the blur event twice if an alert is followed by a native .blur() call. Our blur (and focus) handling is a bit complex to support passing data in trigger calls and to see the proper focus state of the element in the handler. What it roughly does is call the native .blur() internally, stopping the outer synthetic event, and then calling trigger again with proper parameters. The native blur handling is the branch under this if:

jquery/src/event.js

Lines 557 to 559 in 284b082

	// If this is a native event triggered above, everything is now in order
	// Fire an inner synthetic event with the original arguments
	} else if ( saved ) {

It checks for a truthy saved which is usually an array of trigger arguments saved in the outer synthetic handler:

jquery/src/event.js

Line 530 in 284b082

saved = slice.call( arguments );

but if the inner native event fires twice, the second call sees the value set here:

jquery/src/event.js

Lines 561 to 566 in 284b082

	// ...and capture the result
	dataPriv.set( this, type, jQuery.event.trigger(
	saved[ 0 ],
	saved.slice( 1 ),
	this
	) );

That value is the return value of the last handler called. In our case, since we attach a simple handler returning true here:

jquery/src/event.js

Line 509 in 284b082

jQuery.event.add( el, type, returnTrue );

the value is true. That means the second inner handler sees true instead of an array and since the code above calls .slice() on it, we see a crash.

The reason @dmethvin discovered that attaching any blur handler before the problematic .trigger( "blur" ) call works around the issue is because we only attach the returnTrue handler as a hack to force event setup before the first trigger call if there wasn't a handler attached previously:

jquery/src/event.js

Lines 508 to 510 in 284b082

	if ( dataPriv.get( el, type ) === undefined ) {
	jQuery.event.add( el, type, returnTrue );
	}

PR: #5466

[dmethvin]

I can reproduce this on Firefox, but not Chrome or Edge. If a blur handler is added the error doesn't occur, but you can see that there is an extra focus/blur for Firefox compared to Chrome.

https://jsbin.com/pigorigazo/edit?html,console,output