Sitenizin Chrome ve Android'de sorunsuz çalışmasını sağlamakla işiniz bitmez. Cihaz Modu, iPhone'lar gibi çeşitli cihazları simüle edebilse de emülasyon için diğer tarayıcı çözümlerine göz atmanızı öneririz.
Özet
- Belirli bir cihazınız yoksa veya bir konuda anlık kontrol yapmak istiyorsanız en iyi seçenek, cihazı doğrudan tarayıcınızda taklit etmektir.
- Cihaz emülatörleri ve simülasyon araçları, geliştirme sitenizi iş istasyonunuzdan çeşitli cihazlarda taklit etmenize olanak tanır.
- Bulut tabanlı emülatörler, siteniz için farklı platformlarda birim testlerini otomatikleştirmenize olanak tanır.
Tarayıcı emülatörleri
Tarayıcı emülatörleri, sitenin duyarlılığını test etmek için mükemmeldir ancak API, CSS desteği ve mobil tarayıcıda göreceğiniz belirli davranışlardaki farklılıkları taklit etmez. Her şeyin beklendiği gibi çalıştığından emin olmak için sitenizi gerçek cihazlarda çalışan tarayıcılarda test edin.
Firefox'un duyarlı tasarım görünümü
Firefox'ta, belirli cihazlar açısından düşünmeyi bırakmanızı ve kenarlarını sürükleyerek tasarımınızın yaygın ekran boyutlarında veya kendi boyutunuzda nasıl değiştiğini keşfetmenizi teşvik eden bir duyarlı tasarım görünümü vardır.
Edge'in F12 Emülasyonu
Windows Phone'u taklit etmek için Microsoft Edge'in yerleşik emülasyonunu kullanın.
Edge, eski uyumlulukla birlikte gönderilmediğinden, sayfanızı Internet Explorer'ın eski sürümlerinde nasıl görüneceğini simüle etmek için IE 11'in emülasyonunu kullanın.
Cihaz emülatörleri ve simülatörleri
Cihaz simülatörleri ve emülatörleri yalnızca tarayıcı ortamını değil, cihazın tamamını simüle eder. Bu sürümler, işletim sistemi entegrasyonu gerektiren öğeleri (ör. sanal klavyelerle form girişi) test etmek için yararlıdır.
Android Emulator
Android Emulator'da Stok Tarayıcı
Chrome'u şu anda Android emülatörüne yükleme imkanı yoktur. Ancak bu kılavuzun ilerleyen bölümlerinde bahsedeceğimiz Android Tarayıcı, Chromium Content Shell ve Android için Firefox'u kullanabilirsiniz. Chromium Content Shell, aynı Chrome oluşturma motorunu kullanır ancak tarayıcıya özgü özelliklerin hiçbirini içermez.
Android emülatör, Android SDK'sı ile birlikte gelir. Android SDK'sını buradan indirmeniz gerekir. Ardından, sanal cihaz oluşturma ve emülatör başlatma talimatlarını uygulayın.
Emülatörünüz başlatıldıktan sonra Tarayıcı simgesini tıklayarak sitenizi Android için eski Stock Tarayıcı'da test edebilirsiniz.
Android'de Chromium Content Shell
Android Emulator İçerik Kabuğu
Android için Chromium Content Shell'i yüklemek üzere emülatörünüz açıkken komut isteminde aşağıdaki komutları çalıştırın:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Artık sitenizi Chromium Content Shell ile test edebilirsiniz.
Android'de Firefox
Android Emulator'da Firefox simgesi
Chromium'un Content Shell'ine benzer şekilde, Firefox'u emülatöre yüklemek için bir APK alabilirsiniz.
https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/ adresinden doğru.apk dosyasını indirin.
Buradan, dosyayı açık bir emülatöre veya bağlı bir Android cihaza aşağıdaki komutu kullanarak yükleyebilirsiniz:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
iOS Simülatörü
Mac OS X için iOS simülasyon aracı, App Store'dan yükleyebileceğiniz Xcode ile birlikte gelir.
İşlemi tamamladığınızda Apple'ın dokümanlarını inceleyerek simülatörle nasıl çalışacağınızı öğrenin.
Modern.IE
Modern IE sanal makinesi
Modern.IE sanal makineleri, VirtualBox (veya VMWare) aracılığıyla bilgisayarınızda IE'nin farklı sürümlerine erişmenize olanak tanır. Bu indirme sayfasından bir sanal makine seçin.
Bulut tabanlı emülatör ve simülasyon araçları
Emülatörleri kullanamıyorsanız ve gerçek cihazlara erişiminiz yoksa bulut tabanlı emülatörleri kullanabilirsiniz. Bulut tabanlı emülatörlerin gerçek cihazlara ve yerel emülatörlere kıyasla en büyük avantajı, siteniz için farklı platformlarda birim testlerini otomatikleştirebilmenizdir.
- Manuel test için en kolay kullanımlı araç BrowserStack (ticari)'tir. Bir işletim sistemi, tarayıcı sürümünüz ve cihaz türünüzü seçtikten sonra göz atacağınız bir URL seçtiğinizde, etkileşim kurabileceğiniz barındırılan bir sanal makine başlatılır. Ayrıca, aynı ekranda birden fazla emülatör çalıştırarak uygulamanızın aynı anda birden fazla cihazda nasıl göründüğünü ve hissettirdiğini test edebilirsiniz.
- SauceLabs (ticari), bir emülatör içinde birim testleri çalıştırmanıza olanak tanır. Bu, sitenizdeki bir akış için komut dosyası oluşturmak ve daha sonra bu akışla ilgili video kaydını çeşitli cihazlarda izlemek için çok yararlı olabilir. Sitenizle manuel test de yapabilirsiniz.
- Device Anywhere (ticari), emülatör yerine uzaktan kontrol edebileceğiniz gerçek cihazlar kullanır. Bu, belirli bir cihazda bir sorunu yeniden oluşturmanız gerektiğinde ve önceki kılavuzlardaki seçeneklerden hiçbirinde hatayı göremediğinizde çok faydalıdır.
- LambdaTest (ticari), 2.000'den fazla tarayıcı ve işletim sistemi kombinasyonunda manuel tarayıcılar arası test gerçekleştirmenize yardımcı olur. Kullanıcılar karmaşık hataların videolarını kaydedip MS Teams, Slack gibi entegrasyonlar aracılığıyla paylaşabilir. Kullanıcılar testleri paralel olarak çalıştırarak testlerini hızlandırabilir.