Firebug 0.4, immár beépített debuggerrel
Firebug: JavaScript debugger is
A Firebugról korábbi bejegyzéseim során már leírtam, hogy a Firefoxot használó webfejlesztőnek egy igen kedvező lehetőséget kínál az aktuális oldal HTML és CSS-ének áttekintésére, s bele is lehet segítségével nyúlni az adott oldal adataiba, vagy le tudjuk kérdezni azokat. Eddig is elmondhattuk, hogy egy olyan eszköz, mely egyedülálló a munkánkat támogató lehetőségeink között.
Nos, az új verzió, mely ezúttal új logóval is jelent meg, ezen az úton továbblépett, s megint csak lehet a lehetőségeinek egy külön blogbejegyzést szánni. A kétségkívül legfontosabb újdonsága, hogy immár beépített debuggerrel rendelkezik. A használata rendkívül egyszerű, a Firebug felnyíló interfészén egy új fület kaptunk, ahol az oldalhoz tartozó összes JavaScript kód forrást megtekinthetjük, továbbá az egyes soraihoz töréspontokat rendelhetünk. Következő alkalommal, amikor lefut az adott rész, a végrehajtás meg fog állni, s nekünk utána lehetőségünk lesz akár soronként végrehajtani az adott JavaScript forrás részletet. E mellett az aktuális változókról egy listát is láthatunk. Amilyen egyszerűen hangzik a dolog, olyan hasznosnak bizonyul - eddig a Venkman kiterjesztés segítségével ugyan volt lehetőségünk ugyanerre, de itt a felhasználói interfész sokkal jobban ki van találva, s a hatékonysága is sokkal jobb, mint a Venkman esetén (a Venkmant sohasem sikerült megszoknom - nem is használom -, a Firebug debuggere viszont "szerelem első látásra").
Azért jöttek további újdonságok is, melyek szintén elég hasznosak. Ilyen, hogy ha egy JavaScript hiba történik, akkor nem csak maga a hibaüzenet jelenik meg, hanem le tudjuk kérdezni, hogy mely függvényeken keresztül, hogyan jutott el a program az adott hibáig. Ha bekapcsoljuk a "Break on Errors" szolgáltatást, akkor a debugger az adott hibás sorra fog ugrani, s megtekinthetjük az éppen aktuális változókat is - valószínűleg sok hasznos információhoz jutva ezáltal.
Végül pedig még egy új lehetőség: az eddigi általunk definiálható
printfire
függvény által biztosított logolási lehetőség le lett cserélve, s immár nem kell deklarálni, hanem egyből meghívható egy console
nevű objektumon log
, vagy akár debug
, info
, warn
vagy error
függvénye, melyek kis ikonnal, vagy nélküle vesznek fel új konzol bejegyzést.Kisebb további fejlődések is vannak, érdemes elolvasni a bejelentést, illetve a dokumentációt.
A bejelentő blogbejegyzésben azt hiszem, hogy nem véletlenül tettek már többen is "szerelmi vallomást" Joe Hewittnak...
isten
Js
Nincs
Js konzol
JS konzol vs. JS debugger
A beépített JavaScript konzol, és a Firebug konzola egyáltalán nem ugyanaz. A Firebug segítségével összetett változókat, HTML darabokat is át tudsz tekinteni, próbáld meg beírni például mindkettőbe, hogy
document.body
- teljesen más lesz a végeredmény. Aztán a Firebug konzola segítségével követni tudod az XMLHttpRequest kommunikációt, hogy mi ment el, s mi jött vissza. Ezen kívül pedig ott vannak aconsole.log()
és társai, melyekkel te magad tudsz a programodból üzenetek, változó értékeket küldeni a konzolra, vagy éppen megmérni egy adott kódrészlet végrehajtási idejét.A felhasználóbarátság terén pedig arra gondoltam, hogy a Venkman debugger közel sem volt ennyire egyszerűen használható és gyors, mint a Firebug debuggere. Az, hogy a weblap és a debugger ablak egymás mellett, és nem mögött van, már az egy hatalmas segítség: hiszen úgy tudok az oldallal felhasználói interakcióba lépni, hogy közben látom a debuggert is (és ez fordítva is igaz).
Nézted te egyáltalán, hogy mire jó a Firebug? ;)
Részben :)
Bemutató
http://www.digitalmediaminute.com/screencast/firebug-js/