Twoje zadanie nie kończy się na zapewnieniu prawidłowego działania witryny w Chrome i na Androidzie. Chociaż tryb urządzenia może symulować działanie różnych innych urządzeń, takich jak iPhone, zachęcamy do sprawdzenia innych rozwiązań w przeglądarkach.
Podsumowanie
- Jeśli nie masz konkretnego urządzenia lub chcesz coś szybko sprawdzić, najlepiej jest emulować urządzenie bezpośrednio w przeglądarce.
- Emulatory i symulatory urządzeń umożliwiają symulowanie witryny deweloperskiej na różnych urządzeniach na stacji roboczej.
- Emulatory działające w chmurze umożliwiają automatyzację testów jednostkowych witryny na różnych platformach.
Emulatory przeglądarek
Emulatory przeglądarek są świetne do testowania szybkości działania witryny, ale nie emulują różnic w interfejsie API, obsłudze CSS i niektórych zachowań, które można zaobserwować w przeglądarce mobilnej. Przetestuj swoją witrynę w przeglądarkach na rzeczywistych urządzeniach, aby mieć pewność, że wszystko działa zgodnie z oczekiwaniami.
Widok elastycznego projektowania w Firefoksie
Firefox ma tryb elastycznego projektowania, który zachęca do przemyślenia kwestii związanych z konkretnymi urządzeniami i zamiast tego do sprawdzenia, jak Twój projekt zmienia się na ekranach o popularnych rozmiarach lub na ekranie o wybranym przez Ciebie rozmiarze.
Emulacja F12 w Edge
Aby emulować Windows Phone, użyj wbudowanej emulacji w Microsoft Edge.
Edge nie obsługuje starszych wersji, dlatego użyj emulacji IE 11, aby symulować wygląd strony w starszych wersjach przeglądarki Internet Explorer.
emulatory i symulatory urządzeń;
Symulatory i emulatory urządzeń symulują nie tylko środowisko przeglądarki, ale całe urządzenie. Są one przydatne do testowania funkcji wymagających integracji z systemem operacyjnym, na przykład wprowadzania danych w formularzu za pomocą wirtualnych klawiatur.
Android Emulator
Domyślna przeglądarka w Android Emulator
Obecnie nie można zainstalować Chrome na emulatorze Androida. Możesz jednak korzystać z przeglądarki Android, Content Shell w Chromium i Firefoxa na Androida, o których opowiemy w dalszej części tego przewodnika. Chromium Content Shell korzysta z tego samego silnika renderowania co Chrome, ale nie zawiera żadnych funkcji specyficznych dla przeglądarki.
Emulator Androida jest dostarczany z pakietem Android SDK, który musisz pobrać stąd. Następnie postępuj zgodnie z instrukcjami, aby skonfigurować urządzenie wirtualne i uruchomić emulator.
Po uruchomieniu emulatora kliknij ikonę przeglądarki, aby przetestować swoją witrynę w starej domyślnej przeglądarce na Androida.
Chromium Content Shell na Androidzie
Content Shell w Android Emulator
Aby zainstalować Content Shell w Chromium na Androida, pozostaw uruchomiony emulator i w wierszu poleceń uruchom te polecenia:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Teraz możesz przetestować swoją witrynę za pomocą Content Shell w Chromium.
Firefox na Androidzie
Ikona Firefoksa w emulatorze Androida
Podobnie jak w przypadku Content Shell w Chromium, możesz pobrać plik APK, aby zainstalować Firefoxa na emulatorze.
Pobierz odpowiedni plik .apk ze strony https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/.
Następnie możesz zainstalować plik na otwartym emulatorze lub połączonym urządzeniu z Androidem za pomocą tego polecenia:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
Symulator iOS
Symulator iOS na Mac OS X jest dostępny w Xcode, który możesz zainstalować z App Store.
Gdy skończysz, dowiedz się, jak korzystać z symulatora z dokumentacji Apple.
Modern.IE
Nowoczesne maszyny wirtualne IE
Maszyny wirtualne Modern.IE umożliwiają dostęp do różnych wersji Internet Explorera na komputerze za pomocą VirtualBox (lub VMWare). Wybierz maszynę wirtualną na tej stronie.
Emulatory i symulatory działające w chmurze
Jeśli nie możesz korzystać z emulatorów i nie masz dostępu do prawdziwych urządzeń, emulatory działające w chmurze są najlepszym rozwiązaniem. Dużą zaletą emulatorów działających w chmurze w porównaniu z prawdziwymi urządzeniami i emulatorami lokalnymi jest to, że możesz zautomatyzować testy jednostkowe witryny na różnych platformach.
- BrowserStack (wersja komercyjna) jest najłatwiejszym narzędziem do ręcznego testowania. Wybierasz system operacyjny, wersję przeglądarki i typ urządzenia, a następnie adres URL, po czym uruchamia się hostowana maszyna wirtualna, z którą możesz wchodzić w interakcje. Możesz też uruchomić kilka emulatorów na tym samym ekranie, aby przetestować wygląd i działanie aplikacji na różnych urządzeniach jednocześnie.
- SauceLabs (komercyjne) umożliwia uruchamianie testów jednostkowych w emulatorze, co może być bardzo przydatne do tworzenia skryptów przepływu w witrynie i oglądania nagrania wideo na różnych urządzeniach. Możesz też przeprowadzić ręczne testowanie witryny.
- Device Anywhere (wersja komercyjna) nie korzysta z emulatorów, ale z prawdziwych urządzeń, którymi można sterować zdalnie. Jest to bardzo przydatne, gdy chcesz odtworzyć problem na konkretnym urządzeniu i nie możesz znaleźć błędu przy użyciu żadnej z opcji opisanych w poprzednich przewodnikach.
- LambdaTest (komercyjny) pomoże Ci przeprowadzić ręczne testy obsługi na różnych przeglądarkach na ponad 2000 systemów operacyjnych. Użytkownicy będą mogli nagrywać filmy przedstawiające skomplikowane błędy i udostępniać je za pomocą integracji, takich jak MS Teams czy Slack. Użytkownicy mogą przyspieszyć testy, przeprowadzając je równolegle.