UI Testing A Comprehensive Guide
Automatisierung Bewährte Methoden
19 min lesen
Oktober 24, 2024

UI-Tests: Ein umfassender Leitfaden

Das Testen der Benutzeroberfläche zählt zu den wichtigsten Testarten, insbesondere für B2C-Unternehmen. Die Benutzeroberfläche ist das, womit Ihre Kunden interagieren, um Ihnen Geld zu zahlen oder um für Ihre Dienstleistungen zu bezahlen. Wie stellen Sie sicher, dass sie zufrieden sind?

photo
photo
Robert Weingartz
Denis Matusovskiy

Benutzeroberflächentests beziehen sich auf die grafische Schnittstelle der Software, die den Kunden präsentiert wird. Dies ist das, was sie sehen, wenn sie mit Ihrer Software arbeiten möchten. Wenn die Benutzeroberfläche nicht gut funktioniert, werden sie die Mühe, die Sie in ein solides Backend gesteckt haben, nicht wirklich zu schätzen wissen. UI-Tests sind eine natürliche Erweiterung der UX-Qualitätssicherung, die durch ein Tool zur User Acceptance Testing Tool durchgeführt wird. 

Die Wichtigkeit von UI-Tests

Beim Testen der Schnittstelle geht es letztlich darum, Werte zu erhalten oder Werte zu schaffen. Sehen wir uns ein paar Beispiele von Lebensmittel-Liefer-Apps an. 

Die Android-App von Glovo ist bekannt dafür, dass sie die Übersetzung von Artikeln nicht richtig handhabt. Die Namen der Kategorien können in die Sprache Ihrer Schnittstelle übersetzt werden, die Namen der Artikel bleiben jedoch in der Landessprache. Ja, Bilder reichen in der Regel aus, um Ihr Essen im Restaurant und sogar Lebensmittel auszuwählen. Aber diese Last-Minute-Upsell-Optionen im Warenkorb? Die Chancen, zusätzliches Geld zu bekommen, sind gering, wenn ein Ausländer nicht versteht, welches Produkt oder welche Qualitätsverbesserung ihm zusätzlich angeboten wird.

Bei einem anderen Lieferdienst, Wolt, muss man als letzten Schritt der Bestellung über den Bildschirm wischen. Dies ist eine ziemlich robuste Option, um versehentliche Berührungen zu vermeiden, vor allem, wenn Wolt es nicht zulässt, dass Sie eine Bestellung zu irgendeinem Zeitpunkt stornieren. Richtige Testfälle für UI sind im Fall von Wolt ziemlich wichtig: Der Umsatz geht auf 0, wenn die App die Wischgeste nicht richtig registriert. 

Unternehmen mit mehreren Vertriebskanälen sind in einer noch sichereren Position, wenn es um potenziell teure Fehler bei der Qualitätssicherung geht. Selbst wenn ein kostspieliger Fehler bei den Website UI-Testsunterlaufen ist, können die Nutzer Ihr Produkt oder Ihre Dienstleistung immer noch per Telefon oder App kaufen. Einige Unternehmen sind in der Lage, diese Diversifizierung auf die nächste Stufe zu bringen:

„Sie werden auf einigen Bildern sehen, dass es in der Kapsel immer noch einige Hardware-Tasten direkt unter den Displays gibt; Dies soll auch sicherstellen, dass die Astronauten, falls die Displays aus irgendeinem Grund unbrauchbar sind, immer noch Hardware-Tasten benutzen können, um kritische Aktionen einzuleiten, wie beispielsweise auf einen Brand in der Kabine zu reagieren.“

Wendy Shimata, Leiterin des Software-Teams von SpaceX Dragon,

Manueller vs. automatisierter UI-Test: Schritt-für-Schritt-Vergleich

UI-Tests in der Softwaretestung können entweder manuell oder mithilfe automatisierter Tools durchgeführt werden. Jede Methode hat ihre Vor- und Nachteile, und die Wahl hängt von verschiedenen Faktoren wie Projektanforderungen, Budget, Zeitbeschränkungen, Entwicklungsstand und der Komplexität der Anwendung ab. Lassen Sie uns die manuellen und automatisierten UI-Testansätze und deren Schritt-für-Schritt-Prozesse beschreiben.

Manueller UI-Test

Der manuelle UI-Test beinhaltet menschliche Eingriffe, um die Korrektheit der Benutzeroberfläche zu überprüfen. Tester müssen die Anwendung manuell bedienen, verschiedene Funktionen erkunden und das erwartete Verhalten überprüfen.

Schritt-für-Schritt-Prozess

  1. Testplanung: Bestimmen Sie den Umfang der Tests, einschließlich der Funktionen und Merkmale, die getestet werden sollen. Erstellen Sie Testfälle basierend auf Anforderungen und Benutzerstories.
  2. Einrichtung der Umgebung: Richten Sie die Testumgebung ein, einschließlich der notwendigen Hardware, Software und Testdaten.
  3. Testdurchführung: Führen Sie die Testfälle manuell aus, indem Sie mit den UI-Elementen wie Schaltflächen, Formularen, Menüs usw. interagieren. Führen Sie Aktionen wie Klicken, Tippen, Ziehen und Ablegen durch, um Benutzerinteraktionen zu simulieren.
  4. Beobachtung und Überprüfung: Beobachten Sie die Reaktion der Anwendung und überprüfen Sie, ob sie dem erwarteten Verhalten entspricht. Überprüfen Sie die UI auf Inkonsistenzen, Layout-Probleme, Reaktionsfähigkeit und Benutzerfreundlichkeit.
  5. Fehlerberichterstattung: Dokumentieren Sie alle während des Tests aufgetretenen Probleme, einschließlich der Schritte zur Reproduktion, Screenshots und anderer relevanter Details. Verwenden Sie ein Bug-Tracking-System, um Fehler an das Entwicklungsteam zu melden.
  6. Regressionstest: Führen Sie Regressionstests durch, um sicherzustellen, dass Korrekturen für gemeldete Probleme keine neuen Fehler einführen oder bestehende Funktionen beeinträchtigen.
  7. Testabschluss: Überprüfen Sie die Testergebnisse und stellen Sie sicher, dass alle Testfälle ausgeführt wurden. Geben Sie Feedback an die Stakeholder und schließen Sie den Testprozess ab.

Automatisierter UI-Test

Der automatisierte UI-Test umfasst die Verwendung spezieller Tools zur Automatisierung der Ausführung von Testfällen. Dies trägt dazu bei, den menschlichen Aufwand zu reduzieren, die Testabdeckung zu erhöhen und die Effizienz zu verbessern.

Schritt-für-Schritt-Prozess

  1. Toolauswahl: Wählen Sie ein geeignetes UI-Automatisierungstesttool basierend auf der Kompatibilität mit der Anwendung, der Unterstützung von Programmiersprachen, der Benutzerfreundlichkeit und den Berichtsfunktionen.
  2. Planungsphase: Entwickeln Sie einen umfassenden Testplan, der die Testziele, den Umfang, die Ressourcen, Zeitpläne und Lieferergebnisse umreißt. Diese Phase umfasst die Definition von Testfällen, die Identifizierung der Testdatenanforderungen und die Einrichtung einer Testumgebung.
  3. Entwicklung von Testskripten: Schreiben Sie Testskripte mithilfe des ausgewählten Automatisierungstools. Dies beinhaltet die Identifizierung von UI-Elementen mit Lokatoren wie IDs, Klassen, XPath usw. und das Ausführen von Aktionen wie Klicken, Tippen und Überprüfen von Elementeigenschaften.
  4. Vorbereitung der Testdaten: Bereiten Sie die für die Ausführung automatisierter Testfälle erforderlichen Testdaten vor. Dies kann die Erstellung von Mock-Daten, die Konfiguration von Testumgebungen und die Einrichtung von Testdatenquellen umfassen.
  5. Testdurchführung: Führen Sie die automatisierten Testskripte mit dem Automatisierungstool aus. Überwachen Sie den Ausführungsprozess und analysieren Sie die Testergebnisse auf Fehler oder Probleme.
  6. Ergebnisanalyse: Überprüfen Sie die Testergebnisse, um fehlgeschlagene Testfälle zu identifizieren und die Ursachen der Fehler zu untersuchen. Analysieren Sie Protokolle, Screenshots und andere während der Testausführung generierte Artefakte.
  7. Fehlerberichterstattung: Melden Sie alle während des automatisierten Tests gefundenen Fehler an das Entwicklungsteam. Fügen Sie detaillierte Informationen wie Schritte zur Reproduktion, Umgebungsdetails und Protokolle hinzu.
  8. Wartung: Pflegen Sie die automatisierte Testsuite, indem Sie Testskripte entsprechend den Änderungen in der Anwendungs-UI oder Funktionalität aktualisieren. Fügen Sie neue Testfälle hinzu, um zusätzliche Funktionen oder Szenarien abzudecken.

Sowohl manuelle als auch automatisierte UI-Tests haben ihre Vor- und Nachteile, und die Wahl zwischen ihnen hängt von den spezifischen Anforderungen und Beschränkungen des Projekts ab. Während manuelle Tests Flexibilität und menschliche Intuition bieten, ermöglichen automatisierte Tests Wiederholbarkeit, Skalierbarkeit und schnelleres Feedback. Die Kombination beider Ansätze ist oft vorteilhaft, um eine umfassende Testabdeckung zu erreichen und eine vollständige UI-Teststrategie sicherzustellen.

Fast alle UI-Tests führen einfach Code aus, der im Hintergrund API-Funktionen aufruft. Die meiste Zeit im Test wird damit verbracht, die Elemente zu finden und mit ihnen zu interagieren. Nur ein kleiner Teil davon testet die Backend-Funktionalität.

MT1961 Posted in einem Software Testing Reddit-Thread vor 7 Monaten.

Arten von UI-Tests

Es gibt keine großen Gruppen von manuellen UI-Tests Typen: Sie beziehen sich einfach auf potenzielle Probleme, die Sie zu verhindern versuchen. Auf der Seite UI automated testing sieht es ähnlich aus. 

  • Datenfehler: Prüfen Sie, ob der Kunde die angeforderten Daten im richtigen Format eingeben kann und was passiert, wenn er davon abweicht
  • Navigationselemente: Prüfen Sie, ob die Benutzer zwischen den Bildschirmen wechseln und sich korrekt auf ihnen bewegen können
  • Menüpunkte: Stellen Sie sicher, dass dem Benutzer nur relevante Menüpunkte angezeigt werden
  • Fortschritt: Bestätigen Sie, dass alle langwierigen Aktionen die Zeit angeben, die für ihre Durchführung benötigt wird (über einen Timer, einen Balken oder etwas anderes, das Ihr UI-Designer ausgewählt hat)
  • Filter: Überprüfen Sie, ob die öffentlichen oder versteckten Etiketten tatsächlich verwendet werden, damit die Filter nur die richtigen Elemente anzeigen
  • Elementausrichtung: Positionierung die Absicht des Designers entspricht
  • Fehlermeldungen: Benutzer erhalten eindeutige Fehlermeldungen, wenn sie bei der Übermittlung einen Fehler gemacht haben und/oder wenn es ein Problem mit dem Dienst gibt

Beschleunigen Sie Ihre Web-UI-Tests mit einem Testrekorder für Chrome-Erweiterungen

Testen Sie kostenlos

Vorteile von UI-Tests

UI-Tests haben andere Ziele als, sagen wir, Unit-Tests, daher sind auch die Vorteile etwas einzigartig.

  • Stellen Sie sicher, dass die Vision Ihres Designers korrekt umgesetzt wird. Beim Design in der Softwareentwicklung geht es schließlich darum, (zusätzliche) Einnahmen von Kunden zu erhalten, nicht nur um das Aussehen. Es ist unfair, eine Schlussfolgerung zu ziehen, wenn das Entwicklungsteam nicht vollständig umgesetzt hat, was der Designer beabsichtigt hat
  • Bewahren Sie das Wertversprechen Ihrer Lösung. Je nach Software können Macken in der Benutzeroberfläche Ihre Einnahmen erheblich schmälern, sollte etwas nicht richtig funktionieren. Stellen Sie sich vor, wie viel Geld eine Ride-Hailing-App verliert, wenn die Schaltfläche „Adresse bestätigen“ nicht mehr funktioniert
  • Unterstützt den Aufwand für Regressionstests. Sollten einige Änderungen am Code bestehende Funktionen beeinträchtigen, ist die Überprüfung der bestehenden Funktionen eine gute Möglichkeit, neue Probleme zu erkennen
  • Bietet eine zusätzliche Perspektive. QS-Spezialisten haben bei der Überprüfung eines neuen Builds möglicherweise nicht dieselben Geschäftsziele oder die gleiche Ästhetik im Sinn. Das ist gut: Ihr(e) Designer erhalten zusätzliches Feedback von Leuten, die vielleicht mehr Erfahrung mit der spezifischen Software-Nische haben und/oder allgemeine Konzepte anders sehen

Ob Sie nun auf der Suche nach Präzision oder Umfang sind, Ihr UI-Testing könnte einen Hauch von künstlicher Intelligenz gebrauchen. Wir haben einen Überblick über die Trends bei KI-Tests erstellt, damit Sie sehen, wo Sie am meisten Zeit sparen können. ChatGPT-ähnliche Lösungen sind eine wichtige Hilfe, aber es gibt noch weitere Optionen.

image
3z1dfaac43755e55961b8c0abfa1c9d96c71dc87d8a6cf148c67965b7e80710b5c
ai lead magnet

Lernen Sie die 5 KI-Test-Trends kennen, um 12,8 Std./Woche pro Spezialist zu sparen

Bewährte Praktiken für UI-Tests

Hier finden Sie einige Ideen, wie Sie Ihre UI-Tests reibungslos und vorteilhaft gestalten können.

  • Richten Sie die Namenskonvention richtig ein. Auch wenn zufällige Namen für UI-Tests ein kleineres Problem sind als bei anderen Tests, benötigt das webbasierte UI-Automatisierungstestverfahren eine strukturierte Grundlage.
  • Entfesseln Sie die Pingeligkeit. Während einige kleine QS-Probleme unangetastet bleiben, weil sie den Aufwand nicht wert sind, können Sie das beim UI-Test nicht zulassen. Wenn das Logo um ein Pixel von der beabsichtigten Platzierung abweicht, muss Ihr Entwickler dies korrigieren.
  • Ignorieren Sie nicht die Ausnahmefälle. Es ist verlockend, seltene Konfigurationen zu ignorieren, aber sie können dennoch für Ihre Branche und/oder Ihre Softwarebranche relevant sein
  • Verwenden Sie die neueste verfügbare Technologie. Ein wachsender Trend ist die Verwendung einer Browsererweiterung zum Testen der Benutzeroberfläche von Websites. Selbst wenn Ihr Unternehmen nur manuelle Tests durchführt, ist es von großem Vorteil, wenn Sie die Testschritte und die getestete Website in derselben Browser-Tab speichern. Hier sehen Sie, wie unsere Chrome-Erweiterung das manuelle Testen der Benutzeroberfläche um 42 % beschleunigt.

How not to name your test cases

image
3zbdcc601729bfa1d4e33335cfb5176b61c737a68bafd4b4a38a8ef653a7771392
testing strategy template

Holen Sie sich eine Vorlage für eine Teststrategie, die es uns ermöglicht, Software 2 Mal so schnell zu veröffentlichen

Schritte der Prüfung von Benutzeroberflächen

UI-Tests folgen den allgemeinen QS-Grundlagen; die Erstellung von Testfällen, deren Ausführung und Meldung der entdeckten Fehler mit einer gewissen Dokumentation. Lassen Sie uns stattdessen über drei primäre UI-Testtechnikensprechen, von einfachen bis zu den komplexesten.

Manuelles Testen

Manuelles Testen bedeutet, dass alle Testfälle von Hand ausgeführt werden. In der Regel haben Sie ein Fehlerberichtstool, um Fehler zu speichern und zu melden, aber alle Eingaben werden manuell vorgenommen. Dies ist der einfachste Weg, aber auch sehr zeitaufwändig.

Aufnehmen und Wiedergeben

Mit Aufnehmen und Wiedergeben-Tests erreichen Ihre manuellen Tests einen Umfang, der über das hinausgeht, was ein QS-Tester oder sogar das gesamte Team manuell durchführen kann. Ein Automatisierungswerkzeug durchläuft automatisch verschiedene Teile Ihrer Software, zeichnet alle Schritte auf und prüft automatisch, ob diese Tests das erwartete Ergebnis erbracht haben. Der Implementierungsaufwand ist die zusätzliche Zeit und das Geld wert, die Sie im Vergleich zu manuellen Tests sparen.

Modellbasiertes Testen

Das modellbasierte Testen fügt dem UI-Test eine Abstraktionsebene hinzu. Ihre Ingenieure werden eine vereinfachte Version Ihrer Lösung erstellen, um Testfälle zu generieren, die auf diese Lösung abzielen. Dieser Ansatz eignet sich am besten, um sich mit den Grundlagen der Funktionsweise der Benutzeroberfläche zu befassen und nicht mit den benutzerorientierten Teilen.

Steps of UI Testing

Beste UI-Testtools

Hier sind die besten UI-Testtools, die Sie ausprobieren sollten:

  1. aqua: aqua ist eine ideale Lösung zur Zentralisierung manueller und automatisierter Testprozesse und bietet umfassende Funktionen für Testplanung und Ausführungsmanagement. Mit aqua können Sie Testfälle effizient verwalten, Testausführungen verfolgen und aussagekräftige Berichte erstellen, um den Testworkflow zu optimieren. aqua bietet auch integrierte Schnittstellen zu beliebten Frameworks und Tools wie Selenium, Cypress und Ranorex, die eine nahtlose Zusammenarbeit gewährleisten und die Testeffizienz maximieren.
  2. Ranorex: Ranorex ist ein leistungsstarkes UI-Testtool, das für seine robusten Fähigkeiten zur Automatisierung von Desktop-, Web- und mobilen Anwendungen bekannt ist. Mit seiner benutzerfreundlichen Oberfläche und den fortschrittlichen Funktionen vereinfacht Ranorex die Testautomatisierung und ermöglicht es Testern, Tests effizient zu erstellen und auszuführen. Aqua hat eine der besten Integrationen mit Ranorex auf dem Markt, was die Testmanagement-Fähigkeiten verbessert, indem Ranorex-Tests nahtlos in den Testprozess integriert werden. Diese Integration gewährleistet eine reibungslosere Zusammenarbeit zwischen Testern und Entwicklern und optimiert den Testworkflow weiter.
  3. Selenium WebDriver: Selenium WebDriver ist eines der am häufigsten verwendeten UI-Testtools. Es unterstützt mehrere Programmiersprachen wie Java, Python, C# usw. und kann Webbrowser plattformübergreifend automatisieren. Mit seiner robusten API ermöglicht Selenium die Interaktion mit Webelementen, das Ausführen von Aktionen wie Klicken auf Schaltflächen und das Eingeben von Text sowie die Validierung erwarteter Ergebnisse.
  4. Appium: Appium ist ein Open-Source-Tool zur Automatisierung mobiler Anwendungen auf iOS-, Android- und Windows-Plattformen. Es unterstützt verschiedene Programmiersprachen und Testframeworks und lässt sich leicht in bestehende Testumgebungen integrieren. Appium ermöglicht es Ihnen, plattformübergreifende Tests mithilfe des WebDriver-Protokolls zu schreiben und so konsistente Tests auf verschiedenen mobilen Geräten und Betriebssystemen durchzuführen.
  5. TestComplete: TestComplete ist ein umfassendes UI-Testtool, das verschiedene Funktionen für funktionale, Regressionstests und Lasttests bietet. Es unterstützt Desktop-, Web- und mobile Anwendungstests auf verschiedenen Plattformen. TestComplete bietet eine benutzerfreundliche Oberfläche, skriptlose Testerstellung und robuste Objekterkennung, was es für manuelle und automatisierte Testworkflows geeignet macht.
  6. Cypress: Cypress ist ein modernes, auf JavaScript basierendes Testframework, das speziell für Webanwendungen entwickelt wurde. Es bietet eine schnelle, zuverlässige und benutzerfreundliche Testerfahrung mit seiner einzigartigen Architektur und integrierten Funktionen wie automatischem Warten, Echtzeit-DOM-Snapshots und einem Zeitreise-Debugger. Cypress ermöglicht Testern das Schreiben von Tests mithilfe bekannter Technologien wie Mocha und Chai und macht es Entwicklern und QA-Ingenieuren gleichermaßen zugänglich.
  7. Robot Framework: Robot Framework ist ein generisches Open-Source-Automatisierungsframework, das Akzeptanztests und Robotic Process Automation (RPA) unterstützt. Es bietet einen schlüsselwortgesteuerten Ansatz für die Testautomatisierung und ermöglicht Testern das Schreiben von Tests in einem einfachen, lesbaren Format mit einfachen englischen Schlüsselwörtern. Robot Framework bietet umfangreiche Bibliotheken für das Testen von Webanwendungen, APIs, Datenbanken und mehr, was es äußerst vielseitig und für verschiedene Testszenarien geeignet macht.

Dies sind nur einige Beispiele für UI-Testtools, die jeweils ihre Stärken und Schwächen haben. Bei der Auswahl eines Tools für UI-Tests sollten Sie Faktoren wie den Technologiestack, die Testanforderungen, das Fachwissen des Teams und die Budgetbeschränkungen berücksichtigen.

Schlussfolgerung

UI-Tests sind für die Erhaltung und Steigerung der Einnahmen Ihres Unternehmens sehr wichtig. Fortgeschrittene Testtechniken für Benutzeroberflächen erhöhen die Komplexität zu Beginn, ermöglichen aber letztendlich einen viel einfacheren und kostengünstigeren QS-Workflow. Gute UI-Tests machen Ihr Produkt auch dadurch besser, dass sie zusätzliche Erkenntnisse darüber liefern, wie Benutzer mit der Software interagieren.

Machen Sie Ihre Benutzeroberfläche mit aqua ALM pixelperfekt

30 Tage lang kostenlos testen
Auf dieser Seite:
Sehen Sie mehr
Beschleunigen Sie Ihre Releases x2 mit aqua
Gratis starten
step
FAQ
Was sind UI-Tests?

UI-Tests beziehen sich auf Qualitätssicherungsverfahren für die grafische Schnittstelle von Software. Es ist das, was Menschen sehen, wenn sie mit einer Softwarelösung interagieren.

Was ist der Unterschied zwischen GUI- und UI-Tests?

Diese Begriffe werden häufig synonym verwendet. Wenn dies nicht der Fall ist, beziehen sich GUI-Tests in der Regel auf die rein visuelle Darstellung (unter anderem korrekte Hintergründe und Schriftarten), während UI-Tests die Erfahrung der Interaktion mit dem kundenorientierten Teil der Software umfassen.

Wie automatisieren Sie UI-Testfälle?

Es gibt zwei wesentliche Aspekte. Zunächst automatisieren Sie die Benutzereingaben, um die getesteten Bildschirme schnell aufzurufen. Zweitens automatisieren Sie die Validierung, ob die Bildschirme korrekt dargestellt werden und sich richtig verhalten. Sie können nur eines oder beides machen.

Welche Tools werden für UI-Tests verwendet?

Selenium ist das beliebteste Testautomatisierungswerkzeug zur Automatisierung von Benutzereingaben und/oder Validierung. Teams verwenden auch eine Testmanagementlösung wie aqua, um diese Selenium-Tests neben den manuellen Tests zu speichern und zu verfolgen.

Welche Tools werden für UI-Tests verwendet?

Gängige UI-Testtools könnenin zwei Gruppen unterteilt werden:

Automatisierungs-Frameworks:

  • Selenium WebDriver: Weit verbreitet für die Automatisierung von Webbrowsern, bietet plattformübergreifende Unterstützung und robuste Möglichkeiten zur Interaktion mit UI-Elementen.
  • Appium: Speziell für mobile Anwendungstests auf iOS, Android und Windows-Plattformen entwickelt, bietet Flexibilität und Integration mit verschiedenen Programmiersprachen.
  • Cypress: Für moderne Webanwendungen konzipiert, bietet Cypress schnelle, zuverlässige Testmöglichkeiten mit Funktionen wie automatischem Warten und Echtzeit-DOM-Snapshots.

Testmanagement-Tools:

  • aqua: Aqua ist ein umfassendes Testmanagement-Tool für sowohl manuelle als auch automatisierte Testprozesse. Mit aqua können Sie Tests effizient planen, durchführen und verfolgen, um die Qualität und Funktionalität von Benutzeroberflächen sicherzustellen. Die integrierten Schnittstellen zu beliebten Automatisierungs-Frameworks wie Selenium WebDriver, Appium und Cypress optimieren die Testabläufe und verbessern die Zusammenarbeit im Team.

Diese Informationen sollten Ihnen helfen, die besten Tools für Ihre UI-Tests auszuwählen und die geeignete Strategie zu entwickeln.

closed icon