Fonctionnalités générales :
Firebug est un débogueur très utile pour mettre au point les sites web évolués. Il permet de passer aisément de la structure de la page web (code HTML) à la présentation (CSS) ou au comportement (JavaScript) : lorsqu’elle est activée (on peut l’activer pour certains sites seulement), une icône en bas à droite de l’écran indique s’il y a des erreurs javascript. Un double-clic sur cette icône ouvre deux cadres au bas de la page, avec un menu permettant d’activer les principales fonctionnalités :
- Le débogueur JavaScript permet de poser des points d’arrêt, suivre des expressions (variables locales ou globales), exécuter le code pas à pas, etc.
- Le bouton ‘inspect’ permet de lire la structure de la page web : on peut développer certains nœuds seulement, ce qui a l’avantage de faciliter la navigation à l’intérieur de la page en s’appuyant sur la structure du document. L’élément survolé par la souris est mis en valeur sur la page principale. Un clic sur le nom d’un élément affiche à droite de l’écran les propriétés de style correspondantes, avec l’indication des propriétés héritées, supprimées par héritage, et même des propriétés définies dans l’élément lui-même.
- Les styles s’appliquant à la sélection sont visualisés en cascade, du plus spécifique au plus général, avec pour chacun d’eux le nom du fichier CSS source associé. Cela permet de comprendre facilement les effets d’héritage, imbrication et cascade propre aux CSS, de localiser rapidement l’attribut de style à l’origine d’une anomalie, etc.
- Si un script modifie la structure ou la présentation, ces modifications sont immédiatement reflétées dans les fenêtres HTML ou CSS.
- Inversement, une modification dans la fenêtre HTML ou CSS est aussitôt répercutée dans la page web visualisée : très pratique pour tester l’effet d’un style ou d’une balise.
Limitations, difficultés, fonctionnalités importantes non couvertes:
Le débogueur JavaScript visualise la pile d’appels uniquement sur la barre du cadre Firebug, ce qui est assez limité.
