Chrome Geliştirici Araçları'nda kısa süre önce bazı güncellenmiş özellikler yer almaktadır. Öğe panelinde yapılan güncellemelerle başlayıp Konsol, Zaman Çizelgesi ve daha fazlası hakkında konuşacağız.
Devre dışı bırakılan stil kurallarını yorum olarak kopyalayanlar
Stiller bölmesinde CSS kurallarının tamamını kopyaladığınızda, artık kapattığınız stiller dahil edilecek ve yorumlandığı şekilde panonuzda yer alacaktır. [crbug.com/316532]
CSS yolu olarak kopyala
"CSS yolu olarak kopyala" seçeneği, artık Öğeler panelinde DOM düğümleri için bir menü öğesi olarak kullanılabilir (XPath'i kopyala menü öğesine benzer).
CSS seçicilerinin oluşturulması stil sayfalarınızla/JavaScript'inizle sınırlı olmak zorunda değildir. Bunlar, WebDriver testlerindeki konum belirleyici stratejilerine de alternatif olabilirler. [crbug.com/277286]
Gölge DOM öğe stillerini görüntüleme
Gölge kökünün alt öğelerinin stilleri artık incelenebilir. [crbug.com/279390]
Konsolun copy() işlevi nesneler için çalışır
Komut Satırı API'sındaki copy() yöntemi artık nesneler için çalışmaktadır. Konsol panelinde copy({foo:'bar'}) öğesini deneyin. Nesnenin dizeleştirilmiş ve biçimlendirilmiş sürümünün artık panonuzda nasıl göründüğüne bakın. [crbug.com/289348]
Konsol için normal ifade filtresi
Konsol panelinde normal ifadeleri kullanarak konsol mesajlarını filtreleyin. crbug.com/318308]
Etkinlik işleyicileri kolayca kaldırın
Dokümandaki ilk fare tekerleği etkinlik işleyicisini almak için Konsol panelindeki getEventListeners(document).mousewheel[0]; işlevini deneyin. Buradan devam ederek etkinlik işleyiciyi kaldırmak için $_.remove() yöntemini deneyin ($_ = en son değerlendirilen ifadenin değeri). crbug.com/309524]
CSS uyarılarının kaldırılması
Görmüş olabileceğiniz "Geçersiz CSS mülk değeri" tarzı uyarılar artık kaldırılmıştır. Uygulamayı, gerçek dünyadaki CSS saldırıları dahil olmak üzere daha sağlam hale getirmek için sürekli olarak çalışıyoruz. crbug.com/309982]
Pasta grafikte özetlenen zaman çizelgesi işlemleri
Zaman Çizelgesi paneli artık Ayrıntılar bölmesinde oluşturma maliyetlerinizin kaynağını görsel olarak gösteren bir pasta grafik içeriyor. Bu sayede, performans sorunlarını bir bakışta belirleyebilirsiniz.
Önceden pop-up'larda görüntülenen bilgilerin çoğunun artık kendi bölmesine yükseltildiğini göreceksiniz. Görüntülemek için bir Zaman Çizelgesi kaydı başlatıp bir kare seçin, pasta grafik içeren yeni Ayrıntılar bölmesine dikkat edin. Kareler görünümündeyken, seçili kareler için ortalama FPS (1000ms/frame duration) gibi ilginç istatistikler görürsünüz. [crbug.com/247786]
Resim yeniden boyutlandırma etkinliği ayrıntıları
Zaman Çizelgesi panelindeki resim yeniden boyutlandırma ve kodu çözme etkinlikleri artık Öğeler panelindeki DOM düğümüne bir bağlantı içeriyor.
Resim URL'si bağlantısı sizi Kaynaklar Paneli'ndeki ilgili kaynağa götürür. crbug.com/244159] adresini ziyaret edin.
GPU Kareleri
GPU'da oluşan kareler artık en üstte, ana iş parçacığındaki karelerin üzerinde gösterilmektedir. crbug.com/305863]
Popstate dinleyicilerini keşfedin
'popstate', artık Kaynaklar paneli kenar çubuğunda bir etkinlik işleyici ayrılma noktası olarak kullanılabilir. [crbug.com/88112]
Çekmecede oluşturma ayarları mevcut
Çekmece açıldığında, aralarından biri Oluşturma paneli olan birkaç bölme görüntülenir. Boya dikdörtgenlerini, FPS ölçeri vb. göstermek için bu paneli kullanın. Bu özellik, Ayarlar > "Konsol çekmecesinde 'Oluşturma' görünümünü göster" seçeneğinden varsayılan olarak etkindir.
Resmi veri URL'si olarak kopyala
Kaynaklar panelindeki resim öğelerinin içerikleri artık veri URI'si (data:image/png;base64,iVBO...) olarak kopyalanabilir.
Bunu denemek için, Çerçeveler > [Kaynak] > Görseller'deki resim kaynağını bulun ve içerik menüsüne erişmek için resim önizlemesini sağ tıklayıp "Resmi Veri URL'si Olarak Kopyala"yı seçin. crbug.com/321132]
Veri URI filtrelemesi
Daha önce hiç ait olmadıysanız Veri URI'leri artık filtre uygulayarak Ağ sekmesinden çıkarılabilir. Filtre simgesini
Ağ Zamanlaması hataları düzeltildi
Resminizin indirilmesi 300.000 yıl sürdüğünü gördüyseniz özür dileriz. ;) Ağ kaynakları için bu yanlış zamanlamalar artık düzeltilmiştir. crbug.com/309570]
Ağ kaydı davranışı daha fazla kontrole sahip
Kayıt ağının davranışı biraz farklıdır. Öncelikle kayıt düğmesi, Zaman Çizelgesi veya CPU profilinden bekleyeceğiniz gibi çalışır. Ayrıca, beklediğiniz için Geliştirici Araçları açıkken sayfayı yeniden yüklerseniz ağ kaydı otomatik olarak başlar. Ardından da kapanır. Dolayısıyla, sayfa yüklendikten sonra ağ etkinliğini yakalamak istiyorsanız bu özelliği açın. Böylece, daha sonra ortaya çıkan ağ istekleri sonuçları çarpıtmadan şelalenizi daha kolay görselleştirebilirsiniz. crbug.com/325878]
Geliştirici Araçları temaları artık uzantılar üzerinden kullanılabilir
Kullanıcı stil sayfaları artık Geliştirici Araçları Denemeleri (onay kutusu: "Özel kullanıcı arayüzü temalarına izin ver") ile kullanılabilir. Bu onay kutusu, bir Chrome uzantısının Geliştirici Araçları'na özel stil uygulamasına olanak tanır. Örnek için Örnek Geliştirici Araçları Tema Uzantısı'na bakın. crbug.com/318566]
Geliştirici Araçları özetinin bu sayısı kadar. Henüz yapmadıysanız Kasım sürümüne göz atın.