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

Kaydedici panelindeki çift tıklama ve sağ tıklama etkinliklerini kaydedin

Kaydedici paneli artık çift tıklama ve sağ tıklama etkinliklerini yakalayabilir.

Kaydedici panelindeki çift tıklama ve sağ tıklama etkinliklerini kaydedin

Bu örnekte, bir kayıt başlatın ve aşağıdaki adımları uygulamayı deneyin:

  • Büyütmek için kartı çift tıklayın
  • Kartı sağ tıklayıp içerik menüsünden bir işlem seçin

Kaydedici'nin bu etkinlikleri nasıl yakaladığını anlamak için adımları genişletin:

  • Çift tıklama, type: doubleClick olarak yakalanır.
  • Sağ tıklama etkinliği type: click olarak yakalanır ancak button özelliği secondary olarak ayarlanır. Normal bir fare tıklamasının button değeri primary'dır.

Chromium sorunları: 1300839, 1322879, 1299701, 1323688

Lighthouse panelindeki yeni zaman aralığı ve anlık görüntü modu

Artık sayfa yüklemenin ötesinde web sitenizin performansını ölçmek için Lighthouse'u kullanabilirsiniz.

Lighthouse panelindeki yeni zaman aralığı ve anlık görüntü modu

Lighthouse paneli artık 3 kullanıcı akış ölçümü modunu desteklemektedir:

  • Gezinme raporları, tek bir sayfa yüklemesini analiz eder. Gezinme, en sık kullanılan rapor türüdür. Geçerli sürümden önceki tüm Lighthouse raporları gezinme raporlarıdır.
  • Zaman aralıkları raporları, genellikle kullanıcı etkileşimlerini içeren rastgele bir dönemi analiz eder.
  • Anlık görüntü raporları, sayfayı belirli bir durumda, genellikle kullanıcı etkileşimde bulunduktan sonra analiz eder.

Örneğin, bu demo sayfasında alışveriş sepetine ürün ekleme performansını ölçelim. Zaman aralığı modunu seçin ve Başlangıç zaman aralığı'nı tıklayın. Ekranı kaydırıp alışveriş sepetine birkaç ürün ekleyin. İşiniz bittiğinde kullanıcı etkileşimlerinin Lighthouse raporunu oluşturmak için Zaman aralığını sonlandır'ı tıklayın.

Zaman aralığı modu

Her modun benzersiz kullanım alanları, avantajları ve sınırlamaları hakkında bilgi edinmek için Lighthouse'taki kullanıcı akışları bölümüne bakın.

Chromium sorunu: 1291284

Performans analizi güncellemeleri

Performans Analizleri panelindeki iyileştirilmiş yakınlaştırma denetimi

Geliştirici Araçları artık video yer imlecinin konumuna değil, fare imlecininize göre yakınlaştırma yapacak.İmleç tabanlı en yeni yakınlaştırma özelliğiyle, farenizi kanalın herhangi bir yerine hareket ettirebilir ve istediğiniz alana hemen yakınlaştırabilirsiniz.

Uygulanabilir analizler elde etmeyi ve panelden web sitenizin performansını iyileştirmeyi öğrenmek için Performans Analizleri'ne bakın.

Chromium sorunu: 1313382

Performans kaydını silmek için onaylayın

Geliştirici Araçları artık performans kaydını silmeden önce bir onay iletişim kutusu gösteriyor.

Performans kaydını silmek için onaylayın

Chromium sorunu: 1318087

Nesneler panelindeki bölmeleri yeniden sıralama

Artık Öğeler panelindeki bölmeleri tercihinize göre yeniden sıralayabilirsiniz.

Örneğin, Geliştirici Araçları'nı dar bir ekranda açtığınızda Daha fazla göster düğmesinin altında Erişilebilirlik bölmesi gizlenir. Erişilebilirlik sorunlarıyla sık sık hata ayıklıyorsanız artık daha kolay erişim için bölmeyi öne sürükleyebilirsiniz.

Nesneler panelindeki bölmeleri yeniden sıralama

Chromium sorunu: 1146146

Tarayıcının dışında bir renk seçme

Geliştirici Araçları artık tarayıcının dışında renk seçmeyi destekliyor. Daha önce, yalnızca tarayıcı içinden bir renk seçebiliyordunuz.

Stiller bölmesinde, bir renk seçiciyi açmak için herhangi bir renk önizlemesini tıklayın. İstediğiniz yerden renk seçmek için damlalık aracını kullanın.

Tarayıcının dışında bir renk seçme

Chromium sorunu: 1245191

Hata ayıklama sırasında iyileştirilmiş satır içi değer önizlemesi

Hata ayıklayıcı artık satır içi değerlerin önizlemesini doğru şekilde gösteriyor.

Bu örnekte, double işlevinde a giriş parametresi ve x değişkeni bulunmaktadır. return satırına bir ayrılma noktası ekleyip kodu çalıştırın. Satır içi önizleme, a ve x değerlerini doğru şekilde gösteriyor. Daha önce hata ayıklayıcı, satır içi önizlemede x değerini göstermiyordu.

Hata ayıklama sırasında iyileştirilmiş satır içi değer önizlemesi

Chromium sorunu: 1316340

Sanal kimlik doğrulayıcılar için büyük blob'ları destekleme

WebAuthn sekmesinde artık sanal kimlik doğrulayıcılar için Büyük blob'u destekler onay kutusu bulunuyor.

Bu onay kutusu varsayılan olarak devre dışıdır. Bunu yalnızca yerleşik anahtarları destekleyen ctap2 protokolüne sahip kimlik doğrulayıcılar için etkinleştirebilirsiniz.

 Sanal kimlik doğrulayıcılar için büyük blob'ları destekleme

Chromium sorunu: 1321803

Kaynaklar panelindeki yeni klavye kısayolları

Kaynaklar panelinde artık iki yeni klavye kısayolu var:

  • Gezinme kenar çubuğunu (sol) Control / Command + Üst Karakter + Y tuşlarına basarak açın/kapatın
  • debugger kenar çubuğunu (sağ) Control / Command + Üst Karakter + H tuşlarını kullanarak açın/kapatın

Kaynaklar paneli için yeni klavye kısayolları

Chromium sorunları: 1226363

Kaynak eşleme iyileştirmeleri

Geliştiriciler daha önce aşağıdaki işlemler sırasında rastgele hatalarla karşılaşıyorlar:

Genel hata ayıklama deneyimini iyileştirmek için kaynak eşlemelerindeki birkaç düzeltmeyi aşağıda bulabilirsiniz:

  • Satır içi komut dosyaları ve kaynak konumu için konum ile ofset arasındaki eşlemeyi düzelt
  • Çerçevenin metin konumu için yedek bilgileri kullanın
  • Çerçevenin URL'si ile göreli URL'leri doğru şekilde çözümleme

Chromium sorunları: 1319828, 1318635, 1305475

Ö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ü