YUILibrary - Open source JavaScript and CSS for building richly interactive software.
Fork YUI on GitHub

YUI 2.x

Ticket #2008289 (closed defect)

Reporter


sfbugs
Opened: 07/1/08
Last modified: 09/14/09
Status: closed
Type: defect
Resolution: fixed

Owner


Adam Moore
Target Release: 2.8.0
Priority: P3 (normal)
Summary: onDOMReady fails under IE when hosted by iframe
Description:

We have run into an issue under IE when using an iframe to host a page that relies on onDOMReady. It appears that the doScroll method does not fail as expected when it is included as part of an
iframe.

Including the following helps demonstrate the difference in behavior.

try {
document.createElement("p").doScroll("left");
alert("You Fail");
} catch (err) {
alert("You win");
}

Better repro case to follow.

Type: defect Observed in Version: 2.5.1
Component: Event Severity: S3 (normal)
Assigned To: Adam Moore Target Release: 2.8.0
Location: Library Code Priority: P3 (normal)
Tags: Relates To:
Browsers: IE 6.x,IE 7.x,IE 8.x
URL: http://lieschke.net/ondomreadytest/iframe-test.html
Test Information:

Change History

  • Username:
Posted: 07/2/08
  • summary changed from onDOMReady fails under IE when hosted by iframe to [#2040464] onDOMReady fails under IE when hosted by iframe

George

YUI Developer

Posted: 07/3/08

This bug report is being forwarded to the author or current owner of the affected component for additional investigation and response.

dclangan

Posted: 07/18/08

Experienced the same problem, here is a potential workaround to the current issue:

// following code was added to an external file, loaded in the head after yahoo-dom-event.js is loaded (using YUI 2.5.2)
// tested on IE6/7 & FF3 on Windows XP, Safari on Mac OSX
try {
document.createElement("p").doScroll("left");
// only gets here if (isIE and isInIframe)
// override onDOMReady to use window.onload
YAHOO.util.Event.onDOMReady = function( p_fn, p_obj, p_scope ){
YAHOO.util.Event.addListener( window, "load", p_fn, p_obj, p_scope );
}
} catch (e) {
// all other conditions get here, which is good.
}

Simon Lieschke

Posted: 07/21/08

We've recently encountered this issue at my workplace. I've managed to create some testcases which reproduce this problem intermittently yet reliably enough on both IE6 and IE7.

I can get the error appearing around 50% of the time on Microsoft's IE6 testing VM (http://tinyurl.com/y64upm), and around 20% of the time on IE7 on my desktop.

The error happens for a page both hosted in a frame and in an iframe.

Here's the test pages:

http://lieschke.net/ondomreadytest/frame-test.html
http://lieschke.net/ondomreadytest/iframe-test.html

The complete tests are also available for download from http://lieschke.net/ondomreadytest/ondomreadytest.zip.

  • Username:
Posted: 10/20/08

It will not fail if you use the code I suggested several months ago on the yui list.

At that time I was told that my suggestion would have been included, it has not happen up to now.

The "doScroll()" trick is known to work only on the main top window, you have to use an "onreadystatechange" event as a fall back for frames/iframes (and not only for that).

--
Diego Perini

Walter Rumsby

Posted: 10/21/08

After reading Diego's comment I had a look through some old issues to see if I could find the issue he was referring to.

I discovered issues [ 1882941 ] and [ 1883014 ] (aka [ #1778729 ]). The first issue was closed as a duplicate of the second, but both issues make the same suggested modification to the onDOMReady as it was then implemented. It appears that whoever resolved the issue did not see the comment Diego made about handling onreadystatechange, because this part of his implementation was not included in the revised onDOMReady function.

After looking at Diego's site I made the following change to a local copy of 2.6.0's event-debug.js:

if (EU.isIE) {
YAHOO.util.Event.onDOMReady(YAHOO.util.Event._tryPreloadAttach, YAHOO.util.Event, true);

if (window != window.top) {
document.onreadystatechange = function() {
if (document.readyState == 'complete') {
document.onreadystatechange = null;

clearInterval(EU._dri);
EU._dri = null;
EU._ready();
}
};
} else {
... // existing code goes here
}
} else if (EU.webkit && EU.webkit < 525) {
...

I then modified Simon's examples to use my redefined onDOMReady function and they now function as expected in both Internet Explorer and Firefox (note I have not performed exhaustive testing and this implementation could be improved).

While working on this I also uncovered issue [ 2183557 ] and note that relying on onreadystatechange even if window == window.top also avoids this issue.

Regards,
Walter

  • Username:
Posted: 10/21/08

@wrumsby,
thank you for looking at it and finding my previous suggestions.

I was also looking at this same problem in ExtJS actually. This technique has already been included in Google JsApi/UDS and various other frameworks (at different stages), unfortunately some misinformation left the desk before I could even explain it, creating a bit of confusion and waste of time :-(

There have been improvements in the handling of frames/iframes which does not work with the "doScroll()" trick as does the main top window. Also it is mandatory to use attach/detach instead of the DOM0 way since in some circumstance "document.onreadystatechange" will not produce the expected behavior (either...). This is a change that will improve IE and ensure that the order of "DOMReady" and "onload" is respected on all browsers in the same way.

The latest changes have been included in this (bit old) stand-alone cross-browser helper:

http://javascript.nwbox.com/ContentLoaded/contentloaded.js

I know it is a hack and there is nothing to be proud of, but the behavior is somehow documented on the vendor documentation and while waiting for a better solution I believe this is the best we have at the moment, if we don't want to go the proprietary external HTC way on IE.

These should be the changes to "event.js" in 2.6.0:

document.attachEvent('onreadystatechange', function() {
if (document.readyState == 'complete') {
document.detachEvent('onreadystatechange', arguments.callee);
EU._ready();
}
});

if (window == window.top) {
EU._dri = setInterval(function() {
try {
// throws an error if doc is not ready
document.documentElement.doScroll('left');
} catch (ex) {
return;
}
clearInterval(EU._dri);
EU._dri = null;
EU._ready();
}, EU.POLL_INTERVAL);
}

Haven't done any test, just took the source file and modified where it seemed adequate. I will have to find some of the test case and send them, but will take some days...

In the mean time you can look at the test cases I have at my lab site above (for IE).

--
Diego Perini

sfbugs

Posted: 01/7/09

This ticket was imported from Source Forge.

Orginially submitted by: kpdecker

George

YUI Developer

Posted: 01/10/09
  • browser changed to
  • location changed to
  • milestone changed to FUTURE
  • severity changed to S3 (normal)
  • testinfomation changed to http://

ebruchez

Posted: 02/10/09

It has been reported that this is an issue in Orbeon Forms as well, since Orbeon Forms uses onDOMReady, when Orbeon Forms is loaded within an iframe under IE. It would be great if this bug was fixed.

George

YUI Developer

Posted: 03/27/09
  • status changed from assigned to accepted

Adam Moore

YUI Developer

Posted: 04/2/09
  • milestone changed from FUTURE to 2.NEXT

Mike Rooney

Posted: 06/2/09
  • browser changed to N/A

Cool, glad to find this report and see that this was milestoned for 2.NEXT. This seems to be impeding us from running our tests on IE which would be quite nice to do.

Walter Rumsby

Posted: 06/23/09
  • browser changed from N/A to IE 6.x,IE 7.x

Trying Simon's test cases with IE8 this appears to be an issue with IE 6 & 7, but not 8.

Walter Rumsby

Posted: 06/23/09
  • testurl changed to http://lieschke.net/ondomreadytest/iframe-test.html

Mike Rooney

Posted: 06/23/09

As far as I am aware this issue also affects us on IE8. If no one else is seeing it there though, I can do some digging and make sure it is the same issue.

Walter Rumsby

Posted: 06/24/09

I tested IE 8 using a VM and there's a possibility that the VM was running too slowly to trigger the error condition, but you also can see issues with IE 8 that are not really IE 8 issues if the page renders using IE 7 rendering.

Simon Lieschke

Posted: 06/24/09
  • browser changed from IE 6.x,IE 7.x to IE 6.x,IE 7.x,IE 8.x

I've got IE8 installed on my desktop (not in a VM) and I can confirm it still manages to intermittently trigger the error condition for my test at http://lieschke.net/ondomreadytest/iframe-test.html

Adam Moore

YUI Developer

Posted: 06/30/09
  • location changed to Library Code
  • milestone changed from 2.NEXT to 2.8.0

Adam Moore

YUI Developer

Posted: 06/30/09

Adam Moore

YUI Developer

Posted: 06/30/09
  • resolution changed from None
  • status changed from accepted to checkedin

fixed in 285276ff9d5ce8c555789228b5e428afc8a54744

George

YUI Developer

Posted: 09/14/09
  • status changed from checkedin to closed

2.8.0 has been released. All "checkedin" items are available for download in the official release. Status of "checkedin" items is being set to closed.

George

YUI Developer

Posted: 09/14/09
  • resolution changed to fixed