extension - Herramientas de desarrollo de Chrome: modifique javascript y vuelva a cargar

depurar javascript chrome

Question

¿Es posible modificar el JavaScript de una página y luego volver a cargar la página sin volver a cargar el archivo JavaScript modificado (y perder así las modificaciones)?

Answer 1

Buenas noticias, la solución está disponible en marzo de 2018, consulte este enlace: https://developers.google.com/web/updates/2018/01/devtools

Las "Anulaciones locales" le permiten realizar cambios en DevTools y mantener esos cambios en las cargas de página. Anteriormente, cualquier cambio que realizara en DevTools se perdería al volver a cargar la página. Las Anulaciones locales funcionan para la mayoría de los tipos de archivos.

Cómo funciona:

• Usted especifica un directorio donde DevTools debe guardar los cambios. Cuando realiza cambios en DevTools, DevTools guarda una copia del archivo modificado en su directorio.
• Cuando vuelve a cargar la página, DevTools sirve el archivo local modificado, en lugar del recurso de red.

Para configurar anulaciones locales:

1. Abra el panel de Fuentes.
2. Abra la pestaña Overrides.
3. Haga clic en Preferencias de configuración.
4. Seleccione en qué directorio desea guardar sus cambios.
5. En la parte superior de su ventana gráfica, haga clic en Permitir para dar a DevTools acceso de lectura y escritura al directorio.
6. Haz tus cambios ".

ACTUALIZACIÓN (19 de marzo de 2018): se trata de explicaciones en vivo y detalladas aquí: https://developers.google.com/web/updates/2018/01/devtools#overrides

Answer 2

Esto es un poco complejo, pero una forma de lograr esto es agregar un punto de interrupción al inicio del archivo o bloque de JavaScript que desea manipular.

Luego, cuando vuelva a cargar, el depurador se detendrá en ese punto crítico y podrá realizar los cambios que desee en el origen, guardar el archivo y luego ejecutar el depurador mediante el código modificado.

Pero como todo el mundo ha dicho, la próxima vez que vuelva a cargar los cambios desaparecerán, al menos le permitirá ejecutar un lado del cliente JS ligeramente modificado.

Answer 3

La extensión Override Resource le permite hacer exactamente eso:

• crea una regla de archivo para la url que deseas reemplazar
• edite el js / css / etc en la extensión
• recarga tantas veces como quieras :)

Answer 4

Sé que no es el único que responde la pregunta precisa (Herramientas de desarrollo de Chrome) pero estoy usando esta solución con éxito: http://www.telerik.com/fiddler

(bastante seguro que algunos de los desarrolladores web ya conocen esta herramienta)

1. Guarde el archivo localmente
2. Edite según sea necesario
3. ¡Lucro!

Documentos completos: http://docs.telerik.com/fiddler/KnowledgeBase/AutoResponder

PD. Prefiero tenerlo implementado en Chrome como un indicador de preserve after reload , no puedo hacer esto ahora, foros y grupos de discusión bloqueados en la red corporativa :)

Answer 5

Sí, solo abra la pestaña "Fuente" en las herramientas de desarrollo y navegue hasta la secuencia de comandos que desea cambiar. Realice sus ajustes directamente en la ventana de herramientas de desarrollo y luego presione ctrl + s para guardar la secuencia de comandos; sepa que las nuevas js se usarán hasta que actualice toda la página.