Escribir código es fácil, lo difícil es entender por qué no funciona.
Este capítulo del bloque de sintaxis básica aborda la depuración de código escrito en Node.JS desde VSCode.
En esencia, no es materia que se pueda adscribir al bloque de sintaxis básica, pero creo que es bueno que conozcas cómo depurar programas antes de abordar el último capítulo del bloque, donde se definen ejercicios que cubren las materias de la unidad.
Saber depurar te permite seguir la secuencia de ejecución del código y conocer el valor asignado a constantes y variables, así como también poder alterar dichos valores. Saber depurar te permitirá solucionar errores en el código del modo más rápido posible.
En síntesis, saber depurar te permitirá sortear una barrera que todo programador serio debe haber superado antes de llegar a serlo.
Índice
- El programa a depurar
- El depurador integrado
- El terminal de depuración de JavaScript
- Configuración de depuración en VSCode
- Lo que hemos conseguido
- A continuación
El programa a depurar
Este capítulo va a tomar como base un sencillo programa escrito en Node.JS que define constantes, variables, realiza una operación con ellas y muestra el resultado por pantalla:
const operando1 = 3
const operando2 = 5
let resultado
console.log("Resultado antes de la operación: " + resultado)
resultado = operando1 + operando2
console.log("Resultado tras la operación: " + resultado)
Como dijimos en el capítulo dedicado a VSCode, es buena idea crear una estructura de directorios clara donde ir guardando nuestro código en general y el código de este curso en particular. Te recomiendo guardar el código anterior en este directorio:
# Jerarquía de directorios sugerida
dev
|_ node
|_ aprendiendo-node
|_ 02
|_ depuracionVSCode
Una vez creado el directorio, ábrelo en VSCode, crea un archivo index.js, agrega el código anterior y guárdalo, tal como se muestra en el siguiente vídeo:
El depurador integrado
Como vimos en el capítulo de introducción a Node.js, la ejecución de los programas Node.JS escritos en VSCode se basa en ejecutar el runtime node en un terminal.
Sin embargo, también es posible ejecutarlos y depurarlos utilizando el depurador de Node.js que integra nativamente VSCode. Para ello basta con tener nuestro programa abierto en una ventana, acceder al menú "Ejecutar" y seleccionar las opciones "Iniciar depuración" o "Ejecutar sin depuración".
En detalle, para depurar un programa escrito en Node.JS y ejecutado por el runtime node desde VSCode usando el depurador integrado, debemos:
- Abrir la consola de depuración a través del menú "Ver" si el programa usa la consola para leer o escribir datos.
- Agregar un punto de interrupción en la línea del programa en la que queremos comenzar a depurar.
- Seleccionar la opción "Iniciar depuración" o "Ejecutar sin depuración" del menú "Ejecutar".
El proceso se muestra en el siguiente vídeo:
El depurador de VSCode soporta la mayoría de funcionalidades disponibles en los depuradores actuales:
- Permite establecer puntos de interrupción convencionales y también condicionales.
- Permite ejecutar instrucción a instrucción, opcionalmente considerando las funciones como una instrucción y, por tanto, sin depurar su contenido.
- Permite consultar y modificar el valor de constantes y variables.
También tiene ciertas limitaciones, por ejemplo, la de no poder omitir la ejecución de instrucciones.
El siguiente vídeo muestra tanto las funcionalidades anteriormente enumeradas como sus limitaciones:
El terminal de depuración de JavaScript
Otro modo de depurar nuestro programa es ejecutarlo en un terminal JavaScript Debug Terminal de VSCode, que nos permite depurar nuestro código Node.JS ejecutado por el runtime node.
Lo hemos repetido varias veces durante el curso, pero no cuesta nada volver a hacerlo: Node.JS no es un lenguaje de programación, sino un motor de ejecución de código Javascript, de modo que no debe sorprenderte el hecho de utilizar un terminal JavaScript Debug Terminal para depurar código Node.JS.
Volviendo a nuestro tema, para depurar un programa escrito en Node.JS y ejecutado por el runtime node desde VSCode, debemos:
- Abrir un terminal de tipo JavaScript Debug Terminal (a través del menú "Ver" y la opción "Terminal", seleccionando a continuación un terminal de tipo "JavaScript Debug Terminal").
- Agregar un punto de interrupción en la línea del programa en la que queremos comenzar a depurar.
- Ejecutar
node <nombre de archivo>(onode .si el archivo se llamaindex.js) en el terminal JavaScript Debug Terminal.
El siguiente vídeo muestra cómo se crea un punto de interrupción en la primera línea de nuestro programa. A continuación, se intenta depurar el programa ejecutando node . desde un terminal convencional, pero como era de esperar el depurador no funciona. Finalmente, se abre un terminal de tipo JavaScript Debug Terminal y se vuelve a ejecutar node ., y esta vez VSCode sí es capaz de depurar el programa, que se ejecuta paso a paso hasta el final.
Configuración de depuración en VSCode
VSCode nos permite crear configuraciones de depuración para nuestros programas.
En la mayoría de los casos, estas configuraciones nos van a permitir ejecutar y depurar nuestro programa de un modo aún más integrado si cabe, pero su verdadera utilidad se manifiesta al permitirnos, por ejemplo, definir tareas previas o posteriores a la ejecución de nuestro programa, pasarle argumentos por línea de comandos o declarar una serie de variables de entorno que únicamente estarán disponibles para él.
VSCode busca las configuraciones de depuración en un archivo llamado launch.json almacenado en el subdirectorio .vscode de nuestro directorio de trabajo.
Este archivo puede crearse manualmente o permitir que VSCode lo cree por nosotros, como muestra el siguiente vídeo que, además, muestra cómo se pueden utilizar las configuraciones de depuración una vez creadas.
La configuración mínima para poder ejecutar y depurar un programa con el runtime node es esta:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Ejecutar programa",
"program": "${workspaceFolder}/index.js"
}
]
}
Este archivo define una única configuración para depurar programas ejecutados por el runtime node ("type": "node"). Para ello ejecuta una instancia del runtime ("request": "launch") para ejecutar el programa index.js ("program": "${workspaceFolder}/index.js"). Esta configuración se mostrará en VSCode con la descripción "Ejecutar programa" ("name": "Ejecutar programa"), descripción que queda totalmente a elección del usuario.
Las posibilidades de las configuraciones de depuración son amplísimas y escalan más allá del alcance de este capítulo. Si estás interesado en conocer algunas, puedes encontrar la información de referencia en la ayuda online de VSCode.
Lo que hemos conseguido
En este capítulo has aprendido a depurar programas Node.JS en VSCode de distintos modos: a través del depurador integrado y del terminal de depuración de JavaScript.
También has aprendido a establecer puntos de interrupción genéricos y condicionales, y cómo ejecutar instrucciones paso a paso, continuar con la ejecución del programa o abortar su ejecución.
Finalmente, has aprendido a crear configuraciones de depuración, algo que quizás no necesites utilizar todavía, pero que antes o después emplearás.
Con estos conocimientos, ahora eres capaz no solo de ejecutar cualquier programa de Node.JS, sino también de depurarlo para encontrar y resolver los problemas que tenga del modo más rápido posible.
A continuación
El próximo capítulo, último de esta unidad, contiene una serie de ejercicios para consolidar los conocimientos aprendidos. Aunque es opcional, te recomiendo encarecidamente que lo abordes con el mayor interés posible.