Chrome Geliştirici Araçları (Chrome DevTools) nedir?

Chrome Geliştirici Araçları, web geliştirme ve hata ayıklama için tarayıcıya gömülü araçlar setidir.

Ana paneller:

• Elements: Sayfanın HTML yapısını ve CSS stillerini gerçek zamanlı olarak görüntüleme ve yeniden düzenleme.
• Console: Günlükleri görüntüleme, JavaScript kodu çalıştırma, hata ayıklama.
• Sources: JavaScript kodunu duraklama noktalarıyla hata ayıklama, performans profil oluşturma.
• Network: Ağ isteklerini izleme (HTTP/HTTPS), çalışma sürelerini ve içeriklerini analiz etme.
• Performance: Sayfa yükleme ve kod yürütme performansını analiz etme.
• Memory: Bellek kullanımını profil etme, sızıntıları tespit etme.
• Application: Uygulama kaynaklarını inceleme — depolama (Local Storage, Session Storage, IndexedDB), çerezler, önbellek.
• Security: Sayfa güvenliğini analiz etme, SSL sertifikalarını kontrol etme.
• Lighthouse: Web sayfasını performans, erişilebilirlik, SEO ve en iyi uygulamalar kriterlerine göre denetleme.

QA'da kullanımı:

• UI/UX Kontrolü: Stilleri analiz etme (Elements), uyumluluğu test etme (Toggle device toolbar).
• Ön yüz hata ayıklama: JavaScript hatalarını tespit etme (Console, Sources).
• API etkileşimlerini analiz etme: İstekleri ve yanıtları izleme (Network).
• Performans değerlendirmesi: Yükleme ve script yürütme sürelerini tahmin etme (Performance).
• Depolama alanlarını inceleme: Local Storage, çerezler vb. kontrol etme (Application).
• Cihaz simülasyonu: Farklı ekran boyutları ve ağ koşullarında testler yapma (Network – Throttling).