2010-07-21 19 views
10

Ho eseguito il debug di JavaScript utilizzando Firebug più di cento volte senza preoccuparmi di cosa sta succedendo lì. Voglio sapere come esattamente un Firebug gestisce il debug di JavaScript/DOM.Come funziona Firebug internamente?

Dire di impostare un punto di interruzione su alcune istruzioni all'interno di un metodo e avviare il debug. Voglio sapere cosa sta succedendo lì dentro?

+2

E come modifica le pagine Web in modo tale da evidenziare gli elementi quando il cursore si posiziona su di essi? – djondal

risposta

8

Quando si fa clic su una linea per impostare un punto di interruzione, Firebug registra l'URL del file e il numero di riga nel caso in cui si ricarica la pagina. Quindi cerca l'URL/linea nelle sue strutture dati interne per decidere quale funzione di Javascript (chiamata "script" in Mozilla) si desidera interrompere. Quindi chiama una funzione della piattaforma Mozilla per mappare il numero di linea su un contatore di programma relativo all'inizio della funzione. Infine chiama la piattaforma per impostare un punto di interruzione sul contatore del programma.

Indietro quando è stato attivato il pannello Script, Firebug ha registrato i callback con la piattaforma. Uno di questi, onBreak, gestisce i punti di interruzione. Mentre la piattaforma esegue il codice JS, controlla le sue strutture interne per vedere se il contatore del programma corrente ha un breakpoint impostato. In tal caso, interrompe l'esecuzione di JS e richiama FireBug.

Firebug quindi esamina il punto di interruzione per decidere se si tratta di un punto di interruzione condizionale, se dispone dei dati corretti per supportare l'interfaccia utente del debugger in questo punto di interruzione e così via. Se le condizioni sono ok, comunica alla piattaforma di sospendere il debug, l'esecuzione di Javascript per la pagina Web e gli eventi della piattaforma per la pagina web. Quindi mostra il file sorgente per il punto di interruzione ed evidenzia la linea. Se le condizioni non sono buone, continua semplicemente.

Le parti complesse arrivano quando la piattaforma non supporta il numero di riga corretto per programmare la mappatura del contatore. Ad esempio, Firebug ha un sacco di codice per gestire eval() e gestori di eventi generati dal browser.

Domande come queste sono migliori nel newsgroup di Firebug secondo me.

+2

Grazie per la risposta dettagliata. Penso che SO sia un ottimo posto per domande come questa, però. Molte tecnologie hanno i propri newsgroup, e digeriti e forum di posta elettronica, ma qui posso trovare molto più facilmente informazioni. Se avessi iniziato un nuovo progetto, farei SO il sito Q & A ufficiale. –

2

Firebug utilizza jsdIDebuggerService che è un servizio di debugger.

Questa pagina contiene informazioni su firebug internals e un collegamento al codice sorgente. Non specifica esattamente tutti i dettagli ma dovrebbe fungere da punto di partenza.