Geliştirici Araçları'ndaki Yenilikler (Chrome 80)

Console'da let ve class yeniden beyanları için destek

Console artık let ve class ifadelerinin yeniden beyanlarını desteklemektedir. Yeniden bildirememe, yeni JavaScript koduyla denemeler yapmak için Console'u kullanan web geliştiricilerinin sık karşılaştığı bir sorundu.

Örneğin, daha önce let ile bir yerel değişken yeniden bildirildiğinde Console hata veriyordu:

Chrome 78'deki Console'un, yeniden beyan işleminin başarısız olduğunu gösteren ekran görüntüsü.

Artık Console yeniden bildirime izin verir:

Chrome 80'deki Console'un, yeniden beyan işleminin başarılı olduğunu gösteren ekran görüntüsü.

Chromium sorunu #1004193

İyileştirilmiş WebAssembly hata ayıklaması

Geliştirici Araçları, DWARF Hata Ayıklama Standardı'nı desteklemeye başladı. Bu, Geliştirici Araçları'nda kod üzerinde adım atma, ayrılma noktaları belirleme ve kaynak dillerinizdeki yığın izlemeleri çözümleme için daha fazla destek anlamına gelir. Yazının tamamı için Chrome Geliştirici Araçları'nda İyileştirilmiş WebAssembly hata ayıklama sayfasına göz atın.

DWARF destekli WebAssembly hata ayıklama işleminin ekran görüntüsü.

Ağ paneli güncellemeleri

Başlatıcı sekmesinde istek Başlatıcı Zincirleri

Artık bir ağ isteğinin başlatıcılarını ve bağımlılıklarını iç içe geçmiş bir liste olarak görüntüleyebilirsiniz. Bu, bir kaynağın neden istendiğini veya belirli bir kaynağın (komut dosyası gibi) hangi ağ etkinliğinin neden olduğunu anlamanıza yardımcı olabilir.

Başlatıcı sekmesindeki bir İstek Başlatıcı Zinciri'nin ekran görüntüsü

Ağ panelinde ağ etkinliğini günlüğe kaydettikten sonra bir kaynağı tıklayın ve ardından İstek Başlatıcı Zinciri'ni görüntülemek için Başlatan sekmesine gidin:

  • İncelenen kaynak kalın harflerle gösterilmiştir. Yukarıdaki ekran görüntüsünde, https://web.dev/default-627898b5.js incelenen kaynaktır.
  • İncelenen kaynağın üzerindeki kaynaklar başlatıcılardır. Yukarıdaki ekran görüntüsünde https://web.dev/bootstrap.js, https://web.dev/default-627898b5.js öğesini başlatıyor. Başka bir deyişle https://web.dev/bootstrap.js, https://web.dev/default-627898b5.js için ağ isteğine neden olmuştur.
  • İncelenen kaynağın altındaki kaynaklar bağımlılıklardır. Yukarıdaki ekran görüntüsünde https://web.dev/chunk-f34f99f7.js, https://web.dev/default-627898b5.js öğesinin bir bağımlılığıdır. Başka bir deyişle, https://web.dev/default-627898b5.js, https://web.dev/chunk-f34f99f7.js için ağ isteğine neden olmuştur.

Chromium sorunu #842488

Seçili ağ isteğini Genel Bakış'ta vurgula

İncelemek üzere bir ağ kaynağını tıkladığınızda Ağ paneli artık Genel Bakış bölümünde bu kaynağın etrafına mavi bir kenarlık yerleştirir. Bu, ağ isteğinin beklenenden daha önce mi yoksa daha sonra mı gerçekleştiğini tespit etmenize yardımcı olabilir.

İncelenen kaynağı vurgulayan Genel Bakış penceresinin ekran görüntüsü.

Chromium sorunu #988253

Ağ panelindeki URL ve yol sütunları

Her ağ kaynağının mutlak yolunu veya tam URL'sini görmek için panelindeki yeni Yol ve URL sütunlarını kullanın.

Ağ panelindeki yeni Yol ve URL sütunlarının ekran görüntüsü.

Şelale tablo başlığını sağ tıklayın ve yeni sütunları göstermek için Yol veya URL'yi seçin.

Chromium sorunu #993366

Güncellenen Kullanıcı Aracısı dizeleri

Geliştirici Araçları, Ağ Koşulları sekmesi aracılığıyla özel bir User-Agent dizesi ayarlanmasını destekler. Kullanıcı Aracısı dizesi, ağ kaynaklarına ekli User-Agent HTTP başlığını ve ayrıca navigator.userAgent değerini etkiler.

Önceden tanımlanmış User-Agent dizeleri, modern tarayıcı sürümlerini yansıtacak şekilde güncellendi.

Ağ Koşulları sekmesindeki Kullanıcı Aracısı menüsünün ekran görüntüsü.

Ağ Koşulları'na erişmek için Komut Menüsü'nü açın ve Show Network Conditions komutunu çalıştırın.

Chromium sorunu #1029031

Denetimler paneli güncellemeleri

Yeni yapılandırma kullanıcı arayüzü

Yapılandırma kullanıcı arayüzü yeni ve duyarlı bir tasarıma sahip olup kısıtlama yapılandırma seçenekleri basitleştirilmiştir. Kısıtlama kullanıcı arayüzü değişiklikleri hakkında daha fazla bilgi için Denetim Masası Kısıtlaması bölümüne bakın.

Yeni yapılandırma kullanıcı arayüzü.

Kapsam sekmesi güncellemeleri

İşlev veya blok başına kapsam modları

Kapsam sekmesinde, kod kapsamı verilerinin işlev başına mı yoksa blok başına mı toplanacağını belirtmenizi sağlayan yeni bir açılır menü bulunur. Blok başına kapsam daha ayrıntılıdır ancak veri toplaması çok daha pahalıdır. Geliştirici Araçları artık varsayılan olarak işlev başına kapsamı kullanıyor.

Kapsam modu açılır menüsü.

Kapsam artık sayfanın yeniden yüklenmesiyle başlatılmalıdır

Kapsam verileri güvenilir olmadığından, sayfa yeniden yüklenmeden kod kapsamının açılması/kapatılması kaldırıldı. Örneğin, bir işlev yürütmesi uzun zaman önce yapıldıysa ve V8'in çöp toplayıcısı onu temizlediyse işlev kullanılmadığını bildirilebilir.

Chromium sorunu #1004203

Önizleme kanallarını indirme

Varsayılan geliştirme tarayıcınız olarak Chrome Canary, Dev veya Beta'yı kullanabilirsiniz. Bu önizleme kanalları en yeni Geliştirici Araçları özelliklerine erişmenizi, son teknoloji ürünü web platformu API'lerini test etmenizi ve kullanıcılarınızdan önce sitenizdeki sorunları bulmanızı sağlar.

Chrome Geliştirici Araçları ekibiyle iletişim kurma

Yayındaki yeni özellikleri ve değişiklikleri ya da Geliştirici Araçları ile ilgili diğer her şeyi tartışmak için aşağıdaki seçenekleri kullanın.

  • Öneri veya geri bildirimlerinizi crbug.com adresinden bize iletebilirsiniz.
  • Geliştirici Araçları'ndaki Diğer seçenekler   Diğer > Yardım > Geliştirici Araçları ile ilgili sorun bildir bölümüne giderek Geliştirici Araçları sorunlarını bildirin.
  • @ChromeDevTools adresinden tweet atabilirsiniz.
  • Geliştirici Araçları YouTube videoları veya Geliştirici Araçları ipuçları YouTube videolarına yorum yazın.

Geliştirici Araçları'ndaki yenilikler

Geliştirici Araçları'ndaki yenilikler serisinde ele alınan her şeyin listesi.

Chrome 127 sürümü

Chrome 126

Chrome 125 sürümü

Chrome 124 sürümü

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119 sürümü

Chrome 118 sürümü

Chrome 117 sürümü

Chrome 116

Chrome 115 sürümü

Chrome 114 sürümü

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109 sürümü

Chrome 108 sürümü

Chrome 107 sürümü

Chrome 106

Chrome 105 sürümü

Chrome 104 sürümü

Chrome 103 sürümü

Chrome 102 sürümü

Chrome 101

Chrome 100 sürümü

Chrome 99 sürümü

Chrome 98 sürümü

Chrome 97 sürümü

Chrome 96 sürümü

Chrome 95 sürümü

Chrome 94 sürümü

Chrome 93 sürümü

Chrome 92 sürümü

Chrome 91 sürümü

Chrome 90 sürümü

Chrome 89 sürümü

Chrome 88 sürümü

Chrome 87 sürümü

Chrome 86

Chrome 85 sürümü

Chrome 84

Chrome 83 sürümü

Chrome 82

Chrome 82 iptal edildi.

Chrome 81

Chrome 80 sürümü

Chrome 79 sürümü

Chrome 78 sürümü

Chrome 77

Chrome 76

Chrome 75 sürümü

Chrome 74 sürümü

Chrome 73

Chrome 72 sürümü

Chrome 71

Chrome 70

Chrome 68 sürümü

Chrome 67 sürümü

Chrome 66

Chrome 65 sürümü

Chrome 64 sürümü

Chrome 63 sürümü

Chrome 62 sürümü

Chrome 61 sürümü

Chrome 60 sürümü

Chrome 59 sürümü