En el pasado hacer debug de Javascript era terrible ya que no existían las herramientas como Firebug que tenemos en nuestro día a día, por lo que desarrollar en Javascript era una tortura, en la actualidad las diferentes consolas de los navegadores nos muestran mejor el camino que está siguiendo nuestra aplicación.
Consejos para hacer debug de Javascript
Veamos a continuación algunas cosas que debemos tener en cuenta cuando queremos hacer debug de nuestro código Javascript, recordemos que este es el lenguaje en el que está AngularJS por lo que tienen relación directa:
- Es imperativo trabajar con las versiones no comprimidas o minificadas de los archivos JS, ya que de esta forma tendremos acceso a la línea correcta del código en el cual se presenta el error, además que contaremos con los nombres correctos de las variables donde algunas herramientas nos pueden dar información más detallada del error.
- Por motivos de conveniencia lo ideal es mantener el código JS en archivos separados del archivo HTML que los ejecuta, haciendo que nuestro código sea más manejable.
- El uso de Breakpoints y de la herramienta Pause on all Exceptions nos ayudan a detener la aplicación cuando ocurre un error, con ello lograremos aislar de forma más rápida el problema, y así buscar la solución pertinente.
Herramientas de debug
Como mencionamos al inicio no existían en el pasado herramientas que nos permitieran evaluar nuestro código Javascript de una forma adecuada, con los navegadores modernos tenemos casi siempre disponible una consola donde podemos ver el comportamiento del Javascript, por ejemplo en Google Chrome tenemos las herramientas de desarrolladores que podemos obtener al presionar la tecla F12.
Sin embargo para ver el curso de nuestra aplicación hecha en AngularJS tenemos una herramienta aún más poderosa llamada Batarang, que al instalarla nos permite ver el estado actual de nuestra aplicación, revisar los pases de llamados entre los controladores y modelos, entre otras funcionalidades.
Adicionalmente a todo esto Firebug también es una herramienta importante, ya que nos permite obtener información de los llamados Ajax y las diferentes variables o parámetros que se pasan durante estos.
Con esto finalizamos este tutorial, hemos descubierto varias herramientas que están disponibles para nosotros para hacer desarrollo de nuestras aplicaciones en AngularJS y tener el control de como ver la información cuando ocurren los errores en la misma.