[with solution and fix proposal] sporadic error "document.body is null" and continuous page reloads

[beat]

The effect of this error can be disastrous to web servers, as it can reload the page continuously, and fix seems simple at first glance: don't trust the domready event from browser, but check that document.body is not null before accepting that event as valid:

Sporadically I had in firefox 3.5.4 the error "document.body is null"

This was exactly reported in IE too here: ​http://groups.google.com/group/jquery-en/browse_thread/thread/70e8a050f60f8b08

(that thread being closed, i am opening a new one here)

Interestingly turning cache off with webdeveloper plugin, the error came systematically, and *worse*, did systematically reload the page automatically, cycling the like F5 button pressed permanently, putting load on server. But that also allowed to use firebug to debug.

• When not having any javascript inline code in head, the error went

away. So this worked fine (no page reloads):

<script type="text/javascript" src="http://www.example.com/
jquery-1.3.1/jquery-1.3.1.js"></script><script type="text/
javascript"><!--
jQuery.noConflict();
--></script>

• But with just having this it was already permanently reloading the

page with cache off and also throwing error "document.body is null" :

	<script type="text/javascript" src="http://www.example.com/
jquery-1.3.1/jquery-1.3.1.js"></script><script type="text/
javascript"><!--
jQuery.noConflict();
--></script>
	<script type="text/javascript"><!--
jQuery(document).ready(function($){
/*
*/
});
--></script>

No other javascript in the page, only CSS files and valid transitional HTML !

Finally, I saw that in the site template, some CSS files where loaded after that javascript code, and being jQuery 1.3, it's better to load them before....

So i have put all CSS files <link> before the javascript code above, and the error disappeared completely.

As this is a recommendation for jQuery 1.3, well, you could classify this as a ... template-designer-error, but still:

IMPORTANT CONCLUSION:

*However* : if a site template (e.g. in joomla, where the template used by the site is not under the control of the extension developer using jQuery) puts some CSS files after the Javascript headers, then the issue that *it triggers permanent fast page reloads* is a big issue for webserver sanity, and imho something should be done in jQuery to check at least check for the condition "document.body === null" before deciding that the document is ready.

So that should be fixed in jQuery imho, not just trusting the dom ready event, which seems to be fired too to early on CSS file loads, but to check that there is really a document.body there before trusting the event and starting touching the body even before it exists.

Best Regards, Beat

[john]

That's a simple enough check, added it in: ​http://github.com/jquery/jquery/commit/81bfd9b870f658ce00eec48ea48a84d69c20bf05

[dmethvin]

This appeared to be the same as #4320 which didn't have a test case, so I closed it as well.

[john]

Actually, I fixed this incorrectly - backing this change out. It's a generic IE/Firefox issue and after reading some of the other tickets it seems as if.

This is a duplicate of #4406 and #4320.