測試IE8兼容性問題

Question

TL; DR：如何在我的網站上測試IE8的兼容性問題？

我為學校創建了一個網站，該網站可用於我測試過的所有瀏覽器，但<= IE8除外。

發生了什么，我已經嘗試過：

• 該站點開始加載，然后停止，並且僅顯示空白屏幕。
• 我發現我使用的是無法識別的方法，因此我打開了控制台並刷新了。 它在控制台中給出0錯誤或警告。
• 我啟動了內置調試器，並將斷點放置在處理站點加載的腳本內的主要加載點上。 逐步執行代碼，一切按預期進行，但仍僅顯示空白頁。

為了進行測試，我使用的是IE11的仿真模式，但是在真正的IE8瀏覽器中我遇到了相同的行為。

我正在使用jQuery 1.11，它支持IE的舊版本。

我真的不能提供代碼，因為有很多，但是我將任何具有粗略瀏覽器支持的東西都傳遞給了jQuery（已通過www.caniuse.com驗證），並且再次，我沒有收到任何表明找不到某種方法。

通過此描述，是否有人知道可能出了什么問題，或者我還可以如何診斷問題？

更新：

我以為調試時一切都很順利，但是我想這會教會我在工作時進行調試。

我將其范圍縮小為以下代碼：

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;
        }
    }

在setOnResolve內部，進入else塊，進行分配，並且一切都停止加載（“ watch”面板清空，並且我添加的所有手動手表都顯示為“ not available”）。

setOnResolve在這里被調用：

/**
 * 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 + "): ");
            }
        )
    }

},

但是，我在runLoadersInOrder每一行上都設置了斷點，並且代碼從不超過對setOnResolve的調用。 我進入setOnResolve ，發生onResolve分配，然后退出。

進一步

我意識到問題實際上是runLoadersInOrder完全退出而不是runLoadersInOrder退出。 我會繼續玩。

Answer 1

我解決了 我沒有在可能的情況下向jQuery添加事件處理程序，但是卻忽略了處理jQuery腳本標簽onload事件的情況，該事件顯然在舊IE中不會觸發。 這個功能確實是個問題：

/**
 * 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;
};

請注意我如何使用onload來檢查是否完成，這與IE的舊版本不兼容。 我將該部分更改為：

Loaders.Helpers.attachOnLoad(script, function() {
    $.ajaxSetup({cache: true});

    res.resolve();
});

其中attachOnLoad =

attachOnLoad: function(element, f) {
if (typeof element.onload === 'undefined') {
        element.onreadystatechange = function() {
            if (element.readyState === 'loaded') {
                f();
            }
        };

    } else {
        element.onload = f;
    }
},

出於某種原因，就緒狀態永遠不會變得complete ，而是會變為已loaded 。 我需要做進一步的測試，以確保其持續加載。