Geliştirici Araçları'ndaki yenilikler (Chrome 122)

Sofia Emelianova
Sofia Emelianova
GitHub

Kaydedici uzantılarının resmi koleksiyonu kullanıma sunuldu

Dışa aktarma ve tekrar oynatma Kaydedici uzantılarının resmi koleksiyonu kullanıma sunuldu.

Koleksiyonu doğrudan Kaydedici'den açmak için Kaydedici panelinin üst kısmındaki işlem çubuğunda Dışa aktar > Uzantı al...'ı seçin.

Ağ iyileştirmeleri

Bu sürüm, Ağ paneline bazı iyileştirmeler getiriyor.

Durum sütununda hata nedeni

Durum sütunu artık her zaman bir hata nedeni gösteriyor. Daha önce Büyük istek satırları'nı etkinleştirmeniz veya tabloda isteği seçmeniz gerekiyordu.

Durum sütununda, hatanın nedenini gösteren önce ve sonra.

Chromium sorunları: 1506760.

İyileştirilmiş Kopyala alt menüsü

İsteklere ait Kopyala alt menüsü artık daha düzenli.

Kopyala alt menüsünün iyileştirilmesinden önceki ve sonraki durum.

Ayrıca, cURL olarak kopyala seçeneği artık Windows'ta doğru komutu panoya kopyalar.

Chromium sorunları: 1267033, 1276452, 798498.

Performans iyileştirmeleri

Bu sürüm, Performans paneline çeşitli iyileştirmeler getirir.

Zaman Çizelgesi'ndeki içerik haritaları

Performans panelinin üst kısmındaki zaman çizelgesi artık ekmek kırıntıları ayarlamanıza ve bunlar arasında geçiş yapmanıza olanak tanır.

İçerik haritası ayarlamak için Zaman Çizelgesi'nde bir aralık seçin, fareyle üzerine gelin ve N ms düğmesini tıklayın. Ardışık olarak birkaç iç içe yerleştirilmiş içerik haritası oluşturabilirsiniz. Yakınlaştırma düzeyleri arasında atlamak için zaman çizelgesinin üst kısmındaki zincirdeki ilgili içerik haritası öğesini tıklayın. Sayfa gezinme çubuklarının nasıl kullanıldığını görmek için bir sonraki videoyu izleyin.

Chromium sorunları: 1467739.

Ana kanaldaki etkinlik başlatıcılar

Performans > Ana kanalında artık başlatıcıları ve bu başlatıcıların neden olduğu sonraki etkinlikleri birbirine bağlayan oklar varsayılan olarak gösteriliyor.

  • Stil veya düzen geçersiz kılması -> Stilleri yeniden hesapla veya Düzen
  • Animasyon karesi iste -> Animasyon karesi tetiklendi
  • Boşta Geri Çağırma İste -> Boşta Geri Çağırmayı Tetikle
  • Zamanlayıcıyı Yükle -> Zamanlayıcı Tetiklendi
  • WebSocket Oluştur -> Gönder... ve WebSocket El Sıkışması Al veya WebSocket'i Kaldır

Okları görmek için izlemede bu tür bir etkinlik bulup tıklayın. Bu özellik daha önce deneme aşamasındaydı.

İstekten gelen bir ok ve boşta geri çağırma işleminin tetiklenmesi.

Chromium sorunları: 1434596.

Node.js DevTools için JavaScript VM örneği seçici menüsü

Node.js DevTools'un Performans panelinde artık işlem çubuğundaki ilgili açılır menüden bir JavaScript sanal makinesi örneği seçebilirsiniz. Yakında kullanımdan kaldırılacak olan JavaScript Profiler'da da benzer bir özellik bulunuyordu.

JavaScript sanal makine örneği seçmenize olanak tanıyan yeni bir menü eklemeden önce ve sonra.

Chromium sorunları: 1511813.

Öğe iyileştirmeleri

Bu sürümde Öğeler panelinde çeşitli iyileştirmeler yapıldı.

Öğeler paneli, aşağıdaki iki özelliğe ek olarak artık açtığınız son sekmeyi (ör. Hesaplanan veya Özellikler) de hatırlar.

::view-transition sözde öğesi artık Stil bölümünde düzenlenebilir

Artık denetleyici stil sayfasını kullanarak Stiller bölümündeki ::view-transition CSS sözde öğelerini düzenleyebilirsiniz.

Görüntüleme geçişi sözde öğelerinin düzenleme öncesi ve sonrası desteği.

Daha fazla bilgi için View Transitions API ile sorunsuz ve basit geçişler başlıklı makaleyi inceleyin.

Chromium sorunları: 1511233.

Blok kapsayıcılar için align-content mülk desteği

align-content özelliği artık table-caption ve table-cell dahil olmak üzere tüm engelleme kapsayıcılarıyla çalışıyor. Daha önce yalnızca grid ve flex ile çalışıyordu.

Blok kapsayıcılarda önce ve sonra içerik hizalama desteği.

Chromium sorunları: 1500511.

Kaynaklar'da yeni kısayol ve komut

Artık günlük noktası oluşturmak için Cmd (Mac) / Ctrl (Win) + Üst Karakter + Kaynaklar'da bir satır numarasını tıklayabilirsiniz. Bu kısayol, koşullu kesme noktaları için mevcut Cmd (Mac) / Ctrl (Win) + tıklama özelliğine ek olarak sunulmuştur.

Komut Menüsü, Düzenleyici'nin açılır menüsündeki karşılık gelen seçenekle aynı işlevi gören yeni Etkin dosyayı gezinme kenar çubuğunda göster komutunu alır.

Etkin dosyayı, gezinme kenar çubuğunda göstermek için kullanılan yeni komut.

Chromium sorunları: 1486933, 1467464.

Taklit edilen katlanabilir cihazlar için duruş desteği

Cihaz modu artık taklit edilen katlanabilir cihazın postürünü ayarlamanıza olanak tanır: Devamlı veya Katlanmış. Devamlı duruş, "düz" bir konumu ifade eder ve katlanmış durumdayken ekranın bölümleri arasında bir açı oluşur.

Duruş seçeneklerini içeren bir açılır menü.

Ayrıca, Cihazlar listesine yeni bir emülasyonlu katlanabilir cihaz eklendi: Asus Zenbook Fold.

Chromium sorunu: 1066842.

Dinamik tema oluşturma

Geliştirici Araçları artık Chrome'un renk temasıyla otomatik olarak eşleşiyor. Tema ayarlamak için:

  1. Yeni bir sekme açın ve sağ alt köşedeki Chrome'u Özelleştir'i tıklayın.
  2. Görünüm bölümünde, Temaları değiştir aracılığıyla bir tema seçin veya bir renk paleti seçin.

Geliştirici Araçları, Görünüm'de seçilen renk temasıyla eşleşir.

Chromium sorunları: 1483276.

Ağ ve Uygulama panellerindeki üçüncü taraf çerezlerinin kullanımdan kaldırılmasıyla ilgili uyarılar

Hem Ağ hem de Uygulama panellerinde artık İzleme Koruması'ndaki üçüncü taraf kısıtlamalarından etkilenen çerezler vurgulanıyor ve bunların yanında uyarılar gösteriliyor.

Ağ'da uyarı simgesi içeren bir istek bulun, tıklayın ve Çerezler sekmesini açın.

Ağ panelinde üçüncü taraf çerezlerini yakalamadan önce ve sonra.

Application'ta (Uygulama) Storage > Cookies'e (Depolama > Çerezler) gidin ve bir alanı tıklayın. Sarı renkle vurgulanan çerezler tarayıcıda depolanmaz.

Uygulama panelinde üçüncü taraf çerezlerinin vurgulandığından önceki ve sonraki durumu.

Sorunları açıklayan bir ipucunu görmek için fareyle uyarı simgesinin üzerine gelin ve daha fazla bilgi içeren Sorunlar sekmesini açmak için simgeyi tıklayın.

Ayrıca tablodaki çerezler de artık varsayılan olarak ada göre sıralanıyor.

Chromium sorunları: 1506225, 1503961.

Lighthouse 11.4.0

Lighthouse panelinde artık Lighthouse 11.4.0 sürümü kullanılıyor. Değişikliklerin tam listesini inceleyin. Dikkat çekici değişiklikler arasında, web sitenizde hâlâ üçüncü taraf çerezleri kullanılıp kullanılmadığını tespit etmenizi sağlayan yeni denetim bulunuyor.

Üçüncü taraf çerezlerini algılayan denetim.

Geliştirici Araçları'ndaki Lighthouse panelini kullanmayla ilgili temel bilgileri öğrenmek için Lighthouse: Web sitesi hızını optimize etme başlıklı makaleyi inceleyin.

Chromium sorunu: 772558.

Erişilebilirlik

Bu sürümde aşağıdaki erişilebilirlik iyileştirmeleri yapılmıştır:

  • Ayarlar > Denemeler'i açtığınızda Arama kutusu otomatik olarak odaklanır.
  • Ağ > Filtre'deki Girişi temizle düğmesine odaklanılabilir.
  • Kaynaklar > Sayfa bölümündeki dosya ağacı artık yüksek kontrast modunda düzgün bir şekilde görüntülenir.
  • Ekran okuyucular artık şunları doğru şekilde duyuruyor:
    • Kaynaklar > Duraklatma noktaları bölümündeki onay kutularının durumu.
    • Öneri listesinin konumu ve dizine ekleme bilgileri.
    • Ayarlar > Konumlar'da konum eklerken veya silerken yapılan işlemin sonucu.
    • Ayarlar > Yoksay Listesi'ndeki dışlama kuralı grupları (genel veya özel).

Chromium sorunları: 1504938, 1499868, 1512161, 1515224, 1515418, 1516998, 1517015.

Diğer öne çıkan özellikler

Bu sürümdeki dikkate değer düzeltme ve iyileştirmelerden bazıları şunlardır:

  • Animasyonlar:
    • Ekran görüntüsü pop-up'ının sınırların dışında oluşturulmasına neden olan hata düzeltildi (1506991).
    • Kaldırılan animasyon düğümlerinin kaldırılmış olarak işaretlenmemesi sorunu düzeltildi (1506561).
  • Ağ:
    • Başlık geçersiz kılmaları: Başlıklar sekmesinde (1507856) yanlış mor nokta simgesi içeren bir hata düzeltildi.
    • Önizleme: Gereksiz çift kod çözmeyle ilgili bir hata düzeltildi (1509336).
    • Shorts isteklerinin gösterilmemesine neden olan bir hata düzeltildi (1509862).
  • Uygulama > IndexedDB: Diğer panellerle tutarlılık sağlamak için işlem çubuğundaki düğmeler yeniden düzenlendi (1393800).
  • Sensörler: Başarılı geri çağırmanın başarısız olmasına yol açan konumun hatalı olmasına yol açan hata düzeltildi (1486859).
  • Performans:
    • Çöp toplama düğmesinde artık "çöp kutusu" yerine "paspas" simgesi (1507530) kullanılıyor.
    • Performans izleme özelliği artık about:blank (1509947) konumuna giden verileri saklıyor.

Önizleme kanallarını indirme

Varsayılan geliştirme tarayıcınız olarak Chrome Canary, Yeni geliştirilenler veya Beta sürümünü kullanabilirsiniz. Bu önizleme kanalları, en son DevTools özelliklerine erişmenizi sağlar, en yeni web platformu API'lerini test etmenize olanak tanır ve sitenizdeki sorunları kullanıcılarınızdan önce bulmanıza yardımcı olur.

Chrome Geliştirici Araçları Ekibi ile iletişime geçme

Yeni özellikler, güncellemeler veya Geliştirici Araçları ile ilgili başka herhangi bir konu hakkında konuşmak için aşağıdaki seçenekleri kullanın.

Geliştirici Araçları'ndaki yenilikler

DevTools'daki yenilikler serisinde ele alınan tüm konuların listesi.