Documentación de Microsoft Edge DevTools

Desarrollo mediante DevTools en Microsoft Edge.

Introducción a DevTools

Introducción

• Información general sobre DevTools
• Cambiar la ubicación de DevTools (Desacoplar, Acoplar en la parte inferior, Acoplar a la izquierda)
• Ejecutar comandos en el menú de comandos
• Información general sobre la consola

Novedades

• Novedades de Microsoft Edge DevTools
• Ponerse en contacto con el equipo Microsoft Edge DevTools

Personalizar DevTools

Introducción

• Personalizar DevTools

Novedades

• Características experimentales en Microsoft Edge DevTools

Guía paso a paso

• Cambiar la configuración de idioma de DevTools
• Personalizar métodos abreviados de teclado

Depuración de proyectos web

Inicio rápido

• Analizar páginas con la herramienta Inspeccionar

Tutorial

• Introducción a cómo ver y cambiar CSS
• Introducción a cómo ver y cambiar DOM

Guía paso a paso

• Buscar y corregir problemas con la herramienta Problemas
• Navegar por las capas de página web, índice z y DOM mediante la herramienta Vista 3D
• Inspeccionar animaciones
• Depuración de una aplicación web progresiva (PWA)
• Inspeccionar actividad de red

Emulación y pruebas

Guía paso a paso

• Emular dispositivos móviles (emulación de dispositivo)
• Características de prueba de accesibilidad
• Emular esquemas oscuros o claros en la página representada
• Probar la compatibilidad con teclado con el Visor de pedidos de origen
• Forzar el modo de vista previa de impresión
• Emular deficiencias visuales
• Simular movimiento reducido

JavaScript y rendimiento

Guía paso a paso

• Ejecutar JavaScript en la consola
• Corregir errores de JavaScript que se notifican en la Consola
• Información general sobre la herramienta Orígenes
• Características de depuración de JavaScript
• Buscar código JavaScript y CSS sin usar con la herramienta Cobertura
• Solucionar problemas de memoria
• Depuración de pérdidas de memoria DOM mediante la herramienta Elementos desasociados
• Comprender los problemas de seguridad mediante la herramienta Seguridad
• Solución de problemas comunes de rendimiento

Referencia

Referencia

• Métodos abreviados de teclado
• Referencia de características de CSS
• Referencia de características de la consola
• Referencia de API de objeto de consola

Guía paso a paso

• Referencia de características de rendimiento

sample

• Código de ejemplo para DevTools

Integración del IDE de Microsoft Edge

Información general

• Integración del IDE de Microsoft Edge
• Depurar Microsoft Edge en Visual Studio Code

Guía paso a paso

• Extensión Microsoft Edge DevTools para Visual Studio Code
• Abrir archivos de origen en Visual Studio Code
• Visual Studio para el desarrollo web