Novedades de DevTools (Microsoft Edge 99)
Estas son las características más recientes de la versión estable de Microsoft Edge DevTools.
Vídeo: Microsoft Edge | Novedades de DevTools 99
Depuración segura del código de producción con mapas de origen desde el servidor de símbolos de Azure Artifacts
El servidor de símbolos de Azure Artifacts ahora admite el almacenamiento de los mapas de origen que genera el proceso de compilación al compilar, minificar y agrupar el código. En lugar de hospedar mapas de origen en el servidor público, ahora puede publicar los mapas de origen en el servidor de símbolos de Azure Artifacts seguro. A continuación, conecte DevTools al servidor de símbolos para que DevTools recupere automáticamente los mapas de origen.
Mediante el uso de mapas de origen, puede ver y depurar el código fuente original en DevTools, en lugar de tener que trabajar con el código de producción compilado, minificado y agrupado que devuelve el servidor. Hospedar los mapas de origen en el servidor de símbolos de Azure Artifacts le permite ver y trabajar con el código fuente de forma segura y privada, en lugar de colocar los mapas de origen en el servidor y revelar el código original públicamente.
Para probar esta característica:
- Publique los mapas de origen en el servidor de símbolos de Azure Artifacts.
- Abra elservidor de símbolosde configuración> de DevTools > y conecte DevTools al servidor de símbolos de Azure Artifacts; para ello, escriba la organización de Azure DevOps y el token de acceso personal.
Vea también:
- Asignar el código procesado al código fuente original para la depuración
- Depuración segura del código original mediante la publicación de mapas de origen en el servidor de símbolos de Azure Artifacts
- Depuración segura del código original mediante mapas de origen del servidor de símbolos de Azure Artifacts
Extensión Microsoft Edge DevTools para Visual Studio
Tras el éxito de la integración de Visual Studio Code, ahora también puede insertar las Herramientas de desarrollo de Microsoft Edge en Microsoft Visual Studio para depurar los proyectos de ASP.NET en directo. Descargue Microsoft Edge Developer Tools para Visual Studio y pruébelo.
Para probar esta característica:
- Asegúrese de que Visual Studio 2022 y la carga de trabajo ASP.NET están instaladas.
- Configure Web Live Preview como el Web Forms Designer predeterminado, tal como se describe en Herramientas de desarrollo de Microsoft Edge para Visual Studio.
- En un proyecto de ASP.NET, abra una página web del proyecto en la ventana Diseño .
- En la parte superior izquierda de la ventana Diseño , haga clic en el botón Open Edge DevTools (
):
Se abre Edge DevTools para Visual Studio, con la herramienta Elementos seleccionada:
La herramienta Red también está disponible de forma predeterminada:
La herramienta Inspeccionar (
) y Alternar pantallacast (
) están disponibles, y el menú Más herramientas (
) ofrece las herramientas Problemas, Condiciones de red y Bloqueo de solicitudes de red .
Vea también:
- Edge Developer Tools para Visual Studio (versión preliminar), en Visual Studio DevBlogs.
- Extensión Edge DevTools para Visual Studio.
Capas en la vista 3D
Desde Microsoft Edge 88, la herramienta Vista 3D ha proporcionado una versión mejorada de la herramienta Capas . Ahora, en Microsoft Edge 99, se ha quitado la funcionalidad de la herramienta Capas y, en su lugar, la herramienta Capas contiene un vínculo que le redirige a la vista Capas compuestas dentro de la herramienta Vista 3D . Puede encontrar todas las características que estaban anteriormente en la herramienta Capas , y mucho más, en la herramienta Vista 3D .
Actualización: la herramienta Capas ya se ha quitado.
Vea también:
Uso de los mapas de origen para mostrar nombres de función originales en perfiles de rendimiento
Actualizar: En Microsoft Edge 111, esta característica se ha quitado, ya que la herramienta Rendimiento ahora proporciona automáticamente los nombres de archivo y función originales al generar perfiles de código de producción, siempre y cuando los mapas de origen se hospede en el servidor de símbolos de artefactos de Azure. Consulte La herramienta de rendimiento desminifia los nombres de archivo y función al generar perfiles de código de producción en Novedades de DevTools (Microsoft Edge 111).
Entrada novedades en desuso
La grabación de un perfil de rendimiento en la herramienta Rendimiento genera un gráfico de llama minificado. En versiones anteriores de Microsoft Edge, el gráfico de llama no usaba mapas de origen para mostrar los nombres de función originales, incluso si hospedaba los mapas de origen en el servidor.
A partir de la versión 99 de Microsoft Edge, puede mostrar los nombres de las funciones originales en un perfil de rendimiento, como se indica a continuación:
- Registre un perfil en la herramienta Rendimiento .
- Haga clic en el botón Unminify (
) para crear y descargar el perfil de rendimiento sinminificar. - Cargue (importe) (
) el perfil de rendimiento sin determinar en la herramienta Rendimiento .
El botón Unminify usará mapas de origen, siempre que se hospeden en paralelo con el código de producción, para desminificar los nombres de función en el gráfico de llama de la herramienta Rendimiento .
El gráfico de llama de la herramienta Rendimiento muestra inicialmente nombres de función como b, O, Xt y bn, tomados del código de producción minificado devuelto por el servidor web:
Después de hacer clic en Unminify () y, a continuación, cargar perfil (), el gráfico de llama de la herramienta rendimiento ahora muestra esas funciones etiquetadas con nombres significativos: invokeFunc (b), executeAction (O), endBatch (Xt), y runReactions (bn), recuperados de los mapas de origen:
Vea también:
- Desminificar nombres de función en perfiles de rendimiento de DevTools en el blog de Microsoft Edge.
- Mostrar nombres de función originales en perfiles de rendimiento.
Accesibilidad mejorada para la consola de red y la vista 3D
En versiones anteriores de Microsoft Edge, la tecnología de asistencia anunció información incorrecta al proporcionar un token de portador personalizado en la herramienta Consola de red. En la versión 99 de Microsoft Edge, este problema se ha corregido. Al seleccionar el cuadro de texto para proporcionar un token de portador personalizado, la tecnología de asistencia ahora anuncia "Editar texto de token Request View group".
En versiones anteriores de Microsoft Edge, la tecnología de asistencia solo anunciaba el texto del botón de radio en la herramienta Vista 3D, sin anunciar el nombre del grupo al que pertenece el botón. En la versión 99 de Microsoft Edge, esto se ha corregido. Por ejemplo, cuando el foco está en el botón de radio Usar textura de pantalla , la tecnología de asistencia ahora anunciará: "Color type radio group, Use screen texture, radio button, selected".
Vea también:
Árbol de carpetas de origen mejorado en el panel Orígenes
En la pestaña Página de la herramienta Orígenes , ahora se ha mejorado el árbol de carpetas de origen, con menos desorden en la nomenclatura y el esquema de las carpetas. Se han quitado prefijos de ruta de acceso innecesarios como ../ y ./ . La estructura de árbol se ha simplificado mediante la combinación de carpetas duplicadas equivalentes.
Para ver el historial de esta característica en el proyecto de código abierto de Chromium, consulte Problema 1284737.
Vea también:
- Usar la pestaña Página para explorar los recursos que construyen la página web actual en Información general de la herramienta Orígenes.
Anuncios del proyecto de Chromium
La versión 99 de Microsoft Edge también incluye las siguientes actualizaciones del proyecto de Chromium:
- Limitación de solicitudes de WebSocket
- Panel Nueva API de informes en el panel Aplicación
- Mejor estilo, formato y filtrado de la consola
- Mejoras en los mapas fuente
- Selector de colores táctil y panel dividido
Nota:
Las partes de esta página son modificaciones basadas en el trabajo creado y compartido por Google y usadas según los términos descritos en la licencia internacional creative Commons Attribution 4.0. La página original de los anuncios del proyecto de Chromium es Novedades de DevTools (Chrome 99) y está creada por Jecelyn Yeen.
Esta obra está licenciada bajo una Licencia Internacional Creative Commons Attribution 4.0.