Acceder al scope de AngularJS desde la consola del navegador

Acceder al scope de AngularJS desde la consola del navegador

Hoy he necesitado hacer unas pruebas y correcciones en el código de un proyecto pero no tenía acceso a la VPN, así que no podía entrar ni a los entornos de pruebas ni al repositorio de código.

Se trataba de una aplicación hecha con AngularJS, así que se me ha ocurrido que, al ser Javascript, a lo mejor podía acceder a las variables desde la consola y hacer las pruebas directamente desde el navegador.

Un tal Michal hablaba de cómo obtener referencias al $scope en esta entrada de su blog. Siguiendo sus ejemplos he conseguido lo que necesitaba, así que lo dejo aquí por si a alguien le sirve:

Una cosa que no sabía es que AngularJS añade a jQuery algunas opciones y utilidades, como la que vais a ver a continuación. Podemos obtener el nodo jQuery del que queremos sacar el $scope, y luego llamar a su método scope, que ha sido añadido por Angular para facilitarnos la vida. Veamos:

Otra forma de conseguir el $scope es utilizar la función element de AngularJS, que espera el nodo asociado. Este parámetro podemos pasarlo de distintas formas, como por ejemplo:

Una vez lo tenemos podemos, por ejemplo, modificar una función de validación para que diga que los datos siempre son correctos:

Leyendo la documentación seguro que hay muchas más cosas interesantes para contar, pero eso ya lo dejo para otro día.

Hasta la próxima! 🙂