Il tuo compito non si limita a garantire che il tuo sito funzioni al meglio su Chrome e Android. Anche se La Modalità dispositivo può simulare una serie di altri dispositivi, come gli iPhone; ti invitiamo a dare un'occhiata ad altre soluzioni browser per l'emulazione.
Riepilogo
- Quando non hai un dispositivo specifico o vuoi fare un controllo casuale su qualcosa, l'opzione migliore consiste nell'emulare il dispositivo direttamente nel browser.
- Gli emulatori e i simulatori di dispositivi consentono di simulare il sito di sviluppo su una vasta gamma di dispositivi, dalla tua workstation.
- Gli emulatori basati su cloud ti consentono di automatizzare i test delle unità per il tuo sito su diverse piattaforme.
Emulatori di browser
Gli emulatori di browser sono ottimi per testare la reattività di un sito, ma non emulano le differenze in API, il supporto CSS e alcuni comportamenti che si vede su un browser mobile. Testa il tuo sito su browser in esecuzione su dispositivi reali, per assicurarti che tutto funzioni come previsto.
Firefox Visualizzazione design reattivo
Firefox dispone di una visualizzazione responsive design che ti incoraggia a smettere di pensare in termini di specifiche e scopri come cambia il design con schermi di dimensioni comuni o alle tue dimensioni trascinando i bordi.
Emulazione F12 di Edge
Per emulare i Windows Phone, utilizza l'emulazione integrata di Microsoft Edge.
Poiché Edge non viene fornito con compatibilità precedente, utilizza l'emulazione di IE 11 per simulare il modo in cui verrebbe mostrata nelle versioni precedenti di Internet Explorer.
Emulatori e simulatori di dispositivi
I simulatori e gli emulatori dei dispositivi simulano non solo l'ambiente del browser, ma l'intero dispositivo. Sono utili per testare elementi che richiedono l'integrazione del sistema operativo, ad esempio l'input di moduli con tastiere.
emulatore Android
Browser stock nell'emulatore Android
Al momento, non è possibile installare Chrome su un emulatore Android. Tuttavia, puoi utilizzare Browser Android, Chromium Content Shell e Firefox per Android, che tratteremo più avanti guida. Chromium Content Shell utilizza lo stesso motore di rendering di Chrome, ma è privo di funzionalità specifiche del browser.
L'emulatore Android viene fornito con l'SDK Android, che devi scaricare da qui. Poi segui le istruzioni per configurare un dispositivo virtuale e avviare l'emulatore.
Una volta avviato l'emulatore, fai clic sull'icona del browser per testare il sito nella il vecchio browser Stock per Android.
Chromium Content Shell su Android
Shell dei contenuti dell'emulatore Android
Per installare Chromium Content Shell per Android, lascia l'emulatore in esecuzione ed esegui questo comando al prompt dei comandi:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Ora puoi testare il tuo sito con Chromium Content Shell.
Firefox su Android
Icona di Firefox sull'emulatore Android
Analogamente a Content Shell di Chromium, puoi ottenere un APK per installare Firefox nell'emulatore.
Scarica il file .apk corretto da https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/.
Da qui, puoi installare il file su un emulatore aperto o su un dispositivo Android connesso con seguente comando:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
Simulatore iOS
Il simulatore iOS per Mac OS X include Xcode, che puoi installare dall'App Store.
Al termine, scopri come utilizzare il simulatore nella documentazione di Apple.
Modern.IE
VM IE moderna
Le macchine virtuali Modern.IE consentono di accedere a diverse versioni di IE sul tuo computer tramite VirtualBox (o VMWare). Scegli una macchina virtuale nella pagina di download qui.
Emulatori e simulatori basati su cloud
Se non puoi utilizzare gli emulatori e non hai accesso a dispositivi reali, allora gli emulatori basati su cloud la prossima cosa migliore. Un grande vantaggio degli emulatori basati su cloud rispetto a dispositivi reali e locali è che puoi automatizzare i test delle unità per il tuo sito su diverse piattaforme.
- BrowserStack (commerciale) è il più facile da utilizzare per i test manuali. Selezioni un'operazione sistema, seleziona la versione del browser e il tipo di dispositivo, seleziona un URL da sfogliare e viene avviato con cui puoi interagire. Puoi anche attivare più emulatori stessa schermata, consentendoti di testare l'aspetto e il design della tua app su più dispositivi contemporaneamente nel tempo.
- SauceLabs (commerciale) consente di eseguire i test delle unità all'interno di un emulatore, che può essere molto utile per creare uno script di flusso sul tuo sito e guardare la registrazione video di questo su vari dispositivi. Puoi anche eseguire test manuali del sito.
- Device Anywhere (commerciale) non utilizza emulatori, ma dispositivi reali che puoi controllare da remoto. Questo è molto utile nel caso in cui tu debba riprodurre un problema su un dispositivo e non può vedere il bug in nessuna delle opzioni delle guide precedenti.
- LambdaTest (commerciale) consente di eseguire test cross-browser manuali su una combinazione di oltre 2000 browser e e sistemi operativi diversi. Gli utenti potranno registrare video di bug complessi e di live la condividi tramite integrazioni come MS Teams, Slack e altre ancora. Gli utenti possono velocizzare i test eseguendo test in parallelo.