Microsoft has introduced an interesting new tool for web developers in its upcoming Chromium-based Microsoft Edge via its Dev and Canary channels. The tool allows developers to view a 3D render of the web elements that make up their web page. The experimental feature is “inspired by” Firefox Tilt, both of which are intended to allow developers to more easily track down bugs.
Inspired by @FirefoxDevTools' Tilt feature, we just released the 3D DOM viewer in Edge Dev/Canary builds 😀
1) Enable Developer Tools experiments in about://flags
2) Ctrl+Shift+P > "Experiments" > "Enable DOM 3D view"
3) Ctrl+Shift+P > "DOM 3D View"
Let us know what you think! pic.twitter.com/clS8IXHqCt
— Microsoft Edge DevTools (@EdgeDevTools) August 5, 2019
A users who wants to try it out only need to go edge://flags on the latest version of Edge either on the Dev or Canary branches, and enable Developer Tools experiments. Then, hit
I to open the developer options, then hit the ellipsis
... menu to go to Settings, navigate to Experiments along the sidebar, then tick Enable Dom 3D View.
Afterwards, you can hit
I again to open the developer options once more, hit the ellipsis
... menu, then More tools, then DOM 3D View. Afterwards, just hit Take snapshot to generate a 3D view of your webpage.
Keep in mind that as this is an experimental feature, there may be bugs or other issues, and there’s no guarantee the feature is here to stay. But if it does, it could serve as a great tool for web developers and enthusiasts.
What do you think of the new feature? Is it something that you’d use or do you think Microsoft can do better? Let us know in the comment area below.