Nota:
El acceso a esta página requiere autorización. Puede intentar iniciar sesión o cambiar directorios.
El acceso a esta página requiere autorización. Puede intentar cambiar los directorios.
Estas son las características más recientes de DevTools de la versión estable de Microsoft Edge.
Vídeo: Microsoft Edge | Novedades de DevTools 101
La herramienta Consola ya está disponible en Visual Studio Code
La Consola es una de las herramientas más populares de DevTools. Ahora puede acceder a la herramienta Consola en la extensión Microsoft Edge Developer Tools para Visual Studio Code. Esta consola de DevTools integrada le permite ver los mensajes de registro junto al código. Con la consola, también puedes:
- Prueba algunas instrucciones de JavaScript.
- Obtener acceso al objeto window.
- Llame a los métodos del
Consoleobjeto, como se describe en Referencia de la API del objeto de consola. - Utilice las utilidades de la Consola para tener acceso al DOM, tal como se describe en Funciones y selectores de utilidades de la herramienta de consola.
Puede usar la Consola como herramienta principal, o usarla junto con las herramientas Elementos y Red .
La herramienta Consola se abre en la barra de herramientas principal de la extensión Microsoft Edge DevTools para Visual Studio Code:
La herramienta Consola abierta en el cajón de la extensión Microsoft Edge DevTools para Visual Studio Code:
Para obtener más información, consulte Integración de la consola.
Los mapas de origen ahora se almacenan en caché con IndexedDB
En versiones anteriores de Microsoft Edge, si hospedaba archivos de mapa de origen grandes en el servidor o en el servidor de símbolos de Azure Artifacts, DevTools capturaría estos mapas de origen cada vez que se actualizara la página. La captura de estos mapas de origen repetidamente creaba más solicitudes de red para DevTools y ralentizaba la depuración.
En Microsoft Edge 101, DevTools almacena en caché los mapas de origen mediante IndexedDB. Al actualizar la página, los mapas de origen ahora se sirven desde la caché de IndexedDB, en lugar de volver a solicitarse desde el servidor o el servidor de símbolos de Azure Artifacts. Use la columna Estado de carga de la herramienta Monitor de mapas de origen para comprobar que los mapas de origen se cargan desde la memoria caché. Para borrar la caché de IndexedDB y forzar a DevTools a volver a cargar los mapas de origen, ejecute el comando Borrar caché de mapas de origen en el menú de comandos.
La primera vez que carga la página web, la herramienta Monitor de mapas de origen muestra que los mapas de origen aún no se almacenan en caché:
Al volver a cargar la página web, la herramienta Monitor de mapas de origen muestra que se utilizan los mapas de origen almacenados en caché:
Seguimiento de solicitudes de red pendientes al exportar archivos HAR
En Microsoft Edge 101, se ha agregado la nueva columna de texto Estado a la herramienta Red . La columna de texto Estado proporciona mensajes equivalentes legibles para los códigos de estado HTTP que se notifican en la columna Estado .
Además, se ha agregado una nueva configuración a la herramienta Red: Incluir solicitudes pendientes en el archivo HAR. Si necesita registrar solicitudes de red pendientes al exportar un archivo HAR en la herramienta Red, active la opción Incluir solicitudes pendientes en el archivo HAR . La columna de texto Estado incluirá ahora el estado (pendiente) de las solicitudes de red pendientes.
Para obtener más información sobre las columnas disponibles en el registro de solicitudes, consulte Referencia > de características de red Agregar o quitar columnas.
Interfaz de usuario actualizada y controles de cámara en la vista 3D
En Microsoft Edge 101, la herramienta Vista 3D tiene dos nuevos botones: Vista panorámica (
y la vista Girar (
Use estos botones para alternar entre el desplazamiento panorámico por el lienzo o girar el lienzo. Haga clic en el botón Vista panorámica o Vista giratoria y arrastre en la dirección deseada con el ratón o use las teclas de dirección.
La interfaz de usuario ahora proporciona una experiencia más uniforme e intuitiva. Los paneles están organizados de forma más clara y se han corregido los problemas de accesibilidad.
Consulte Navegar por las capas de página web, índice z y DOM mediante la herramienta Vista 3D.
Cambiar de tema ya no requiere volver a cargar DevTools
En versiones anteriores de Microsoft Edge, cambiar de tema en DevTools requería volver a cargar DevTools para aplicar el nuevo tema. En Microsoft Edge 101, puede probar rápidamente diferentes temas sin tener que volver a cargar DevTools.
Anuncios del proyecto de Chromium
Microsoft Edge 101 también incluye las siguientes actualizaciones del proyecto de Chromium:
- Ver capas en cascada en el panel Estilos
- Compatibilidad con la función de color hwb()
- Se ha mejorado la visualización de las propiedades privadas.