Browser DevTool – Elements for VS Code

A new preview extension for Visual Studio Code is ready: With Elements for Microsoft Edge (Chromium), the popular browser DevTool Elements finds its way into the source text editor.

DevTool – Elements for VS Code

Microsoft has released DevTool Elements from the Chromium-based Microsoft Edge for VS Code browser. To use the extension that was released as a preview, a Dev or Canary build from Microsoft Edge (Chromium) must be used. The browser also has preview status.
Elements for Microsoft Edge (Chromium)

In the DevTools of Microsoft Edge (Chromium) can be controlled by the Elements panel z. HTML and CSS editing and DOM mutation breakpoints are set. Integration with VS Code is designed to improve the various workflows between DevTools and IDE.

Using the Elements extension, the DOM can be examined and debugged directly from VS Code. In addition, the changes to CSS and HTML are visible in real time. In a demo gif the features are shown:

elements vs code
image from microsoft

According to the blog entry , Microsoft plans to integrate further DevTools into VS code. In this context, Elements was chosen as the first prototype because it is the most widely used DevTool in Edge. The further course of the process will build on the community feedback. However, DevTools should not be completely migrated from the browser to the IDE.

All further details about Elements for Microsoft Edge (Chromium) are available on the Windows blog . In the VS Code Marketplace the Preview Extension is available for download .

Recent Articles

Best Programming Languages for Blockchain

Which are these the best programming languages for blockchain? Developers are presently utilizing prevalent programming languages like C++ and Java to manufacture custom blockchain...

Social VR world: Facebook Horizon should start in 2020

Facebook has announced with Horizon a new social VR world. This should allow users to create their own virtual reality worlds. The stop, however,...

Angular 9 Next Versions: Ivy, Bazel and more

Angular 9 next versions are here. Besides updates to Ivy, the update includes three features for the Language Service and Service Worker and changes...

Google Releases Dart 2.5: Code Completion through Machine Learning

The latest version of Googles C-Alternative, Go 1.13, is barely released, as the JavaScript derivative of the Internet giant follows: Dart 2.5 is here!...

Laravel 6.0 is here: Support for Serverless Platform Laravel Vapor

A new update is available for the framework Laravel. Laravel 6.0 is compatible with Laravel Vapor, a serverless deployment platform. The development team has...

Related Stories

Leave A Reply

Please enter your comment!
Please enter your name here