web-dev-qa-db-fra.com

Le site Web avec JS ne fonctionne pas dans IE9 tant que les outils de développement ne sont pas activés.

Je développe un site Web complexe faisant largement appel à jQuery et à un certain nombre de scripts. Au chargement du site, aucun de mes scripts ne fonctionne (bien que je puisse confirmer que les autres scripts fonctionnent correctement). Je ne posterais pas une question aussi boiteuse ici sur SE, sauf pour une chose:

Dès que j'ai appuyé sur F12 pour activer les outils de développement et pouvoir ainsi déboguer mon problème, tout fonctionne instantanément!

Pire, si je ferme le navigateur, le lance, active d'abord Outils de développement et visite le site, tout fonctionne comme prévu. 

Donc, je ne peux même pas résoudre le problème parce que Dev Tools le corrige! Qu'est-ce que Dev Tools pourrait faire pour que les choses fonctionnent? Cela change-t-il l'UA (je détecte jQuery.browser)? Fait-il quelque chose à doctype?

MODIFIER

Toute la journalisation de ma console est encapsulée dans la fonction utilitaire d'encapsuleur suivante:

   function log(msg){
    if (console){
        console.log(msg);
    }
   }

Toute pensée ou suggestion que je pourrais essayer serait la bienvenue. Je posterai ici si je trouve une solution.

javascriptinternet-explorer-9
59
Tom Auger

Je sais que je suis assez tard pour la fête, mais j’ai une solution un peu différente pour IE9.

(function() {
    var temp_log = [];
    function log() {
        if (console && console.log) {
            for (var i = 0; i < temp_log.length; i++) {
                console.log.call(window, temp_log[i]);
            }
            console.log.call(window, arguments);
        } else {
            temp_log.Push(arguments);
        }
    }
})();

Fondamentalement, au lieu de console.log, vous utilisez log. Si console.log existe alors il fonctionne normalement, sinon il stocke les entrées de journal dans un tableau et les affiche à la prochaine log où le console est disponible.

Ce serait bien si cela poussait les données dès que le console est disponible, mais cela coûte moins cher que de configurer un écouteur setInterval personnalisé.

Fonction mise à jour (1er octobre 2012)

J'ai mis à jour ce script pour mon usage personnel et je pense le partager. Il présente quelques améliorations intéressantes:

  • utiliser console.log() comme d'habitude, c'est-à-dire qu'il n'est plus nécessaire d'utiliser log() non standard
  • prend en charge plusieurs arguments, par exemple. console.log('foo', 'bar')
  • vous pouvez également utiliser console.error, console.warn et console.info (bien que les affiche sous la forme console.log)
  • le script vérifie la présence de console natif toutes les 1000 ms et génère le tampon, le cas échéant

Je pense qu'avec ces améliorations, ceci est devenu une cale assez solide pour IE9. Consultez le dépôt GitHub ici . 

if (!window.console) (function() {

    var __console, Console;

    Console = function() {
        var check = setInterval(function() {
            var f;
            if (window.console && console.log && !console.__buffer) {
                clearInterval(check);
                f = (Function.prototype.bind) ? Function.prototype.bind.call(console.log, console) : console.log;
                for (var i = 0; i < __console.__buffer.length; i++) f.apply(console, __console.__buffer[i]);
            }
        }, 1000); 

        function log() {
            this.__buffer.Push(arguments);
        }

        this.log = log;
        this.error = log;
        this.warn = log;
        this.info = log;
        this.__buffer = [];
    };

    __console = window.console = new Console();
})();
34
Liam Newmarch

Vous avez des appels de console. Dans IE, ils échoueront si les outils de développement ne sont pas ouverts. Une solution simple consiste à envelopper tous les appels de la console dans une fonction telle que:

function log(msg) {
  if(console)
    console.log(msg);
}
13
J T

La plupart des autres solutions devraient bien fonctionner, mais voici une courte ligne si vous ne vous souciez pas de capturer les messages du journal si la console n'est pas disponible.

// Stub hack to prevent errors in IE
console = window.console || { log: function() {} };

Cela vous permet d’utiliser toujours la fonction native console.log directement au lieu de l’envelopper avec quoi que ce soit ou d’avoir un conditionnel à chaque fois.

2
Jasmine Hegman

Je l'ai piraté de la manière suivante

<script type="text/javascript">
    (function () {
        if (typeof console == "undefined") {
            console = {
                log : function () {}
            }
        }
    })();
</script>

Et ceci est le premier élément de script dans le fichier.

2
benqus

Le wrapper console.log que j’ai utilisé n’était pas suffisant pour détecter la console dans IE9. Voici le wrapper qui fonctionne d’une question connexe sur SE :

function logError(msg){
    try {
        console.log(msg);
    } catch (error) {
        throw new Error(msg);
    }
}

function log(msg){
    try {
        console.log(msg);
    } catch (error) { }
}

Un test approprié pour la disponibilité de l'objet console serait: if (typeof console === "undefined" || typeof console.log === "undefined")

1
Tom Auger

Je trouve beaucoup plus pratique d’utiliser simplement console && console.log('foo', 'bar', 'baz') plutôt que d’utiliser une fonction wrapper.

Le code que vous avez fourni:

function logError(msg){
  if (console) {
    console.log(msg);
  } else {
    throw new Error(msg);
  }
}

Produira une erreur pour IE lorsque les outils de développement sont fermés, car console sera indéfini.

1
zzzzBov

J'ai rencontré ce problème plusieurs fois. En gros, avec les variables, nous vérifions leur validité.

var somevar;
if (somevar)
 //do code

cela fonctionne parce que certains vont se résoudre en indéfini. Mais si vous vérifiez une propriété de fenêtre par exemple. window.console. 

if (console) <---- this throws an exception

Vous ne pouvez pas faire la même vérification. Le navigateur le traite différemment. Fondamentalement seulement faire cela

if (window.console) <---- will NOT throw an exception if undefined
//some code

cela fonctionnera comme dans le premier exemple. Donc, vous devez changer votre code pour

function log(msg){
 if (window.console){
     console.log(msg);
 }
}
0
John

Si vous avez plusieurs fichiers de script parallèles, les fichiers sont peut-être chargés/exécutés dans un ordre différent avec les outils de développement activés/désactivés.

0
Zhonk