• Joe Hewitt (Leden 2006)
  • Open Source od Prosince 2006
  • Vývoj ukončen ~ Květen 2007
• Firebug Working Group (Listopad, 2007)
  • John J. Barton (IBM)
  • Steve Souders (Google)
  • Jan Odvarko (Mozilla)
  • Rob Campbell (Mozilla)
  • Další...
• Výjimečná komunita (programátoři)

• Integrace s Firefoxem
  • Vždy připraven!
  • Reflexe HTML, CSS
  • HTML/CSS Inspektor
• Firebug Lite
  • Podpora pro ostatní prohlížeče
  • Javascript Injection/Bookmarklet
  • Omezené funkce debugger

• Současná verze: Firebug 1.4.3 (AMO)
• Beta: Firebug 1.5 (getfirebug.com/releases)

• Firebug = JavaScript + XUL + HTML

• Debugging
  • Statické skripty
  • Dynamické skripty
    eval("{java-script-source}")
  • Skripty Událostí
• Debug Tools
  • Profiler
  • Watch panel (hodnoty proměnných)
  • Call Stack (pořadí volání funkcí)
• Break On Next + Breakpoints

• Konzole
  • Logování chyb, varování, XHR
  • Break On Error
  • Vlastní šablony pro logy extensions
Error Warning XHR
• Příkazová řádka
  • Vykonání JS v kontextu stránky.
  • Připravené API
    $(elem-id), $$(css-selector), cd(iframe), ...
  • Vlastní API extensions

• Editace, okamžitá změna stránky
• Break On Property Change
• Seznam definovaných funkcí

• Editace CSS (okamžitá změna stránky)
• HTML Debugging
• Break on Mutation
  • Změna atributu
  • Nový element
  • Smazaný element

• Seznam dotazů vykonaných stránkou + detaily
• JSON Explorer
• XML Explorer
• Další: WDDX Explorer (Web Distributed Data eXchange)?
• Exportování HTTP Logů:
  • NetExport Extension
  • HTTP Archive 1.1 (HAR)

• groups.google.com/group/http-archive-specification

• Break on XHR
• Podmíněné breakpointy
  • Hodnota URL parameteru
    

    'param-name' == 1

  • Poslaná data
    

    $postBody.indexOf("keyword")

• ~30 rozšíření pro Firebug!
• Zajímavá platforma pro vývojové nástroje
• Chromebug: Debugger pro Firefox rozšíření
• YSlow: Analýza rychlosti nahrávání webových stránek
• Firecookie: Správa & debugging cookies
• FirePHP: PHP logování (server)
• Rainbow: Barevná syntaxe pro JavaScript
• NetExport: Export HTTP logů do *.har souboru
• Ostatní: getfirebug.com/extensions

• Jak debugovat Firebug?
• Stejné funkce, avšak aplikované na Firefox rozšíření
• Kontext: Firefox window
• Run: firefox.exe -chromebug
• Firebug musí být instalovaný

FBL.ns(function() { with (FBL) {

function HelloWorldPanel() {}
HelloWorldPanel.prototype = extend(Firebug.Panel,
{
    name: "HelloWorld",
    title: "Hello World!",

    initialize: function() {
      Firebug.Panel.initialize.apply(this, arguments);
    },

    destroy: function(state) {
        Firebug.Panel.destroy.apply(this, arguments);
    }
});

Firebug.registerPanel(HelloWorldPanel);

}});

• Lepší podpora pro Firebug eko-system (testování, dokumentace, bundles)
• Memory panel, GC události, closures
• Break on CSS, Break On...
• Validace Stránky
• Debuggger: Krok zpět
• Uložení změn, undo & redo, FireDiff extension
• Události EventBug extension
• Storage panel (local storage, session storage, globalStorage, lokální databáze)