Fix #12018, readyState "interactive" in oldIE lies! Closes gh-848.

This commit is contained in:
Mike Sherov 2012-07-06 10:12:20 -04:00 committed by Dave Methvin
parent aaf134bb70
commit f5fd41252e
7 changed files with 77 additions and 34 deletions

View File

@ -63,12 +63,13 @@ var
DOMContentLoaded = function() {
if ( document.addEventListener ) {
document.removeEventListener( "DOMContentLoaded", DOMContentLoaded, false );
} else {
// we're here because readyState !== "loading" in oldIE
jQuery.ready();
} else if ( document.readyState === "complete" ) {
// we're here because readyState === "complete" in oldIE
// which is good enough for us to call the dom ready!
document.detachEvent( "onreadystatechange", DOMContentLoaded );
jQuery.ready();
}
jQuery.ready();
},
// [[Class]] -> type pairs
@ -818,7 +819,7 @@ jQuery.ready.promise = function( obj ) {
// Catch cases where $(document).ready() is called after the
// browser event has already occurred.
if ( document.readyState !== "loading" ) {
if ( document.readyState === "complete" || ( document.readyState !== "loading" && document.addEventListener ) ) {
// Handle it asynchronously to allow scripts the opportunity to delay ready
setTimeout( jQuery.ready, 1 );

View File

@ -4,27 +4,26 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Test case for jQuery ticket #10067</title>
<script type="text/javascript">
if ( document.attachEvent ) {
// browsers that use the non-standard event API will load the iframe
// before jQuery, so there's no way to fire ready before the iframe loads
window.parent.iframeCallback( true );
} else {
setTimeout(function() {
el = document.createElement("script");
el.type = "text/javascript";
el.onload = function() {
jQuery( document ).ready(function() {
jQuery("body").append("<div>modifying DOM</div>");
window.parent.iframeCallback( true );
});
}
document.getElementsByTagName("head")[ 0 ].appendChild( el );
el.src = "../../../dist/jquery.js";
}, 1000 );
}
setTimeout(function() {
el = document.createElement("script");
el.type = "text/javascript";
el.onload = function() {
jQuery( document ).ready(function() {
window.parent.iframeCallback( jQuery('#container').length === 1 );
});
}
document.getElementsByTagName("head")[ 0 ].appendChild( el );
el.src = "../../../dist/jquery.js";
}, 1000 );
</script>
</head>
<body>
<!-- external resources that come before elements trick
oldIE into thinking the dom is ready, but it's not... -->
<script type="text/javascript" src="longLoadScript.php?sleep=1"></script>
<div id="container" style="height: 300px"></div>
<!-- long loading iframe -->
<iframe src="longLoad.php?sleep=15&return=false" style="width: 1px; height: 1px"></iframe>
</body>

View File

@ -0,0 +1,4 @@
<?php
sleep((int)$_GET['sleep']);
header('Content-type: text/javascript');
?>

View File

@ -12,6 +12,6 @@ jQuery.when( jQuery.ready ).done(function() {
</script>
</head>
<body>
<!-- long loading iframe -->
<!-- empty body -->
</body>
</html>

View File

@ -6,13 +6,18 @@
<script type="text/javascript" src="../../../dist/jquery.js"></script>
</head>
<body>
<script type="text/javascript">
jQuery( document ).ready(function () {
jQuery("body").append("<div>modifying DOM</div>");
window.parent.iframeCallback( true );
window.parent.iframeCallback( jQuery('#container').length === 1 );
});
</script>
<!-- long loading iframe -->
<iframe src="longLoad.php?sleep=10&return=false" style="width: 1px; height: 1px"></iframe>
<!-- external resources that come before elements trick
oldIE into thinking the dom is ready, but it's not...
leaving this check here for future trailblazers to attempt
fixing this...-->
<script type="text/javascript" src="longLoadScript.php?sleep=1"></script>
<div id="container" style="height: 300px"></div>
</body>
</html>

View File

@ -0,0 +1,26 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Test case for jQuery ticket #10067</title>
<script type="text/javascript" src="../../../dist/jquery.js"></script>
</head>
<body>
<script type="text/javascript">
jQuery( document ).ready(function () {
window.parent.iframeCallback( jQuery('#container').length === 1 );
});
</script>
<!-- external resources that come before elements trick
oldIE into thinking the dom is ready, but it's not...
leaving this check here for future trailblazers to attempt
fixing this...-->
<script type="text/javascript" src="longLoadScript.php?sleep=1"></script>
<div id="container" style="height: 300px"></div>
<!-- long loading iframe -->
<iframe src="longLoad.php?sleep=10&return=false" style="width: 1px; height: 1px"></iframe>
</body>
</html>

View File

@ -2345,7 +2345,7 @@ test("jQuery.off using dispatched jQuery.Event", function() {
test( "delegated event with delegateTarget-relative selector (#)", function() {
expect(1);
var markup = jQuery( '<ul><li><ul id="u1"><li id="f1"></li></ul></li>' ).appendTo("body");
markup
.find("#u1")
.on( "click", "li:first", function() {
@ -2884,14 +2884,22 @@ if ( hasPHP ) {
ok( isOk, "$.when( $.ready ) works" );
});
testIframeWithCallback( "jQuery.ready synchronous load with long loading iframe", "event/syncReady", function( isOk ) {
expect(1);
ok( isOk, "jQuery loaded synchronously fires ready before all sub-resources are loaded" );
});
// oldIE needs all subresources to be loaded before it can gaurantee the document is truly ready to be interacted with
if( document.addEventListener ) {
testIframeWithCallback( "jQuery.ready synchronous load with long loading iframe", "event/syncReadyLongLoad", function( isOk ) {
expect(1);
ok( isOk, "jQuery loaded synchronously fires ready before all sub-resources are loaded" );
});
testIframeWithCallback( "jQuery.ready asynchronous load with long loading iframe", "event/asyncReady", function( isOk ) {
testIframeWithCallback( "jQuery.ready asynchronous load with long loading iframe", "event/asyncReady", function( isOk ) {
expect(1);
ok( isOk, "jQuery loaded asynchronously fires ready before all sub-resources are loaded" );
});
}
testIframeWithCallback( "jQuery.ready synchronous load with long loading subresources", "event/syncReady", function( isOk ) {
expect(1);
ok( isOk, "jQuery loaded asynchronously fires ready before all sub-resources are loaded" );
ok( isOk, "jQuery loaded synchronously fires ready when the DOM can truly be interacted with" );
});
}