Emulieren und Testen anderer Browser
Um sicherzustellen, dass Ihre Website für alle Ihre Benutzer funktioniert, testen Sie Ihre Website auf anderen Browsern und Geräten. Nicht alle Benutzer verwenden den Browser und das Gerät, die Sie bei der Entwicklung verwendet haben. Wir empfehlen Ihnen, lösungen für die Emulation zu sehen, die von anderen Browsern bereitgestellt werden, zusätzlich zur Verwendung des Geräteemulationstools in Microsoft Edge DevTools.
Zusammenfassung
Es gibt verschiedene Testebenen, die Sie durchführen können, um Ihre Website unter verschiedenen Bedingungen zu testen:
Browseremulatoren helfen Ihnen, schnell zu testen, wie Ihre Website mit verschiedenen Bildschirmgrößen und Auflösungen aussieht und wie sie sich verhält, mit Touch-Ereignisemulation und durch Überschreiben der User-Agent Zeichenfolge, die der Browser sendet. Sie verwenden Browseremulatoren aus dem Browser, in dem Sie entwickeln. Weitere Informationen finden Sie weiter unten unter Browseremulatoren.
Geräteemulatoren und Simulatoren ermöglichen es Ihnen, andere Geräte von Ihrem Entwicklungscomputer aus auszuführen und Ihre Website so zu testen, als ob Sie diese anderen Geräte verwenden würden. Weitere Informationen finden Sie weiter unten unter Geräteemulatoren und Simulatoren.
Mit cloudbasierten Emulatoren können Sie automatisierte Tests für Ihre Website auf verschiedenen Plattformen ausführen. Weitere Informationen finden Sie weiter unten unter Cloudbasierte Emulatoren und Simulatoren.
Browser-Emulatoren
Browseremulatoren eignen sich hervorragend, um zu testen, wie Ihre Website aussieht und sich bei unterschiedlichen Bildschirmgrößen und Auflösungen verhält, wenn Touchereignisse aktiviert sind oder wenn die User-Agent Zeichenfolge auf die User-Agent Zeichenfolge eines anderen Browsers festgelegt ist.
Sie verwenden Browseremulatoren aus dem Browser, in dem Sie entwickeln. In Microsoft Edge können Sie beispielsweise das Geräteemulationstool in DevTools verwenden, um eine Annäherung an das Aussehen und Verhalten Ihrer Website auf verschiedenen Geräten zu erhalten. Weitere Informationen zur Verwendung des Geräteemulationstools in Microsoft Edge DevTools finden Sie unter Emulieren mobiler Geräte (Geräteemulation).
Browseremulatoren emulieren keine Unterschiede in der Web-API-Unterstützung oder CSS-Unterstützung. Das Tool "Geräteemulation " in Microsoft Edge emuliert beispielsweise nicht, wie die verschiedenen Web-APIs oder CSS-Features, die Ihre Website möglicherweise verwendet, in Firefox oder Safari unterstützt werden. Um sicher zu sein, dass sich alles wie erwartet verhält, testen Sie Ihre Website auf Browsern, die auf echten Geräten ausgeführt werden.
Hier sind einige Browser-Emulatoren, die Sie verwenden können, um Ihre Website in anderen Browsern zu testen:
Geräte-Emulatoren und -Simulatoren
Gerätesimulatoren und Emulatoren simulieren das gesamte Gerät, anstatt nur die Browserumgebung zu simulieren. Jeder Simulator ist nützlich, um Aspekte zu testen, die eine Integration mit dem jeweiligen Betriebssystem erfordern, z. B. Formulareingaben mithilfe von Tastaturen mobiler Geräte.
Sie installieren Geräteemulatoren und Simulatoren auf Ihrem Entwicklungscomputer, damit Sie Ihre Website weiterhin auf demselben Computer testen können, auf dem Sie entwickeln, während Sie die Verwendung eines anderen Geräts simulieren.
Android-Emulator
Derzeit gibt es keine Möglichkeit, Microsoft Edge auf einem Android-Emulator zu installieren. Sie können jedoch den Android-Browser, die Chromium Content Shell und Firefox für Android verwenden, die weiter unten in diesem Artikel behandelt werden. Chromium Content Shell führt die gleiche Chromium-Rendering-Engine wie Microsoft Edge aus, bietet jedoch keine browserspezifischen Features.
So verwenden Sie den Android-Emulator:
Laden Sie den Android-Emulator herunter, der als Teil des Android SDK gepackt ist, indem Sie Android Studio herunterladen.
Richten Sie ein virtuelles Gerät ein, indem Sie die Schritte unter Erstellen und Verwalten virtueller Geräte ausführen.
Starten Sie den Emulator, indem Sie die Schritte unter Ausführen von Apps im Android-Emulator ausführen ausführen.
Nachdem Ihr Emulator gestartet wurde, wählen Sie das Browsersymbol aus, und testen Sie Ihre Website im alten Stock Browser für Android.
Chromium-Inhaltsshell unter Android
Um die Chromium Content Shell für Android zu installieren, lassen Sie Ihren Emulator laufen, und führen Sie den folgenden Befehl aus:
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 unter Android
Ähnlich wie bei der Chromium Content Shell können Sie ein APK erhalten, um Firefox auf dem Emulator zu installieren.
Laden Sie die richtige .apk-Datei herunter.
Führen Sie den folgenden Befehl aus, um die Datei auf einem geöffneten Emulator oder einem verbundenen Android-Gerät zu installieren:
adb install <path_to_APK>/fennec-XX.X.XX.android-arm.apk
iOS-Simulator
Der iOS-Simulator für Mac OS X wird mit Xcode bereitgestellt, den Sie aus dem App Store installieren.
Wenn Sie fertig sind, erfahren Sie in der Apple Developer-Dokumentation, wie Sie mit dem Simulator arbeiten.
Um zu vermeiden, dass Sie Xcode jedes Mal öffnen müssen, wenn Sie den iOS-Simulator verwenden möchten, öffnen Sie den iOS-Simulator, klicken Sie mit der rechten Maustaste auf das iOS Simulator-Symbol in Ihrem Dock, und wählen Sie dann Im Dock beibehalten aus. Jetzt können Sie einfach auf das Symbol klicken, wenn Sie es benötigen.
Virtuelle Computer
Um Ihre Website auf anderen Betriebssystemen zu testen, können Sie virtuelle Computer auf Ihrem Entwicklungsgerät ausführen. Hyper-V ist beispielsweise ein Virtualisierungstool, mit dem Sie verschiedene Versionen von Windows und Linux ausführen können. Weitere Informationen finden Sie unter Einführung in Hyper-V unter Windows 10.
Informationen zu anderen virtuellen Computern finden Sie unter Virtuelle Computer in Strategien für die Durchführung von Tests bei MDN.
Cloudbasierte Emulatoren und Simulatoren
Cloudbasierte Emulatoren und Simulatoren sind kommerzielle Lösungen, um Ihre Website auf verschiedenen Geräten und Browsern zu testen, ohne etwas auf Ihrem Entwicklungscomputer installieren zu müssen. Sie sind nützlich, wenn Sie keinen Zugriff auf echte Geräte haben oder wenn Sie keine lokalen Emulatoren verwenden können. Cloudbasierte Lösungen sind auch nützlich für die Automatisierung von Tests auf verschiedenen Plattformen.
Weitere Informationen finden Sie unter Emulatoren in Strategien für die Durchführung von Tests bei MDN.
Siehe auch
Reaktionsfähiges Design:
- Responsive Design-Modus – Firefox.
- Simulieren mobiler Geräte im Gerätemodus : Chrome.
- Responsive Design Mode – Safari.
Android:
- Android Studio
- Erstellen und Verwalten virtueller Geräte , um ein virtuelles Gerät einzurichten.
- Führen Sie Apps im Android-Emulator aus , um den Emulator zu starten.
- Wählen Sie aus, welchen Firefox-Browser Sie in Ihrer Sprache herunterladen möchten: Firefox Android Beta - um die richtige .apk Datei herunterzuladen.
Apfel:
MDN:
Hinweis
Teile dieser Seite sind Änderungen, die auf Arbeiten basieren, die von Google erstellt und geteilt und gemäß den in der Creative Commons Attribution 4.0 International License beschriebenen Bedingungen verwendet werden. Die Originalseite finden Sie hier und wird von Meggin Kearney (Technical Writer) und Paul Bakaus (Open Web Developer Advocate bei Google | Tools, Leistung, Animation, UX).
Dieses Werk ist unter einer Creative Commons Attribution 4.0 International License lizenziert.
Feedback
Bald verfügbar: Im Laufe des Jahres 2024 werden wir GitHub-Issues stufenweise als Feedbackmechanismus für Inhalte abbauen und durch ein neues Feedbacksystem ersetzen. Weitere Informationen finden Sie unter https://aka.ms/ContentUserFeedback.
Feedback senden und anzeigen für