El año pasado, se lanzó la extensión experimental «Elements for VS Code», que brinda a los desarrolladores la opción de incorporar las herramientas de desarrollo del navegador en Visual Studio Code.

Hoy se anuncia la disponibilidad general de la nueva extensión Microsoft Edge Tools para VS Code, que se ha mejorado significativamente y ahora sale de la versión preliminar por primera vez.

Con esta versión, se ha fusionado la funcionalidad de dos extensiones experimentales que trajeron la funcionalidad de Herramientas para desarrolladores a Visual Studio Code: los elementos y la extensión de red. También se ha hecho que sea más fácil contribuir y construir la extensión de uno mismo y solucionado algunas de las asperezas.

Puedes descargarla desde el Marketplace de Visual Studio, o instalarla desde dentro de Visual Studio Code.

¿Por qué incrustar herramientas de desarrollo en un editor?

Visual Studio Code tiene muchas características que facilitan nuestra vida como desarrolladores, pero se ciñe a lo que mejor sabe hacer: ser un entorno de programación ligero. Sin embargo, cuando creamos productos para la web, programarlos a menudo no es suficiente. Una gran parte de nuestro flujo de trabajo consiste en ajustar la apariencia de nuestros productos. Aquí es donde brillan las herramientas de desarrollo integradas en el navegador.

El cambio continuo entre el editor y el navegador genera demora a nuestro flujo de trabajo a lo largo del día. Cambias de un entorno a otro – de desarrollo a modo de depuración – y necesitas volver a cambiar. Esa retroalimentación es lo que impulsó a los de microsoft a explorar la incorporación de las herramientas de desarrollo en una extensión, permitiéndonos así ver lo que genera nuestro código y depurarlo sin dejar nuestras ideas de «desarrollo».

Las extensiones son una gran manera de añadir más funcionalidad a petición sin añadir gastos generales al producto principal. Nos permiten movernos rápido e iterarnos en base a la retroalimentación de nuestros usuarios, y fueron una elección natural para llevar las herramientas de Microsoft Edge a VS Code.

Nuevos modos de navegador completo y sin encabezado

La nueva extensión de Microsoft Edge Tools viene con una serie de cambios para simplificar su flujo de trabajo e integrar más herramientas.

Con esta versión, cambió la forma en que podemos lanzar una instancia de Microsoft Edge para depurar. Podemos elegir entre conectarse a una instancia del navegador existente, iniciar una nueva o usar un navegador «sin encabezado». La opción «sin encabezado» es una forma menos intrusiva de lanzar el navegador. No se obtiene una ventana propia del navegador ni un icono adicional en la barra de tareas. Esto también resolvió un problema de larga data con los usuarios de Mac ya que la extensión informó que las ventanas del navegador que no estaban en primer plano estaban inactivas. Podemos elegir en los ajustes de la extensión si queremos que las nuevas instancias del navegador estén sin encabezado o no.

Podemos ver la diferencia en los siguientes screencasts. En el modo normal se obtiene una ventana completa del navegador con la que podemos interactuar. También podemos ver una vista previa de la misma en la extensión.

En el modo sin encabezado, el navegador no aparece en una ventana separada:

Introducción al panel Network

El panel Network es la segunda característica más utilizada en las herramientas de desarrollo de Microsoft Edge, por lo que el año pasado se lanzó una extensión independiente para integrar el panel Network en VSCode. Se escucho a la comunidad y sus comentarios que introdujeron una confusa duplicación en la experiencia, así que con esta versión se esta fusionando las dos extensiones en una sola, ahora también podemos habilitar la pestaña Network en la configuración de la extensión.

Según Microsoft, estará escuchando a los desarrolladores sobre esta experiencia. Por ahora, el panel Network estará desactivado de forma predeterminada, pero se pueden enviar comentarios sobre la preferencia de que se activen los paneles Network o adicionales de forma predeterminada.

Facilitar la contribución

Los colaboradores encontrarán que la nueva extensión se construye mucho más rápido y se ha cambiado la arquitectura para permitir una contribución más fácil. En el pasado, se necesitaba descargar y compilar todo el Chromium  para contribuir, ahora sólo se nos pedirá que obtengas o descargues las partes que necesitaremos para la extensión y se escribió algunos scripts para hacer el proceso más fácil.

Involúcrate!

Desde Microsoft no están invitando a que nos sumemos y contribuyamos y mejoremos la extensión.

Pruebe la nueva extensión hoy y háganos saber lo que piensa!

También puedes encontrar el proyecto de la extensión en GitHub; la mejor manera de compartir los comentarios con el equipo es escribir un problema allí. También estamos disponibles en Twitter como @EdgeDevTools. ¡Nos encantaría saber qué más le gustaría ver en esta extensión y qué parte de las herramientas para desarrolladores deberíamos agregar a continuación!

Ahora ya lo sabemos señores, Microsoft esta escuchando a la comunidad, y esta mejorando cada vez mas esta herramienta que se ha vuelto muy popular.

Enlace original: Via Blog de Windows