Imprimir função log / stack trace para todo o programa usando firebug

94

O Firebug tem a capacidade de registrar chamadas para um nome de função específico. Estou procurando um bug que às vezes interrompe a renderização de uma página, mas não causa erros ou avisos. O bug só aparece na metade das vezes. Então, como obtenho uma lista de todas as chamadas de função para todo o programa, ou algum tipo de rastreamento de pilha para a execução de todo o programa?

amccormack
fonte

Respostas:

218

O Firefox oferece o console.trace() que é muito útil para imprimir a pilha de chamadas. Também está disponível no Chrome e no IE 11 .

Como alternativa, tente algo assim:

function print_call_stack() {
  var stack = new Error().stack;
  console.log("PRINTING CALL STACK");
  console.log( stack );
}
Matt Schwartz
fonte
2
Existe uma maneira de aumentar o comprimento da pilha? Isso seria muito útil.
Ravi Teja
✚1 console.warn ('[WARN] CALL STACK:', novo Error (). Stack);
user1742529
13

Quando preciso de um rastreamento de pilha, faço o seguinte, talvez você possa tirar alguma inspiração dele:

function logStackTrace(levels) {
    var callstack = [];
    var isCallstackPopulated = false;
    try {
        i.dont.exist += 0; //doesn't exist- that's the point
    } catch (e) {
        if (e.stack) { //Firefox / chrome
            var lines = e.stack.split('\n');
            for (var i = 0, len = lines.length; i < len; i++) {
                    callstack.push(lines[i]);
            }
            //Remove call to logStackTrace()
            callstack.shift();
            isCallstackPopulated = true;
        }
        else if (window.opera && e.message) { //Opera
            var lines = e.message.split('\n');
            for (var i = 0, len = lines.length; i < len; i++) {
                if (lines[i].match(/^\s*[A-Za-z0-9\-_\$]+\(/)) {
                    var entry = lines[i];
                    //Append next line also since it has the file info
                    if (lines[i + 1]) {
                        entry += " at " + lines[i + 1];
                        i++;
                    }
                    callstack.push(entry);
                }
            }
            //Remove call to logStackTrace()
            callstack.shift();
            isCallstackPopulated = true;
        }
    }
    if (!isCallstackPopulated) { //IE and Safari
        var currentFunction = arguments.callee.caller;
        while (currentFunction) {
            var fn = currentFunction.toString();
            var fname = fn.substring(fn.indexOf("function") + 8, fn.indexOf("(")) || "anonymous";
            callstack.push(fname);
            currentFunction = currentFunction.caller;
        }
    }
    if (levels) {
        console.log(callstack.slice(0, levels).join('\n'));
    }
    else {
        console.log(callstack.join('\n'));
    }
};

Nota do moderador : o código nesta resposta parece também aparecer nesta postagem do blog de Eric Wenderlin . O autor desta resposta afirma que é seu próprio código, porém, escrito antes da postagem do blog com link aqui. Apenas para fins de boa-fé, adicionei o link para a postagem e esta nota.

Martin Jespersen
fonte
2
Há uma chamada console.trace () que você pode fazer no Firebug que faz isso.
amccormack de
Isto é brilhante. O Firebug tem problemas com arquivos minimizados, este script resolve!
pstadler de
1
FWIW @ andrew-barber, autor da resposta nunca reivindicada como sua. Apenas não atribuí. Sua edição deve ser um comentário.
Ascherer
7

Eu fiz isso sem o firebug. Testado em cromo e firefox:

console.error("I'm debugging this code.");

Uma vez que seu programa imprime isso no console, você pode clicar na pequena seta para expandir a pilha de chamadas.

satnam
fonte
2

Tente percorrer o código uma linha ou uma função por vez para determinar onde ele pára de funcionar corretamente. Ou faça algumas suposições razoáveis ​​e espalhe as instruções de registro em seu código.

Casablanca
fonte
2
Este. Definitivamente, adicione um monte de console.log('something')declarações às suas funções para ver quais estão (e não estão) sendo chamadas
Gareth
1
O programa é enorme, então estou procurando uma maneira de comparar os logs de funções para ver quando o programa foi executado corretamente e quando não foi.
amccormack de
1
Concordo que isso seria útil. Estou intervindo para assumir a propriedade de uma grande base de código e algo que pode gerar um rastreamento de execução de todas as chamadas de função certamente ajudaria a ter uma noção do fluxo / forma do código e detectar o código morto.
Matthew Nichols,
1

Experimente isto:

console.trace()

Não sei se é compatível com todos os navegadores, por isso gostaria de verificar primeiro se existe.

Abraham Albero
fonte