Depurando JavaScript con Visual Studio .NET 2003

Hola!

Cuando desarrollamos una aplicación ASP.NET, nos podemos encontrar con la necesidad de depurar código JavaScript para ver si lo hemos implementado correctamente. Con Visual Studio 2003 (y con 2005 también) podemos hacerlo de una forma muy sencilla. En este artículo veremos cómo podemos hacerlo.

Para depurar código JavaScript se
puede utilizar el Visual Studio .NET 2003. Antes hay que hacer un par de pasos
previos:

  1. Ir al escritorio, botón derecho sobre el icono de
    Internet Explorer, seleccionar Propiedades (esto es lo mismo que en una ventana
    del IE ir a Herramientas -> Opciones de Internet).
  2. Seleccionar la pestaña Opciones Avanzadas.
  3. En el árbol que aparece, bajo el apartado Examinar,
    deseleccionar los checks “Deshabilitar la depuración de secuencias de comandos
    (Internet Explorer)” y “Deshabilitar la depuración de secuencias de comandos
    (otros)”.

Con esto tenemos configurado el IE para que cuando se
produzca un error en Javascript nos pregunte si queremos depurar.

El siguiente paso es abrir el IE, y abrir el Visual
Studio 2003. En el menú Herramientas, seleccionar la opción
“Procesos de depuración…” (Ctrl+Alt+P)” y en la
lista de procesos que aparece, debemos buscar el proceso IEXPLORE.EXE. Si
tenemos varios IE abiertos, examinad la columna que indica el título de la
ventana (es la tercera, se llama Título).

Seleccionad el proceso a depurar haciendo doble
click, y os aparecerá una ventana en la que se puede elegir qué queremos
depurar. Aseguraos de que la útlima opción está marcada (“Script”), y para
cerrar la ventana del tipo de depuración, pulsad en Aceptar.

El proceso seleccionado se añadirá a la lista
inferior de la ventana de la lista de procesos. Podemos cerrar esta ventana
pulsando el primer botón de la derecha (Cerrar).

Cuando depuramos el IE, podemos ver una lista de los
documentos html que tiene cargados en ese momento y ver el código HTML y
JavaScript de los mismos si abrimos la ventana “Documentos en ejecución”. Para
ello, vamos al menú Depurar, seleccionamos la opción Ventanas, y entre la lista
de las ventanas a mostrar seleccionamos “Documentos en ejecución”. Normalmente
aparecerá en la parte de la derecha, donde está el Explorador de Soluciones. Si
hacemos doble click en cualquiera de los documentos HTML que tenga cargados,
podremos introducir puntos de ruptura (Breakpoints), y cuando se alcancen,
podremos depurar.

Otra opción es la de hacer saltar al depurador cuando
nosotros deseemos, sin poner un punto de ruptura explícitamente. Esto se
consigue escribiendo “debugger;” (sin las comillas) en nuestro código
JavaScript. Cuando a ejecución llegue a esa línea, si estamos depurando el IE,
saltará automáticamente al depurador. Ojo, aseguraos de que las llamadas al
depurador no estén en la versión final, ya que lo que hace esto es producir una
excepción que el depurador entiende. Los usuarios finales verán un mensaje de
error en la pantalla si dejamos la línea “debugger;”.

Por cierto, esta misma técnica la podemos utilizar para depurar páginas ASP (ojo, ASP del antiguo, no ASP.NET). En este caso, el proceso que tenemos que depurar es inetinfo.exe si la aplicación se está ejecutando con protección de aplicación (App. Isolation) Bajo (se ejecuta en el mismo proceso del IIS). Si usamos otra protección de aplicación, el proceso a depurar será un dllhost.exe, que podremos identificar por la columna Tipo de la lista de procesos (deberá tener un tipo “Script”).

Pues esto es todo por hoy. Saludos!

6 comentarios sobre “Depurando JavaScript con Visual Studio .NET 2003”

  1. Muy buen artículo Augusto a mas de uno le vendrá de perl. La verdad es que ya lo conocía porque lo leí en un número de Dotnetmania (no recuerdo el número) que escribío Luis Miguel Blanco.

    Salu2

  2. Hey Augusto …
    q buena data !!! por lo gral no es necesario depurar JavaScript, ya tenemos varias implementaciones que hacen mucho trabajo por nosotros, pero siempre es bueno bajar un poco de nivel y pegarse con las llamadas, con el html document model y con esos juguetitos que tenemos en Javascript
    Felicitaciones, porq ademas lo explicas como me gusta a mi, simple y directo 😀

    Saludos

  3. Hola Bruno,

    Me pareció interesante contarlo, ya que gracias a AJAX, parece que el JavaScript se ha vuelto a poner “de moda”…

    Si usamos AJAX en una aplicación, puedes aprovechar para revisar en el cliente lo que te está llegando del servidor 😉

    Saludos!

  4. hola hola, me gusto mucho tu blog (disculpa que te tutee pero me senti identificado, espero no molestar) los contenidos son buenos y el diseño muy limpio e interezante, veo que le haz puesto mucha galleta a tu trabajo, te tengo una propuesta, he visto que estas inscrito en los premios 20blogs y la verdad no veo que tengas votos, tal como estoy yo jejeje, asi no tendremos posibilidad, te parece si me das un voto y yo uno a ti?? seria buen intercambio, mucha suerte y que gane el mejor, pasa a mi blog para avisar y para que pueda votarte, vale?? el boton esta aqui en mi blog http://blog.alamedianoche.com o si lo prefieres tambien entra directamente a la direccion http://www.20minutos.es/premios_20_blogs/busqueda/sanshiro/ y te da directo mi blog, tal vez asi tengamos mas posibilidades de ganar, por lo que veo si esta dificil n.n

    salud y rock

    atte. sanshirow

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *