Mobilde Test Et
Hızlı bir kontrol için builder’daki duyarlı görüntü alanı değiştiriciyi kullan, ardından yalnızca mobilde geçerli davranışları gerçek bir cihazda test etmek için publish et.
Proyecta’da mobil testinin iki katmanı vardır: builder içi duyarlı önizleme ve yayımlanan bir URL üzerinde gerçek cihaz testi.
Builder’da duyarlı önizleme
Section titled “Builder’da duyarlı önizleme”Önizleme paneli, adres çubuğunda bir görüntü alanı değiştirici içerir:
| Mod | Boyutlar |
|---|---|
| Desktop | Tam pencere genişliği |
| Tablet | 768 × 1024 |
| Mobile | 375 × 667 |
Düzenleme yaparken düzen sorunlarını erken fark etmek için aralarında geçiş yap. Bu, belirgin duyarlı hataları (taşma, bozuk grid’ler, tıklanamayan butonlar) yakalamak için en hızlı yoldur.
Gerçek bir cihazda test et
Section titled “Gerçek bir cihazda test et”Görüntü alanı değiştirici yalnızca boyutları simüle eder — dokunmatik girişi, gerçek dünyadaki gecikmeyi, mobil tarayıcı tuhaflıklarını veya platforma özgü davranışları simüle etmez. Gerçekten önem verdiğin her şey için (dokunmatik etkileşimler, yükleme istemleri, push bildirimleri, kamera, GPS) gerçek bir cihazda test et:
- Uygulamanı
*.proyecta.livesubdomaininde publish et - URL’yi telefonunun tarayıcısında aç
- PWA desteği eklediysen Add to Home Screen seçeneğini seç ve yüklü deneyimi test et
- Önem verdiğin akışları baştan sona gözden geçir
Yalnızca gerçek bir cihazda yakalayabileceğin şeyler
Section titled “Yalnızca gerçek bir cihazda yakalayabileceğin şeyler”- Dokunma hedefi boyutları — parmaklar fare imleçlerinden büyüktür
- Yapışkan öğeler — görüntü alanı birimleri, mobil tarayıcı chrome’uyla farklı davranır
- Form girişi — otomatik doldurma, klavye türleri, otomatik tamamlama
- iOS Safari tuhaflıkları —
100vhsorunları, kaydırma sekelemesi, sabit konumlandırma - Push bildirim izin akışı — yalnızca üst düzey bir tarayıcı sekmesinde HTTPS üzerinden yayımlanan bir origin’de çalışır; builder’ın önizleme panelinde tetiklenmez (önizleme zaten HTTPS üzerinden sunulsa bile).
- Gerçek (daha yavaş) donanımda performans
Test ipuçları
Section titled “Test ipuçları”- Telefonunun geliştirici araçlarını kullan. macOS’taki Safari, canlı hata ayıklama için mobil Safari’ye bağlanabilir; Chrome ise Android Chrome’a bağlanabilir.
- Yatay modda da test et. Çoğu geliştirici yalnızca dikey modda test eder ve yatay modda ortaya çıkan hataları kaçırır.
- Düşük güç moduyla test et. Animasyonlar ve zamanlayıcılar farklı davranır.
- PWA push bildirimleri için gerçek bir iPhone’da test et. iOS’ta push bildirimleri yalnızca Safari üzerinden yüklenen bir PWA’dan çalışır.