jQuery.load() can render the page useless in IE7

[enkidude@…]

jQuery.load() can render the page useless in IE7

---

In IE7 (and maybe IE8) using jQuery.load() with a selector can under certain circumstances render the page useless (blank). It's some sort of race condition and happens if jQuery.load() is called multiple times under a short period of time. The pages that are loaded have to contain a CSS @font-face rule (inline or link) with a src attribute (but the actual font file does not have to exist). Furthermore, the loaded pages have to be of a certain size/complexity for this bug to be triggered.

When the bug is triggered the page will freeze and if the browser window is resized the page goes blank. When using IE developer toolbar to inspect the elements all content has been loaded into the DOM as expected.

I've created a page in JS Bin that reproduces the problem. If the bug is not triggered in IE7 the number of jQuery.load() request might have to be increased or the page that is loaded might be too small. It is possible to modify either page in JS Bin.

Page that reproduces the bug: ​http://jsbin.com/jquery_load_ie7_bug_test_case/1/

The page that is loaded using jQuery.load(): ​http://jsbin.com/jquery_load_ie7_bug_page_to_load/1/

jQuery version: 1.8.2

affected browser: IE7 (and maybe IE8)

[Timmy Willison]

Maybe we should clear font-face declarations in .load.

[enkidude@…]

Replying to timmywil:

Maybe we should clear font-face declarations in .load.

Please remember that the problem occurs both when font-face is declared in <style> elements as well as in externa CSS-files.

[jaubourg]

Sounds like a can of worms we don't wanna open in core.

Isn't there any reasonable workaround for user code here?

[enkidude@…]

Would it be possible to strip all <style> and <link> elements in the same way as <script> elements are removed?

[jaubourg]

Well, the problem is that the entire HTML string is added to a detached node from the host document before selecting (that way, we don't need to actually parse the HTML string). So the stylesheet is inserted and, somehow, IE starts loading CSS-related resources that are referenced inside other nodes (through a classname). Then the style/link node is discarded and IE pretty much crashes. I already saw that happen in IE8 when we had the secondary body for support tests. When there was a background-image attached to the body using some CSS rule, IE8 would act erractically when this body would be removed.

Removing style and link nodes won't work and may even be undesirable. What if the style node is in the selected fragment?

I'll close this as patch-welcome but I doubt we will see a reasonable solution to this.