Het is niet uw taak om ervoor te zorgen dat uw site goed werkt in Chrome en Android. Hoewel de Apparaatmodus een reeks andere apparaten zoals iPhones kan simuleren, raden we u aan andere browseroplossingen voor emulatie te bekijken.
Samenvatting
- Als u niet over een bepaald apparaat beschikt, of iets ter plaatse wilt controleren, kunt u het beste het apparaat rechtstreeks in uw browser emuleren.
- Met apparaatemulators en simulators kunt u uw ontwikkelsite vanaf uw werkstation op een reeks apparaten nabootsen.
- Met cloudgebaseerde emulators kunt u unit-tests voor uw site op verschillende platforms automatiseren.
Browser-emulators
Browsermulators zijn geweldig voor het testen van de responsiviteit van een site, maar ze emuleren geen verschillen in API, CSS-ondersteuning en bepaald gedrag die je in een mobiele browser zou zien. Test uw site in browsers die op echte apparaten worden uitgevoerd, om er zeker van te zijn dat alles zich naar verwachting gedraagt.
De responsieve ontwerpweergave van Firefox
Firefox heeft een responsieve ontwerpweergave die u aanmoedigt om niet langer in termen van specifieke apparaten te denken, maar in plaats daarvan te onderzoeken hoe uw ontwerp verandert op gangbare schermformaten of op uw eigen formaat door de randen te slepen.
Edge's F12-emulatie
Om Windows Phones te emuleren, gebruikt u de ingebouwde emulatie van Microsoft Edge.
Omdat Edge niet wordt geleverd met oudere compatibiliteit, kunt u de emulatie van IE 11 gebruiken om te simuleren hoe uw pagina er in oudere versies van Internet Explorer uit zou zien.
Apparaatemulators en simulatoren
Apparaatsimulators en emulators simuleren niet alleen de browseromgeving, maar het hele apparaat. Ze zijn handig om dingen te testen die OS-integratie vereisen, bijvoorbeeld formulierinvoer met virtuele toetsenborden.
Android-emulator
Aandelenbrowser in Android-emulator
Op dit moment is er geen manier om Chrome op een Android-emulator te installeren. U kunt echter de Android-browser, de Chromium Content Shell en Firefox voor Android gebruiken, die we later in deze handleiding zullen bespreken. Chromium Content Shell gebruikt dezelfde Chrome-rendering-engine, maar wordt geleverd zonder browserspecifieke functies.
De Android-emulator wordt geleverd met de Android SDK die u hier moet downloaden . Volg daarna de instructies om een virtueel apparaat in te stellen en de emulator te starten .
Zodra uw emulator is opgestart, klikt u op het browserpictogram en kunt u uw site testen op de oude Stock Browser voor Android.
Chromium Content Shell op Android
Inhoudshell voor Android-emulator
Om de Chromium Content Shell voor Android te installeren, laat u uw emulator actief en voert u de volgende opdrachten uit vanaf een opdrachtprompt:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Nu kunt u uw site testen met de Chromium Content Shell.
Firefox op Android
Firefox-pictogram op Android-emulator
Net als bij Chromium's Content Shell kunt u een APK verkrijgen om Firefox op de emulator te installeren.
Download het juiste .apk-bestand van https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/ .
Vanaf hier kunt u het bestand op een open emulator of een aangesloten Android-apparaat installeren met de volgende opdracht:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
iOS-simulator
De iOS-simulator voor Mac OS X wordt geleverd met Xcode, die u vanuit de App Store kunt installeren .
Als u klaar bent, leert u via de documentatie van Apple hoe u met de simulator kunt werken.
Modern.IE
Moderne IE-VM
Met Modern.IE Virtual Machines hebt u via VirtualBox (of VMWare) toegang tot verschillende versies van IE op uw computer. Kies hier een virtuele machine op de downloadpagina .
Cloudgebaseerde emulators en simulators
Als je de emulators niet kunt gebruiken en geen toegang hebt tot echte apparaten, dan zijn cloudgebaseerde emulators het beste alternatief. Een groot voordeel van cloudgebaseerde emulators ten opzichte van echte apparaten en lokale emulators is dat u unit-tests voor uw site op verschillende platforms kunt automatiseren.
- BrowserStack (commercieel) is het gemakkelijkst te gebruiken voor handmatig testen. U selecteert een besturingssysteem, selecteert uw browserversie en apparaattype, selecteert een URL om te bladeren en er wordt een gehoste virtuele machine gestart waarmee u kunt communiceren. U kunt ook meerdere emulators op hetzelfde scherm starten, zodat u kunt testen hoe uw app er op meerdere apparaten tegelijk uitziet en aanvoelt.
- Met SauceLabs (commercieel) kunt u unit-tests uitvoeren in een emulator, wat erg handig kan zijn voor het scripten van een stroom door uw site en het achteraf bekijken van de video-opname hiervan op verschillende apparaten. U kunt uw site ook handmatig testen.
- Device Anywhere (commercieel) maakt geen gebruik van emulators, maar van echte apparaten die je op afstand kunt bedienen. Dit is erg handig als u een probleem op een specifiek apparaat moet reproduceren en de bug niet kunt zien in een van de opties in de vorige handleidingen.
- LambdaTest (commercieel) helpt u bij het handmatig uitvoeren van cross-browser tests op een combinatie van meer dan 2000 browsers en besturingssystemen. Gebruikers kunnen video opnemen van complexe bugs en deze zelfs delen via integraties zoals MS Teams, Slack en meer. Gebruikers kunnen hun tests versnellen door tests parallel uit te voeren.