Sie müssen jedoch nicht unbedingt dafür sorgen, dass Ihre Website sowohl in Chrome als auch unter Android gut funktioniert. Obwohl Der Gerätemodus kann eine Reihe anderer Geräte wie iPhones simulieren. Schau dir auch andere Geräte an, Browserlösungen für die Emulation.
Zusammenfassung
- Wenn Sie ein bestimmtes Gerät nicht haben oder etwas stichprobenartig überprüfen möchten, ist die beste Option das Gerät direkt in Ihrem Browser zu emulieren.
- Mit Geräteemulatoren und Simulatoren können Sie Ihre Entwicklungs-Website auf einer Reihe von Geräten nachahmen, von auf Ihrer Workstation.
- Mit cloudbasierten Emulatoren können Sie Einheitentests für Ihre Website auf verschiedenen Plattformen automatisieren.
Browseremulatoren
Browseremulatoren eignen sich hervorragend zum Testen der Reaktionsfähigkeit einer Website, sie ahmen jedoch keine Unterschiede nach. der API, der CSS-Unterstützung und bestimmter Verhaltensweisen, die Sie in einem mobilen Browser bemerkbar machen würden. Testen Sie Ihre Website auf auf echten Geräten ausführen, um sicherzustellen, dass alles wie erwartet funktioniert.
Firefox Ansicht „Responsives Webdesign“
Die Ansicht Responsives Webdesign in Firefox soll dazu beitragen, dass Sie nicht mehr über spezifische Geräte und untersuchen stattdessen, wie sich Ihr Design bei gängigen Bildschirmgrößen oder Ihrer eigenen Größe ändert, an den Rändern ziehen.
F12-Emulation von Edge
Um Windows Phones zu emulieren, verwenden Sie die integrierte Emulation von Microsoft Edge.
Da Edge nicht mit älterer Kompatibilität geliefert wird, verwenden Sie die Emulation von IE 11, um zu simulieren, wie Ihr würde die Seite in älteren Versionen des Internet Explorers aussehen.
Geräteemulatoren und -simulatoren
Gerätesimulatoren und Emulatoren simulieren nicht nur die Browserumgebung, sondern das gesamte Gerät. Sie sind nützlich, um Dinge zu testen, die eine Betriebssystemintegration erfordern, z. B. die Formulareingabe mit virtuellen Tastaturen.
Android Emulator
Stock-Browser im Android-Emulator
Im Moment gibt es keine Möglichkeit, Chrome in einem Android-Emulator zu installieren. Sie können jedoch das den Android-Browser, die Chromium Content Shell und Firefox für Android, die wir später in diesem . Chromium Content Shell nutzt die gleiche Rendering-Engine von Chrome, bietet jedoch keine der browserspezifische Funktionen nutzen.
Im Android Emulator ist das Android SDK enthalten, das Sie hier herunterladen müssen. Dann Folgen Sie der Anleitung zum Einrichten eines virtuellen Geräts und zum Starten des Emulators.
Klicke nach dem Starten des Emulators auf das Browser-Symbol, um deine Website auf der alten Stock-Browser für Android.
Chromium Content Shell unter Android
Inhalts-Shell des Android-Emulators
Um die Chromium Content Shell für Android zu installieren, lassen Sie den Emulator weiterlaufen und führen Sie Folgendes aus: über eine Eingabeaufforderung ausführen:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Jetzt können Sie Ihre Website mit der Chromium Content Shell testen.
Firefox für Android
Firefox-Symbol im Android-Emulator
Ähnlich wie bei der Content Shell von Chromium können Sie ein APK für die Installation von Firefox im Emulator abrufen.
Laden Sie die richtige APK-Datei von https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/.
Von hier aus kannst du die Datei in einem offenen Emulator oder einem verbundenen Android-Gerät mit der folgenden Befehl:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
iOS-Simulator
Der iOS-Simulator für Mac OS X enthält Xcode, den Sie aus dem App Store installieren können.
Wenn Sie fertig sind, finden Sie in der Dokumentation von Apple Informationen zur Verwendung des Simulators.
Modern.IE
Moderne IE-VM
Mit Modern.IE Virtual Machines können Sie auf Ihrem Computer über VirtualBox auf verschiedene Versionen von IE zugreifen (oder VMware). Wählen Sie auf der Downloadseite eine virtuelle Maschine aus.
Cloudbasierte Emulatoren und Simulatoren
Wenn Sie die Emulatoren nicht verwenden können und keinen Zugriff auf echte Geräte haben, sind cloudbasierte Emulatoren die nächstbeste zu sein. Ein großer Vorteil cloudbasierter Emulatoren gegenüber realen Geräten und lokalen Emulatoren können Sie Einheitentests für Ihre Website plattformübergreifend automatisieren.
- BrowserStack (Commercial) ist am einfachsten für manuelle Tests geeignet. Sie wählen einen Operator aus, wählen Sie Ihre Browserversion und den Gerätetyp sowie eine URL zum Aufrufen aus. Daraufhin wird eine virtuellen Maschinen gehostet werden, mit der Sie interagieren können. Sie können auch mehrere Emulatoren in der Bildschirm angezeigt. So kannst du testen, wie deine App auf verschiedenen Geräten gleichzeitig aussieht und funktioniert. .
- Mit SauceLabs (kommerziell) können Sie Einheitentests innerhalb eines Emulators ausführen, der ist sehr nützlich, um einen Datenfluss auf Ihrer Website zu erstellen und sich ein entsprechendes Video anzusehen. später auf verschiedenen Geräten. Sie können Ihre Website auch manuell testen.
- Device Anywhere (kommerziell) verwendet keine Emulatoren, sondern echte Geräte, die Sie steuern können Remote-Zugriff. Dies ist sehr nützlich, wenn Sie ein Problem auf einem bestimmten Gerät und kann den Fehler bei keiner der Optionen in den vorherigen Leitfäden sehen.
- Mit LambdaTest (kommerziell) können Sie manuelle browserübergreifende Tests für eine Kombination durchführen. mit über 2.000 Browsern und Betriebssysteme. Nutzer können Videos von komplexen Programmfehlern und Ereignissen aufnehmen über Integrationen wie MS Teams, Slack und mehr teilen. Nutzende können ihre Tests beschleunigen, Tests parallel ausführen.