TL;DR: How can I test for compatibility issues with IE8 on my site?
I wrote up a website for school, and it works on every browser I've tested, except for <=IE8.
What happens and what I've tried:
To test, I'm using IE11's emulation mode, but I experienced the same behavior in a real IE8 browser.
I'm using jQuery 1.11, which supports old versions of IE.
I can't really supply code, since there's a lot of it, but I'm passing off anything with sketchy browser support to jQuery, (verified with www.caniuse.com) and again, I'm not receiving any errors indicating that a certain method couldn't be found.
From this description, does anyone know what might be going wrong, or how else I could go about diagnosing the problem?
I thought everything was peachy while debugging, but I guess that will teach me to debug while at work.
I narrowed it down to the following piece of code:
Resolvable: function() {
var isResolved = false;
var onResolve;
this.resolve = function() {
isResolved = true;
if (typeof onResolve !== 'undefined') {
onResolve();
}
};
this.setOnResolve = function(f) {
if (isResolved) {
f();
} else {
onResolve = f;
}
}
Inside setOnResolve
, the else
block is entered, the assignment happens, and everything stops loading (the "watch" panel empties out, and any manual watches I've added come up as "not available").
setOnResolve
is called here:
/**
* Runs each of the {@SuspendedLoader}s, in the order that they're given.
*
* @param {SuspendedLoader[]} seqOfSuspLoaders An array of {@link SuspendedLoader}s
*/
runLoadersInOrder: function(seqOfSuspLoaders) {
if (seqOfSuspLoaders.length < 1) return;
var currentLoader = seqOfSuspLoaders[0];
var restLoaders = seqOfSuspLoaders.slice(1);
var advance = Loaders.PageLoader.runLoadersInOrder;
var loaderPromise = currentLoader.runLoader();
if (loaderPromise instanceof Loaders.Helpers.Resolvable) {
loaderPromise.setOnResolve(function() { //<--- HERE
advance(restLoaders);
});
} else {
loaderPromise.then(
function() {
advance(restLoaders);
},
function() {
throw new Error("Couldn't run loader (" + currentLoader.constructor.name + "): ");
}
)
}
},
I've placed breakpoints on every line of runLoadersInOrder
however, and the code never advances past the call to setOnResolve
. I step into setOnResolve
, the onResolve
assignment happens, then it quits.
I've realized that the issue is actually that runLoadersInOrder
is being exited completely instead of recursing. I'll keep playing with it.
I solved it. I'm passing off adding event handlers to jQuery wherever possible, but neglected to handle the case of the jQuery script tag onload
event, which obviously never fires in old IE. This function was really the problem:
/**
* Loads a script without using jQuery by inserting a script tag into the page.
*
* @param path The folder the scripts are in.
* @param scriptName The name of the script to load.
* @returns {Resolvable} A {@link Resolvable} indicating when the script tag is loaded.
*/
Loaders.ScriptLoader.loadJQuery = function(path, scriptName) {
var firstExistingScript = document.body.getElementsByTagName('script')[0];
var script = Loaders.ScriptLoader.createScript(path, scriptName);
document.body.insertBefore(script, firstExistingScript);
var res = new Loaders.Helpers.Resolvable();
script.onload = function() {
$.ajaxSetup({cache: true});
res.resolve();
});
return res;
};
Note how I'm using onload
to check for completion, which isn't compatible with old versions of IE. I changed that part to:
Loaders.Helpers.attachOnLoad(script, function() {
$.ajaxSetup({cache: true});
res.resolve();
});
where attachOnLoad
=
attachOnLoad: function(element, f) {
if (typeof element.onload === 'undefined') {
element.onreadystatechange = function() {
if (element.readyState === 'loaded') {
f();
}
};
} else {
element.onload = f;
}
},
For some reason, the ready state never becomes complete
, but does become loaded
. I'll need to do further testing to ensure it consistently loads.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.