Edge Tools Added To VS Code
Written by Mike James   
Friday, 02 October 2020

Microsoft has announced the general availability of Microsoft Edge Tools for VS Code extension, giving developers the option of embedding the browser developer tools into Visual Studio Code, aka VS Code.

The extension, which has been in beta for a year, combines the features of two experimental extensions adding Developer Tools functionality to VS Code: The Elements and the Network extension.

The thinking behind the VS Code extension is to keep VS Code as a light-weight programming environment while making developer tools available for the browser as an extension. It lets you use the browser's Elements and Network tool from within the editor. The DevTools will connect to an instance of Microsoft Edge so you can see the runtime HTML structure, alter layout, fix styling issues, and view network requests.

vscodeedge

The tools provide debug configurations for launching Microsoft Edge browser in remote-debugging mode and auto attaching the tools, and there's a side bar view for listing all the debuggable targets, including tabs, extensions, and service workers.

A screen-casting feature can be used to see your page without leaving VSCode, and you can go directly to the line/column for source files in your workspace when clicking on a link or CSS rule inside the Elements tool.

The Microsoft Edge Tools extension lets you choose between connecting to an existing browser instance, starting a new one, or using a “headless” browser. The “headless” option doesn't add its own browser window and doesn't put an extra icon in your task bar.

The developers say the Network pane is the second most-used feature in the Microsoft Edge DevTools, and last year Microsoft released a separate standalone extension to integrate the Network pane into VSCode. With this release the two extensions have been merged into one, though you can now also enable the Network tab in the extension settings.

 

More Information

Microsoft Edge Tools for VS Code extension

Related Articles

Atom v Visual Studio Code - The Unexpected Consequence Of Consolidation

Program Arduino in Visual Studio Code

Open Source Visual Studio Code Without Trackers Launched

Visual Studio Code - Now With Added Extensions

Microsoft Releases Visual Studio Code IDE For Linux, Mac And Windows       

A Programmer's Guide To Go With Visual Studio Code

Run VSCode in the Browser

Visual Studio Online Is VS Code  

To be informed about new articles on I Programmer, sign up for our weekly newsletter, subscribe to the RSS feed and follow us on Twitter, Facebook or Linkedin.

Banner


Catching Up With PyCharm 2022.3
31/01/2023

PyCharm 2022.3.2, the second minor bugfix release for the latest edition of PyCharm, has just been released. But if you hadn't noticed the new features in PyCharm 2022.3 here's a catchup.



Google Season Of Docs 2023 Announced
20/01/2023

Google Season of Docs allows open source organizations to apply for a grant of between and  $5,000 - $15,000 USD to help improve their documentation. Selected organizations use their grant t [ ... ]


More News

picobook

 



 

Comments




or email your comment to: comments@i-programmer.info

Last Updated ( Friday, 02 October 2020 )