Sebelumnya, beberapa bulan lalu Microsoft dilaporkan sedang mengerjakan sebuah project yang akan membawa 3D View kedalam DevTools di Microsoft Edge Chromium.
Dan kemarin, Microsoft akhirnya mengumumkan bahwa mereka telah mengaktifkan 3D DOM Viewer di Microsoft Edge Chromium Canary.
Terkait fitur ini, sepertinya Microsoft terinspirasi dari salah satu fitur Mozilla Firefox yaitu Firefox Tilt dan menambahkannya kedalam Edge DevTools. Fitur ini akan memungkinkan pengguna untuk memvisualisasi struktur website dalam tampilan 3D, sehingga membantu para developer dalam menemukan bug dalam layout web tersebut.
“We’re thrilled to announce the next iteration of 3D View in the Microsoft Edge DevTools, with a new feature to help debug z-index stacking content. The general 3D view shows the representation of the DOM (Document object model) depth using color and stacking, and the Z-index view helps you isolate the different stacking contexts of your page.” Eric Druad, Program Manager for Edge DevTools berkata dalam postingan blognya.
Jika fitur ini belum aktif secara default, kamu bisa mengaktifkannya dengan flag experimental, dan berikut langkah langkahnya.
Langkah 1. Pastikan kamu menggunakan Edge Canary terbaru.
Langkah 2. Masuk ke URL berikut: edge://flags#enable-devtools-experiments
Lalu seperti biasa, aktifkan flags experimental tersebut lalu restart browser edge canary.
Langkah 3. Untuk mencoba 3D View ini, didalam Website masuk ke DevTools (CTRL + SHIFT + I), lalu tekan (…) > More Tools > enable 3D View.
Dan selesai. Sekarang dalam DevTools akan muncul 3D View seperti berikut.
Via : Techdows