Skip to main content

Search and Top Navigation

#8051 closed bug (fixed)

Opened January 23, 2012 09:03PM UTC

Closed January 31, 2013 02:22AM UTC

Last modified January 31, 2013 02:26AM UTC

Dialog: 'Explode' dialog animation causes crash in IE 6, 7 and 8.

Reported by: arcana666 Owned by:
Priority: minor Milestone: 1.10.1
Component: ui.dialog Version: 1.8.17
Keywords: animation Cc:
Blocked by: Blocking:
Description

Using the example linked below you will see that IE 6, 7 and 8 will produce the error "Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus."

The error does not happen if the 'show' parameter isn't set to 'explode'.

Example here: http://jsfiddle.net/Pr5rZ/

Attachments (0)
Change History (8)

Changed February 02, 2012 05:42PM UTC by tj.vantoll comment:1

The issue is occurring in this code in jquery.ui.dialog.js.

// set focus to the first tabbable element in the content area or the first button
// if there are no tabbable elements, set focus on the dialog itself
var hasFocus = self.element.find( ":tabbable" );
if ( !hasFocus.length ) {
	hasFocus = uiDialog.find( ".ui-dialog-buttonpane :tabbable" );
	if ( !hasFocus.length ) {
		hasFocus = uiDialog;
	}
}

hasFocus.eq( 0 ).focus();

The code ends up trying to give focus to the dialog itself but it can't since the animation isn't complete and the true dialog still has its visibility set to hidden. All browsers except IE <= 8 ignore this, but IE <= 8 throws an error - http://jsfiddle.net/XUkEU/1/.

A kind of hacky fix would be to check to make sure the element that you're about to give focus to is actually displaying. This does fix this error in IE <= 8.

if ( $(hasFocus.eq(0)).css( 'visibility' ) != 'hidden' ) {
	hasFocus.eq( 0 ).focus();
}

But I think the correct way of handling this would be to defer running the focus logic until the animation completes. I would think you'd still want the focus logic to run after any of the animations, and right now it's a race condition where the focus logic will almost always run before the animation completes.

Changed February 02, 2012 05:46PM UTC by scottgonzalez comment:2

keywords: → animation
status: newopen

Thanks tj. This sounds like it should be fixed by the same fix for #4421.

Changed October 11, 2012 02:47PM UTC by scottgonzalez comment:3

milestone: 1.9.01.10.0

Changed October 23, 2012 12:23AM UTC by jzaefferer comment:4

summary: 'Explode' dialog animation causes crash in IE 6, 7 and 8.Dialog: 'Explode' dialog animation causes crash in IE 6, 7 and 8.

Changed January 25, 2013 04:27PM UTC by C6AC165B-7B1E-445F-804B-A1BFED06162F comment:5

_comment0: Explode animation falls out of CSS scope. (will add separate ticket) \ Explode animation produces 6 pieces not 9 (bottom three do not appear, at least when in a fully scoped css theme) (will add separate ticket)1359131282485715

Explode animation falls out of CSS scope. (will add separate ticket)

Explode animation produces 6 pieces not 9 (bottom three do not appear, at least when in a fully scoped css theme) (will add separate ticket)

Changed January 25, 2013 09:23PM UTC by tj.vantoll comment:6

milestone: 1.10.0none

Changed January 31, 2013 02:22AM UTC by Kris Borchers comment:7

resolution: → fixed
status: openclosed

Dialog: Move call to _focusTabbable and triggering of open and focus events into the _show callback. Fixes #6756 - Dialog: show: "blind" with link in content doesn't animate properly. Fixes #8051 - Dialog: 'Explode' dialog animation causes crash in IE 6, 7 and 8. Fixes #4421 - Dialog: Focus lost from dialog which uses show-effect

Changeset: d1505e3434ef99e0068347a5e8179a0ffd737676

Changed January 31, 2013 02:26AM UTC by scottgonzalez comment:8

milestone: none1.10.1