Aracılar için Chrome Geliştirici Araçları, aracınızın duyarlı düzenleri doğrulamasını, konuma duyarlı API'leri test etmesini ve çeşitli CPU veya ağ hızlarını simüle etmesini sağlar. Sınır durumlarını belirlemek ve performans denetimlerini daha etkili bir şekilde otomatikleştirmek için bu araçları kullanın.
Bu emülasyon özellikleri, temsilcinizin sitenizle etkileşim kurmasını sağlayan diğer araçlarla (ör. öğeleri tıklama, formları doldurma ve sayfalarda gezinme) birlikte çalışır.
Aşağıdakiler gibi öğeleri taklit edebilirsiniz:
- Görüntü alanı ve kullanıcı aracısı: Belirli ekran boyutlarını ve cihaz tanımlayıcılarını taklit edin.
- Coğrafi konum: Konuma duyarlı API'leri test etmek için konum koordinatlarını sahteleştirin.
- Ağ ve CPU: Gerçek dünyadaki performans kısıtlamalarını simüle etmek için ağ koşullarını ve CPU hızını sınırlayın.
- Renk şeması: Açık ve koyu mod arasında geçiş yapın.
Emülasyonu kullanırken aşağıdakileri göz önünde bulundurun:
- Cihaz desteği: Temsilciniz, Puppeteer'ın
KnownDeviceslistesindeki herhangi bir cihazı taklit edebilir. Buna, mobil görünüm alanları için dokunma etkinliklerini simüle etme de dahildir. - Tarayıcı motoru davranışı: Araç, cihaz özelliklerini taklit etse de Chromium dışı tarayıcı motorlarını veya farklı işletim sistemlerini simüle etmez. Ajanınız her zaman mevcut işletim sisteminizdeki Chrome'da çalışır.
Kullanıcı emülasyonu için kullanım alanları
Aracınızdan, her kod değişikliğinden sonra tarayıcıları manuel olarak yeniden boyutlandırmak, IP'leri sahteleştirmek veya ağları sınırlamak yerine ortamları taklit etmesini ve kullanıcı arayüzünü sizin için doğrulamasını isteyin.
Bu iş akışlarıyla emülasyonu geliştirme sürecinize entegre edin.
Duyarlı tasarım üzerinde yineleme yapma
Gezinme kalıpları, mobil ve masaüstü form faktörleri arasında genellikle önemli ölçüde değişir. Uygulamanızı oluştururken aracınıza, yeni yazdığı bileşenlerin doğru şekilde oluşturulduğunu ve cihazlarda aynı içeriği sağladığını doğrulamasını söyleyebilirsiniz.
Örnek istem:
Go to developer.chrome.com. Click the burger menu on mobile, check the top level
items and ensure the same items are available for a desktop device.
Örnek aracı yürütme: Aracınız bir Chrome penceresi açar, sayfaya gider, emülasyonu başlatır ve öğeleri her iki görünüm alanında karşılaştırır. Mobil cihaz görünümünün (hamburger menüsü) ve masaüstü görünümünün (başlık) beklenen bağlantıları içerdiğini onaylar.
Görünüm alanı etkileşimlerini doğrulama
Düzenler yalnızca CSS'de değil, etkileşimler sırasında da bozuluyor. Statik ekran görüntüleri genellikle kullanıcılar kullanıcı arayüzüne dokunduğunda oluşan hataları kaçırır. Aracınıza, gizli işlevsel hataları yakalamak için birden fazla görüntü alanı genelinde belirli etkileşim akışlarını test etme görevini verebilirsiniz.
Örnek istem:
Go to https://developer.chrome.com/ on mobile, tablet and desktop device, type
in a search query but don't submit it and wait for the type-ahead suggestions.
Ensure the Sign in button is visible all the time. Let me know if that's not the
case.
Örnek ajan yürütme: Ajanınız bir arama sorgusu yazıyor ve ekranı üç boyuta da yeniden boyutlandırıyor. Bu örnekte, temsilciniz tablet ve mobil cihazlarda arama çubuğunun, başlığın tamamını kaplayacak şekilde genişlediğini ve Oturum aç bağlantısını gizlediğini tespit ediyor.
Konum tabanlı prototip özellikler
Kullanıcının fiziksel konumuna dayalı API'leri (ör. "Yakınımda" aramaları veya mağaza bulucular) test etmek için genellikle sensörleri manuel olarak geçersiz kılmanız gerekir. Artık aracınıza, ön uç ve arka uç mantığınızı sorunsuz bir şekilde doğrulamak için belirli coğrafi konumları sahteleştirmesini söyleyebilirsiniz.
Örnek istem:
Go to chrome.dev/devtools-store-locator. Search for Berlin, and confirm there's
a store showing. Confirm there's no store for Washington. Finally, simulate
Paris as location and verify there are stores listed.
Aracı yürütme örneği: Aracınız siteye gidiyor, Berlin'i arıyor ve ardından doğru mağazaların doldurulmasını sağlamak için Konumumu Kullan özelliğiyle etkileşime geçmeden önce Paris'i taklit etmek amacıyla belirli enlem ve boylam koordinatlarını dinamik olarak ekliyor.