Cambios: Realice un seguimiento de los cambios que realizó en HTML, CSS y JavaScript

Sofia Emelianova
Sofia Emelianova

Usa el panel Changes para hacer un seguimiento de los cambios de código realizados en Herramientas para desarrolladores.

Descripción general

En el panel Cambios, realiza un seguimiento de los cambios que realizas en los siguientes elementos:

En el panel Changes, solo se muestran los cambios que realizas en las Herramientas para desarrolladores. Si vuelves a cargar Herramientas para desarrolladores o tu página, los cambios desaparecerán.

Para hacer que las Herramientas para desarrolladores conserven los cambios en todas las cargas de páginas, sigue los pasos que se indican en Anulaciones locales.

Para hacer que las Herramientas para desarrolladores escriban cambios en tus fuentes locales, sigue los pasos que se indican en Edita y guarda archivos con espacios de trabajo.

Abrir el panel de cambios

Para abrir el panel Cambios, haz lo siguiente:

  1. Abre Herramientas para desarrolladores.

  2. Presiona Comando + Mayúsculas + P (Mac) o Control + Mayúsculas + P (Windows, Linux y ChromeOS) para abrir el menú de comandos.

  3. Comienza a escribir changes, selecciona Show Changes y presiona Intro.

    Ejecuta el comando Show Changes

Como alternativa, en la esquina superior derecha, haz clic en Personalizar y controlar Herramientas para desarrolladores > Más herramientas > Cambios.

Opción de cambios enfocada en el menú desplegable Más herramientas

De forma predeterminada, Herramientas para desarrolladores muestra el panel Cambios en la parte inferior de la ventana de Herramientas para desarrolladores, en el panel lateral.

Consulta y comprende tus cambios

Para ver los cambios, sigue estos pasos:

  1. Abre Herramientas para desarrolladores.
  2. Realiza cambios en las fuentes:

  3. Abre el panel Cambios y selecciona un archivo en el lado derecho del panel.

  4. Observa un resultado diff que destaca lo siguiente:

Diferencia destacada en el panel de cambios

El panel Changes imprime el resultado de diff automáticamente, por lo que no tienes que desplazarte horizontalmente para ver los cambios en una sola línea.

Copiar cambios de CSS

Si hiciste cambios en el CSS en Elementos > Estilos, puedes copiarlos todos con un solo botón:

  1. Abre el panel Cambios y, en la parte derecha del panel, selecciona el archivo CSS en el que realizaste cambios.

    Copiar.

  2. Haz clic en el botón Copiar. Copiar que se encuentra en la parte inferior del panel de cambios.

Cómo revertir todos los cambios realizados en un archivo

Para revertir los cambios realizados en un archivo, sigue estos pasos:

  1. En el lado izquierdo del panel Cambios, selecciona un archivo con cambios que desees revertir.
  2. En la barra de acciones de la parte inferior, haz clic en Deshacer Revertir todos los cambios en el archivo actual.

Botón para revertir