2016-01-24 3 views
0

TL; DR: Как проверить наличие проблем совместимости с IE8 на моем сайте?Тестирование на проблемы совместимости с IE8

Я написал сайт для школы, и он работает в каждом браузере, который я тестировал, за исключением < = IE8.

Что происходит и что я пробовал:

  • Сайт начинает загружать, а затем останавливается, и показывает только пустой экран.
  • Я понял, что использовал метод, который он не распознает, поэтому я открыл консоль и обновился. Он дает 0 ошибок или предупреждений в консоли.
  • Я запустил встроенный отладчик и разместил точки останова в основных точках загрузки в скрипте, который обрабатывает загрузку сайта. Выполняя код, все идет так, как ожидалось, но пока отображается только пустая страница.

Чтобы проверить, я использую режим эмуляции IE11, но я испытал такое же поведение в реальном браузере IE8.

Я использую jQuery 1.11, который поддерживает старые версии IE.

Я не могу предоставить код, так как его много, но я передаю что-нибудь с отрывочной поддержкой браузера jQuery (проверено с помощью www.caniuse.com), и снова, я не получаю любые ошибки, указывающие на то, что определенный метод не найден.

Из этого описания кто-нибудь знает, что может быть неправильным, или как еще я могу пойти на диагностику проблемы?

Update:

Я думал, что все было радужно во время отладки, но я предполагаю, что будет учить меня для отладки во время работы.

я сузил его до следующего куска кода:

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 блока вводятся, назначение происходит, и все останавливается загрузка (далее «смотреть» панель опорожняет вне, и любой ручные часы, которые я добавил, появляются как «недоступные»).

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 осуществляется выход полностью вместо рекурсивно. Я буду продолжать играть с ним.

+0

'все идет так, как ожидалось, но пока отображается только пустая страница', так как дела идут так, как ожидалось? Уточните точку отказа. Находит ли DOM-дерево, как ожидалось? Это может быть что-то совершенно не связанное с вашим скриптом, например правило CSS или IE-условное, если тег –

+0

@Paul S. Я добавил обновление. – Carcigenicate

ответ

0

Я решил. Я передаю добавление обработчиков событий в jQuery везде, где это возможно, но пренебрегали обработкой случая события jQuery script 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. Мне нужно будет провести дополнительное тестирование, чтобы оно постоянно загружалось.

Смежные вопросы