Hoy vamos a ver cómo listar los archivos modificados en un commit de GitHub desde la interfaz web, no desde la línea de comandos.

Cuando estamos en github.com podemos ver un commit que muestra los archivos modificados o creados, pero no los muestra en forma de lista para copiar y pegar.

En este post te mostraré cómo obtener la lista de la ruta completa de los archivos creados o modificados en ese commit, usando la consola de depuración.

Nota: seguramente esto se puede hacer desde la línea de comandos, pero veamos cómo hacerlo con JavaScript desde el navegador.

Analizando ruta de archivo modificado

Si abrimos el inspector de elementos vemos que el elemento que tiene la ruta del archivo del commit tiene las clases Link--primary y Truncate-text.

Entonces debemos obtener todos los elementos con querySelectorAll y luego listar el contenido del texto.

Lista completa de archivos modificados en commit

Obtenemos la lista con:

document.querySelectorAll(".Link--primary.Truncate-text")

Luego necesitamos crear un arreglo que se pueda mapear, para esto usamos Array.from y convertimos la colección de elementos a un arreglo.

Lo que resta es mapear ese arreglo, para convertir cada elemento HTML a una cadena.

Y luego necesitamos convertirlo de vuelta a cadena, imprimiendo esa cadena en la consola:

console.log(Array.from(document.querySelectorAll(".Link--primary.Truncate-text")).map(elemento => elemento.textContent).join("\n"));

Si yo ejecuto ese código desde la consola de depuración del navegador en un commit, aparece el siguiente listado:

app/Http/Controllers/ReporteController.php
app/Models/CancionSolicitada.php
resources/views/reportes/index.blade.php
resources/views/reportes/pdf.blade.php

Tú puedes mejorar el script, hacerlo más legible o lo que quieras. Yo lo dejé así para que sea fácil copiar y pegar en la consola.

Conclusión

Si te preguntas por qué hice ese fragmento de código es porque me parece interesante cómo podemos extraer varias cosas con JavaScript mapeando y trabajando con cadenas.

Además, a veces mis clientes necesitan que les indique cuáles archivos modifiqué y me da pereza hacer el listado manualmente, sobre todo cuando son varios archivos modificados.

Acá te dejo más tutoriales de JavaScript.