Microsoft Edge DevTools'ta 3D Görünüm ile z-dizin yığınlama içeriğinde hata ayıklama

  • History |
  • |
  • 0 Yorum


Z-dizin yığınlama bağlamında hata ayıklamaya yardımcı olacak yeni bir özellik ile Microsoft Edge DevTools'ta 3D View'un bir sonraki yinelemesini duyurmaktan heyecan alıyoruz. Genel 3B Görünüm, renk ve yığınlama kullanarak DOM (Belge Nesne Modeli) derinliğinin bir gösterimini gösterir ve z-Index görünümü sayfanızın farklı yığın bağlamlarını yalıtmanıza yardımcı olur.
3D görünüm, Kanarya dalında varsayılan olarak etkinleştirilir - diğer dallarda etkinleştirmek için DevTools "Denemeler" ayarlarını açın (DevTools -> Ctrl-Shift-P -> "Denemeler") ve "3D Görünümü Etkinleştir"i açın. "Denemeler" bölümünü görmüyorsanız edge://flags gidin ve "Geliştirici Araçları denemeleri"ni etkinleştirdiğinizden emin olun. 3D görünüm etkinleştirildikten sonra, DevTools "Diğer araçlar" menüsü altında (veya arama yoluyla: DevTools -> Ctrl-Shift-P -> "3D View") altında bulabilirsiniz.

Microsoft Edge DevTools'ta 3D Görünümü gösteren ekran görüntüsü
İlk 3D View denememizle Twitter'dan ve geri bildirim düğmesinden inanılmaz geri bildirimler alabildik. Bu, aracı geliştirmek için daha fazla kullanılabilirlik çalışması yapmaya teşvik etti. Yol boyunca, bir özellik olarak CSS z-index hata ayıklama için birçok istek aldık ve 3D Görünümün denemek için harika bir araç olacağını hissettik.
z-dizin sekmesinde, yalnızca yığınlama bağlamı olan öğeleri göstererek veya üst öğeleriyle aynı boya sırasına sahip öğeleri gizleyerek görünümü daha da basitleştirebilirsiniz. Bu iki ayar daha düz ve daha okunabilir bir deneyim sağlayacaktır. Daha fazla ayrıntı için açıklamamıza göz atın!
DevTools 3B Görünümü'nde z dizini hata ayıklamasını gösteren ekran görüntüsü

Sırada ne var?

Yakında, Elements paneli ve 3D View, UI iyileştirmeleri ve yeni kamera kontrolleri arasında daha iyi bir vurgulama deneyimi yaşayacağız. Bu deneyimden başka neler görmek istediğinizi duymak isteriz! Günlük hata ayıklamanızda başka hangi özellikler size yardımcı olur? Bize twitter'da ulaşmaktan çekinmeyinveya istediğiniz zaman Microsoft Edge "Yardım ve Geri Bildirim" menüsünden "Geri bildirim gönder" i tıklayın.
– Erica Draud, Program Yöneticisi, Edge DevTools