Automatisierte Tests auf mehreren Browsern

html

Tests auf mehreren Browsern sind heutzutage ein Muss, aber lohnt es sich, diese Tests zu automatisieren? Wir sollten dies definitiv in Betracht ziehen. Der folgende Artikel kann Ihnen helfen, diese Entscheidung zu treffen. Wir zeigen Ihnen, wie Sie die Nachteile minimieren und die Vorteile dieser Lösung nutzen können. Sie werden lernen, wie Sie solche Arten von Tests in Codeception einrichten und wo Sie die Browser bekommen, die Sie in den Tests verwenden möchten.

Cross-Browser-Testing

Cross-Browser-Testing (d. h. Tests auf verschiedenen Browsern) ist heutzutage einer der wichtigsten Aspekte bei der Erstellung einer Webseite oder Webanwendung. Jeder verantwortungsvolle Entwickler muss die Kompatibilität seiner Seite mit den von den Benutzern verwendeten Browsern berücksichtigen. Obwohl die Unterschiede zwischen den Browsern viel kleiner sind als früher, können wir immer noch häufig auf Fälle unterschiedlicher Interpretationen von JavaScript-Code stoßen oder darauf, dass eine bestimmte Browserversion ein spezifisches Fragment unseres CSS nicht unterstützt. Wir müssen auch bedenken, dass unsere Benutzer nicht immer die neueste Version eines Browsers verwenden. Deshalb wird es so wichtig sein, mehrere Versionen eines bestimmten Browsers zu überprüfen.

All diese Traffic-Analysen auf unserer Seite können uns dazu führen, eine wirklich große Liste von Browsern und Geräten zu erstellen, die wir testen sollten, um sicherzustellen, dass wir unseren Benutzern eine Seite von höchster Qualität bieten Drupal-Dienstleistungen. Hier stellt sich die Frage: Wenn ich auf allen Geräten immer dasselbe mache und den gleichen Effekt erwarte, wäre es da nicht eine gute Idee, dass automatisierte Tests mir dabei helfen? Ich glaube, das ist etwas, das es wert ist, bedacht zu werden. Es ist auch gut, die Kosten und Nutzen einer solchen Lösung zu berechnen.

Alle unten beschriebenen Beispiele basieren auf Codeception, aber es spricht nichts dagegen, diese Lösungen auf Ihre eigene Technologie zu übertragen. Wenn Sie noch nicht wissen, was Codeception ist und wie es in Ihrem Projekt eingerichtet wird, lesen Sie unbedingt darüber, wie Sie Tests in der Docker-Konsole automatisieren.

Umgebungen

In diesem Artikel beginnen wir an dem Punkt, an dem wir ein funktionsfähiges Projekt mit einem eingerichteten Browser haben.

Codeception hat vorausgesehen, dass Benutzer Tests in verschiedenen Konfigurationen ausführen möchten, sodass wir in unserer Konfigurationsdatei (z. B. acceptance.suite.yml) die Möglichkeit haben, die Standardeinstellungen zu überschreiben. Ein Beispiel kann der Wunsch sein, mehrere verschiedene Browser zu verwenden, wie im Bild unten:

Im Abschnitt "env" können Sie Einstellungen unter einem beliebigen Namen (hier phantom, chrome, firefox) definieren, die die zuvor deklarierte Standardkonfiguration überschreiben.

Wenn die allgemeine Konfiguration des Tests bereits hinter uns liegt, können wir zu den spezifischen Testdateien übergehen. In diesem Fall können wir die entsprechende Annotation zuweisen – wie im Beispiel unten – und entscheiden, welche Tests in einer bestimmten Umgebung ausgeführt werden sollen.

Jetzt können wir einfach zwischen den Konfigurationen wechseln und auswählen, welche Tests ausgeführt werden sollen. Um dies zu tun, müssen wir lediglich unsere Tests ausführen und den Parameter --env mit dem Namen der spezifischen Umgebung zum auszuführenden Befehl hinzufügen. Basierend auf dem vorherigen Artikel wäre das z. B.:

dcon ‘test --env chrome’

Wenn wir Tests mit dem Chrome-Browser ausführen möchten. Anführungszeichen wurden hinzugefügt, damit die Docker-Konsole den env-Parameter als Teil des Testbefehls und nicht als separates Argument behandelt.)

Wir können auch Tests in mehreren Umgebungen durchführen, indem wir den Befehl ausführen:

dcon ‘test --env chrome --env phantom --env firefox’

oder die Einstellungen mit dem Befehl kombinieren:

dcon ‘test --env chrome,mobile --env phantom,desktop --env firefox,desktop’

Es ist auch erwähnenswert, dass wir auf die aktuell eingestellte Umgebung im Test auf diese Weise verweisen können:

Dies gibt uns die Möglichkeit, spezifische Aktionen je nach Browsereinstellung auszuführen und so – mögliche Abweichungen zu handhaben, von denen wir wissen und die akzeptabel sind.

Docker-Images für Selenium

Da wir nun wissen, wie man es auf verschiedene Umgebungen einstellt, ist es sinnvoll, sich folgende Fragen zu stellen:

1. Muss ich alle Browser auf meinem Computer haben?
2. Wie können Sie einfach entscheiden, welche Version jetzt getestet werden soll?

Hier kommen uns beispielsweise Docker-Images, die von Selenium bereitgestellt werden, zur Hilfe. Derzeit ermöglichen sie es, einen Container mit einer ausgewählten Version des Chrome-, Firefox- oder Opera-Browsers zu erstellen, der bereit ist, darauf Tests durchzuführen. Dies ist wirklich eine gute Lösung, denn das Ändern der Browserversion erfordert nur eine Änderung der Zahl im Image-Tag (wir können auch mehr als eine Version erstellen und definieren).

Zusätzlich können wir den hub verwenden, um eine ganze Datenbank mit verschiedenen Browserversionen aufzubauen, die wir für Tests zur Verfügung haben. Ich empfehle, mit der Erstellung Ihrer eigenen Strukturen zu experimentieren, vorzugsweise mit der Verwendung der docker-compose-Datei. Das Projekt ist gut dokumentiert und wird kontinuierlich weiterentwickelt. Kürzlich wurde es möglich, Ihre Tests aufzuzeichnen. Für diejenigen, die kleine Projekte erstellen, kann es wichtig sein zu wissen, dass all diese Images vollkommen frei zugänglich und nutzbar sind. Der größte Nachteil ist die begrenzte Anzahl verfügbarer Browser.

BrowserStack

Wenn wir jedoch Zugriff auf mehr Browser oder Geräte haben möchten, sind verschiedene Plattformen, die die Möglichkeit bieten, sich mit einer bestimmten Konfiguration (Gerät/Betriebssystem/Browser mit Auswahl verschiedener Versionen) zu verbinden, eine gute Alternative. Bei Droptica haben wir uns entschieden, BrowserStack zu verwenden. Der Vorteil dieser Lösung ist die einfache Integration mit Codeception und unser umfangreiches Wissen über das Tool, das wir bereits für manuelle Tests genutzt haben.

Dank der Verwendung dieser Technik haben wir oft Zugriff auf Hunderte oder sogar mehrere Tausend verschiedene Systemkonfigurationen. Der Mehrwert ist auch der Zugriff auf das Verwaltungs-Panel, wo wir die aktuellen und archivierten Ergebnisse unserer Tests und die Aufzeichnungen ihres Fortschritts einsehen können. Die Wahl dieser Option erfordert jedoch, dass wir die Ausgaben in Form des Zugangs zu einer solchen Plattform im Projektbudget berücksichtigen.

Vor- und Nachteile von automatisierten Tests auf verschiedenen Browsern

Ein unbestreitbarer Vorteil der Verwendung automatisierter Tests auf verschiedenen Browsern ist die Bereitstellung eines hochwertigen Tools für die QA-Abteilung, das ihre Arbeit erheblich unterstützt und somit zur Verbesserung der Gesamtqualität des Endprodukts beitragen sollte.

Es wird die Zeit sicherlich verkürzen, die das Testerteam mit der Durchführung manueller Tests verbringen muss. Wenn wir nicht automatisch verschiedene Browserkombinationen prüfen, muss sich unser Team damit befassen.

Was die Nachteile betrifft – in erster Linie erfordert es Zeit, eine solche Lösung vorzubereiten und zu warten. Ich erinnere daran, dass wir hier nur über die Zeit sprechen, die allein darauf verwendet wird, die Möglichkeit zu schaffen, auf mehreren Browsern zu testen. Die Zeit, um die Tests zu schreiben und vorzubereiten, ist ein anderes Thema. Beim Schreiben können wir jedoch auf einen Fall von Browserunterschieden stoßen, die ebenfalls behandelt werden müssen.

Ein weiterer Nachteil wird die Zeit sein, die benötigt wird, um die automatisierten Tests durchzuführen, die länger dauern wird, wenn ein weiterer Browser hinzugefügt wird. Es sollte jedoch berücksichtigt werden, dass in diesem Fall die Alternative darin besteht, diese Tests manuell durchzuführen, was ebenfalls Zeit in Anspruch nimmt.

Nach Abwägung der Vor- und Nachteile können wir entscheiden, ob es für unser Projekt rentabel sein wird, automatisierte Tests auf mehreren Browsern laufen zu lassen, aber bevor wir dahin kommen, lassen Sie uns versuchen, die Waage zugunsten der Tests zu kippen.

Parallele Ausführung, oder wie man die Nachteile reduziert

Es scheint ziemlich offensichtlich, dass wenn wir unsere Tests auf mehr als einem Browser ausführen möchten, sich die Ausführungszeit verlängern wird, aber muss das wirklich sein?

Hier kann Parallele Ausführung, also das gleichzeitige Ausführen mehrerer Tests, helfen. Dank der Verwendung von Docker-Images und der entsprechenden Konfiguration des Projekts können wir die Zeit, die für Tests benötigt wird, erheblich reduzieren. Jetzt muss sich die Zeit für die Durchführung unserer Tests nicht so drastisch erhöhen, jedes Mal, wenn wir einen weiteren Browser oder eine andere Version hinzufügen möchten.

Visuelle Tests, oder wie man die Vorteile nutzt

Der häufigste Aspekt, der je nach Browser unterschiedlich sein wird, ist der visuelle Aspekt, und auf diesen legen wir oft den größten Wert bei solchen Tests. Es ist jedoch auch die Art von Tests, bei denen es leicht ist, sich in einer Routine zu verlieren und ein Detail zu übersehen. Daher scheint es eine gute Idee zu sein, eine Maschine zur Unterstützung dieser Tests zu nutzen.

Wie ich in einem der vorherigen Artikel beschrieben habe, verwenden wir bei Droptica Visualception für automatisierte visuelle Tests. Gleiches gilt für mehrere Browser, da sich an der Einstellung von Visualception selbst nichts ändert. Wir haben einen separaten Bericht für jede Umgebung (ähnlich wie der unten gezeigte).

Die Überprüfung eines solchen Berichts ist sicherlich viel einfacher und angenehmer als das Vergleichen der Unterschiede selbst, wobei – trotz wachsamen Auges – minimale Änderungen übersehen werden könnten, die der automatisierte Prozess erkennen und hervorheben wird. Ein interessanter Fall ist ein Test, mit dem ich eine minimale Verschlechterung der Bildqualität auf einer Seite entdecken konnte, die meiner Aufmerksamkeit normalerweise entgangen wäre.

Fazit

Ob Tests in Ihrem Projekt benötigt werden, ist nicht offensichtlich. Es muss abgewogen und manchmal innerhalb einer Drupal-Beratung analysiert werden, um zu sehen, ob die Vorteile die Kosten überwiegen, die aufgebracht werden müssen.

Parallele Ausführung wird Ihnen helfen, die Nachteile der verlängerten Zeit, die für die Durchführung automatisierter Tests für mehrere Konfigurationen benötigt wird, zu minimieren.

Visuelle Tests sind ein idealer Kandidat für die Durchführung automatisierter Tests auf mehreren Browsern.

Zusammenfassung

Um die eingangs gestellte Frage zu beantworten, ob es sich lohnt, Tests zu automatisieren – ich glaube, es lohnt sich. Ich ermutige Sie, dies zu berücksichtigen, da die im Text beschriebenen Vorteile messbare Nutzen haben könnten.