Search and Top Navigation
#10152 closed bug (fixed)
Opened July 10, 2014 12:15PM UTC
Closed July 23, 2014 03:10PM UTC
Last modified July 23, 2014 03:16PM UTC
Dialog: Clicking on modal dialog trigger firefox js error `this._trackingInstances(...)[0] is undefined`
Reported by: | coolphoenix | Owned by: | |
---|---|---|---|
Priority: | blocker | Milestone: | 1.11.1 |
Component: | ui.dialog | Version: | 1.11.0 |
Keywords: | regression | Cc: | |
Blocked by: | Blocking: |
Description
Please see this fiddle for a test case: http://jsfiddle.net/XRtf8/
When clicking inside the dialog in firefox, the following error is raised:
TypeError: this._trackingInstances(...)[0] is undefined: this._trackingInstances()[ 0 ]._focusTabbable();
The dialog is only initialized with this:
$( "#dialog" ).dialog( { modal: true });
Error happens on firefox 30 and 32a2, too. Chrome and safari do not show the error.
Jquery-ui: 1.11.0
Jquery: 1.11.0
Error does not happen on jquery-ui 1.10.4.
Attachments (0)
Change History (7)
Changed July 10, 2014 12:58PM UTC by comment:1
keywords: | → regression |
---|---|
priority: | minor → blocker |
status: | new → open |
Changed July 10, 2014 01:23PM UTC by comment:2
Ok this is confusing me. The error does not occur outside of the jsFiddle UI: http://jsfiddle.net/XRtf8/show/. I also tried including http://jsfiddle.net/XRtf8/show/ in an
<iframe>, and that doesn't recreate the error either.
coolpheonix, did you run across this error in an app before seeing it in jsFiddle? If so were you using an iframe? Any information you can provide would be helpful.
Thanks.
Changed July 10, 2014 01:56PM UTC by comment:3
I ran across this on my web page where I am not using an iframe. I have some modal dialogs where this error does not happen but on at least one other it is. Unfortunately I am using a lot of different js libraries, so this is definitely not easy to debug and maybe is a coincidence with a same library jsfiddle uses, too. Additionally the js is minified on my site and I am getting the popup via ajax.
I patched jquery-ui on my site so the error does not trigger but only log to the console like this:
10553 if ( !this._allowInteraction( event ) ) { 10554 event.preventDefault(); 10555 if( ti = this._trackingInstances()[ 0 ] ) { 10556 ti._focusTabbable(); 10557 } else { 10558 if( console ) { 10559 console.log('could not find trackingInstances'); 10560 } 10561 } 10562 }
To reproduce the error on my site:
1. visit https://www.stellenticket.de/en/my_account/start/
1. in your js console (firebug) execute: ``show_predefined_popup_ajax('logged_in_already');
``
1. a popup should be fetched via ajax and display You are already logged in.
. Click on it: console should print could not find trackingInstances
--> error was triggered
1. you can find the uncompressed source of jquery-ui at https://www.stellenticket.de/js/0/components/jquery-ui/jquery-ui.js (but I only changed the above to workaround the error, nothing more)
Changed July 10, 2014 08:07PM UTC by comment:4
Thanks coolphoenix, that helps.
I've tracked this down to this
focusinlistener: https://github.com/jquery/jquery-ui/blob/master/ui/dialog.js#L579-582. It fires in Chrome but does not fire in Firefox under these conditions. I'm not sure why yet.
Changed July 21, 2014 05:30PM UTC by comment:5
If you remove the web fonts from your site does the error still occur?
Changed July 23, 2014 03:10PM UTC by comment:6
resolution: | → fixed |
---|---|
status: | open → closed |
Dialog: Track the instance as soon as the dialog is opened
Fixes #10152
Changeset: 69f25dbff71d9864ce7ce46c47003413f8b7deb2
Changed July 23, 2014 03:16PM UTC by comment:7
milestone: | none → 1.11.1 |
---|
The web fonts were just a distraction from trying to reduce jsFiddle. I was only able to reproduce this by stripping down jsFiddle and using an iframe with a different origin. Removing CodeMirror or the jsFiddle Layout code made the error go away. When I got to that point, I decided not to spend any more time trying to narrow it down and just started debugging the actual dialog code.
Apparently what happens is Firefox tries to focus the dialog when it opens, but because it's in an iframe, it first focuses the document. Since the dialog instances aren't tracked until the dialog is focused, this caused the code to error when it saw a focus event outside of the dialog and tried to focus the most recently tracked instance. I fixed this by tracking the dialog instance as soon as it's opened. Although we don't have a reduced test case for the live site which doesn't use iframes, this should still fix the problem there.