unijimpe

Firebug es una de las mas populares herramientas para depurar websites, es muy completo y versátil pero solo esta disponible como complemento para Firefox. Entonces para los usuarios de Safari, Internet Explorer u Opera ahora esta disponible Firebug-Lite, el cual es un javascript que automáticamente analiza el html seleccionado y nos permite mediante utilizar la mayoría de las funcionalidades de Firebug.

Utilizar Firebug-Lite Online
El primer método y el mas sencillo es utilizar Firebug-Lite de forma Online, el cual no requiere ninguna instalación o código adicional y el cual se puede aplicar a cualquier web. Lo que tienes que hacer es agregar el siguiente enlace a barra de favoritos, este enlace contiene un Javascript que ejecutará de forma remota el script necesario para el funcionamiento de Firebug.

• Agregar a Favoritos: Firebug Lite

Utilizar Firebug-Lite Offline
La segunda forma servirá para el caso que estemos desarrollando la aplicación sin conexión a Internet. Para ello es necesario descargar los archivos fuente de esta librería: firebug-lite.js y pi.js. Además de ello es necesario un archivo firebug-lite.css que contiene la hoja de estilos para la consola de Firebug y finalmente una imagen firebug.gif.

Luego para ejecutar Firebug-Lite, es necesario agregar las librerías pi.js y firebug-lite.js al header el HTML que deseas analizar, en mi caso he puesto los archivos en la carpeta firebug con lo cual se tendría::

<script language="javascript" type="text/javascript" src="firebug/pi.js"></script>  
<script language="javascript" type="text/javascript" src="firebug/firebug-lite.js"></script>

Listo, abres el HTML en un Browser y automáticamente se abrirá Firebug no importando el navegador que estes utilizando. Hay que notar que para que funcione adecuadamente la versión Offline es necesario editar el archivo firebug-lite.js en la línea 18 en colocamos la ruta correcta al archivo firebug-lite.css.

new pi.element("link").attribute.set("rel","stylesheet").attribute.set("href","firebug/firebug-lite.css").environment.getElement()

Como pueden ver el utilizar esta librería esta aun click de distancia y ahora ya no estamos limitados a utilizar Firefox para realizar la depuración de nuestras aplicaciones. Finalmente les dejo los archivo fuente de como implementar la versión Offline de Firebug-Lite.

Posts Relacionados

• Box.net/lite
• Depurar Javascript utilizando console.log()
• YSlow plugin para Firebug
• Depurar Flash con Firebug
• Plugins Firefox para Desarrollo