Emulieren und Testen anderer Browser

Ihr Auftrag endet nicht damit, dass Ihre Website in Microsoft Edge und Android gut funktioniert. Obwohl das Tool "Geräteemulation " eine Reihe anderer Geräte wie Smartphones simulieren kann, empfehlen wir Ihnen, lösungen für die Emulation zu testen, die von anderen Browsern bereitgestellt werden.

Zusammenfassung

  • Wenn Sie kein bestimmtes Gerät haben oder eine Spot-Überprüfung durchführen möchten, ist die beste Option, das Gerät direkt in Ihrem Browser zu emulieren.

  • Geräteemulatoren und Simulatoren ermöglichen es Ihnen, Ihre Entwicklungswebsite auf einer Reihe von Geräten von Ihrer Arbeitsstation aus nachzuahmen.

  • Mit cloudbasierten Emulatoren können Sie Komponententests für Ihre Website plattformübergreifend automatisieren.

Browser-Emulatoren

Browseremulatoren eignen sich hervorragend zum Testen der Reaktionsfähigkeit einer Website. Ein Browseremulator emuliert jedoch keine Unterschiede in der API, CSS-Unterstützung und bestimmten Verhaltensweisen, die sich nur in einem mobilen Browser auf einem tatsächlichen Gerät manifestieren. Testen Sie Ihre Website in Browsern, die auf echten Geräten ausgeführt werden, um sicher zu sein, dass sich alles wie erwartet verhält.

Firefox Responsive Design View

Firefox verfügt über eine reaktionsfähige Designansicht , die Sie ermutigt, nicht mehr in Bezug auf bestimmte Geräte zu denken und stattdessen zu untersuchen, wie sich Ihr Design bei gängigen Bildschirmgrößen oder auf Ihrer eigenen Bildschirmgröße ändert, indem Sie die Ränder des Fensters ziehen.

EdgeHTML-Emulation

Verwenden Sie zum Emulieren von Windows Phones die integrierte Microsoft Edge-Emulation (EdgeHTML).

Verwenden Sie die IE 11-Emulation , um zu simulieren, wie Ihre Seite in älteren Versionen von Internet Explorer aussehen könnte.

Geräte-Emulatoren und -Simulatoren

Gerätesimulatoren und Emulatoren simulieren nicht nur die Browserumgebung, sondern das gesamte Gerät. Jeder Simulator ist nützlich, um Dinge zu testen, die eine Betriebssystemintegration erfordern, z. B. Formulareingaben mit virtuellen Tastaturen.

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 wir weiter unten in diesem Artikel überprüfen. Chromium Inhaltsshell führt dieselbe Chromium Rendering-Engine wie Microsoft Edge aus, kommt aber ohne browserspezifische Features aus.

Der Android-Emulator enthält das Android SDK, das Sie als Teil von Android Studio herunterladen müssen. Befolgen Sie dann die Anweisungen, um ein virtuelles Gerät einzurichten und den Emulator zu starten. 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 Inhaltsshell testen.

Firefox unter Android

Ähnlich wie bei der Chromium Content Shell können Sie ein APK abrufen, 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.

Hinweis

Um zu vermeiden, dass Sie Xcode jedes Mal öffnen müssen, wenn Sie den iOS-Simulator verwenden möchten, öffnen Sie ihn, klicken Sie mit der rechten Maustaste auf das iOS-Simulatorsymbol in Ihrem Dock, und wählen Sie dann Im Dock beibehalten aus. Klicken Sie jetzt einfach auf das Symbol, wann immer Sie es benötigen.

Microsoft Edge (EdgeHTML)

Wenn Sie Ihre Website oder App mit Microsoft-Browsern testen müssen und nicht über die erforderlichen Versionen von Windows verfügen, können Sie BrowserStack verwenden, der das Testen vieler Kombinationen von Microsoft-Browsern und Betriebssystemen in der Vergangenheit und Gegenwart unterstützt. Sie können beispielsweise alle Versionen von Microsoft Edge (Chromium) ab Version 80 und Microsoft Edge (EdgeHTML) versionen 15 bis 18 testen. Das Testen von Microsoft Edge ist in BrowserStack kostenlos. Weitere Informationen finden Sie unter Microsoft Edge-Browsertests unter BrowserStack.

Cloudbasierte Emulatoren und Simulatoren

Wenn Sie die Emulatoren nicht verwenden können und keinen Zugriff auf echte Geräte haben, sind cloudbasierte Emulatoren das nächstbeste. Ein großer Vorteil von cloudbasierten Emulatoren gegenüber echten Geräten und lokalen Emulatoren ist, dass Sie Komponententests für Ihre Website auf verschiedenen Plattformen automatisieren können.

Die folgende Liste enthält ein Beispiel für cloudbasierte Emulatoren und Testwebsites. Überprüfen Sie die Beschreibungen für Features oder Funktionen, die sie bei der Auswahl einer Testwebsite berücksichtigen sollten. Führen Sie Ihre eigene Suche durch, um den besten cloudbasierten Emulator für Ihre Anforderungen zu finden.

  • BrowserStack unterstützt Sie bei manuellen Tests. Sie wählen ein Betriebssystem, eine Browserversion, einen Gerätetyp und eine URL zum Durchsuchen aus. BrowserStack startet dann einen gehosteten virtuellen Computer, mit dem Sie interagieren können. Sie können mehrere Emulatoren auf demselben Bildschirm ausführen, um das Erscheinungsbild Ihrer App auf mehreren Geräten gleichzeitig zu testen.

  • Mobileum verwendet keine Emulatoren, sondern echte Geräte, die Sie remote steuern können. Dies ist nützlich, wenn Sie ein Problem auf einem bestimmten Gerät reproduzieren müssen und ein Problem in einigen Berichten möglicherweise nicht angezeigt wird.

  • HeadSpin unterstützt Sie bei manuellen browserübergreifenden Tests auf Tausenden von echten Geräten, Browsern und Betriebssystemen. Sie können Videos von komplexen Fehlern aufzeichnen und diese über Integration wie Slack, JIRA und mehr freigeben. Beschleunigen Sie Ihre Markteinführung, indem Sie parallel testen.

  • LambdaTest unterstützt Sie bei manuellen browserübergreifenden Tests in einer Kombination aus verschiedenen Browsern und Betriebssystemen. Sie können Videos zu komplexen Fehlern aufzeichnen und diese durch Integration wie Microsoft Teams, Slack usw. freigeben. Sie können Ihre Tests beschleunigen, indem Sie Tests parallel ausführen.

  • Mit SauceLabs können Sie Komponententests innerhalb eines Emulators ausführen. Dies kann hilfreich sein, um einen Flow durch Ihre Website zu erstellen und die Videoaufzeichnung anschließend auf verschiedenen Geräten anzuzeigen. Sie können auch manuelle Tests mit Ihrer Website durchführen.

  • TestingBot unterstützt Sie bei manuellen und automatisierten Tests für verschiedene Browser- und Betriebssystemkombinationen. Testen Sie sowohl Ihre Websites als auch ihre mobilen Apps auf den Emulatoren und physischen Geräten von TestingBot.

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 befindet sich hier und wurde von Meggin Kearney (Technical Writer) und Paul Bakaus (Open Web Developer Advocate bei Google | Tools, Leistung, Animation, UX).

Creative Commons License Dieses Werk ist unter einer Creative Commons Attribution 4.0 International License lizenziert.