In this modern era of software development, the share of web development has increased drastically. UI designs have become a critical factor for every business, whether they are selling goods or services or providing information to users. It is crucial to test UI designs quickly, and functional testing alone is not sufficient. This talk is about identifying the use cases where visual testing can be helpful. It also provides insights into how to easily implement various visual tests using one of the tools. This discussion will also cover a comprehensive overview of the tools available in the market.

Target Audience: Everyone but specifically for QA specialists
Prerequisites: None
Level: Advanced

Extended Abstract:
In this modern era of software development, the share of web development is increasing drastically every day. More and more software is migrating to browsers, offering the major benefit of not requiring extra installations, with just a single URL sufficient to connect with a website. Now, UI designs have become a critical factor for every business, whether they are selling goods or services or providing information to users. UI design is no longer limited to simple buttons, labels, or pictures; it has transformed and advanced to include rich media, such as videos, animations, and visual effects. Testing UI is not easy as functionalities are integrated with modern UI/UX designs. It becomes even more challenging when users can access the website not only on desktops but also on different devices like tablets, mobiles, or larger desktops. It is also essential to test websites on different browsers to check for compatibility. Performing manual UI testing is time-consuming, and automated functional testing is not sufficient. The introduction of automated visual testing is crucial in the fast-paced world of web development. This talk is about identifying the use cases where visual regression testing can be helpful. I aim to showcase different situations where visual test cases can be implemented. Visual testing tools also serve special purposes, like collecting application screenshots for marketing, among other uses. I will also demonstrate the capabilities of the tools, illustrating how easy it is to implement various visual tests to achieve quick releases and the successful delivery of quality products. Additionally, I will cover different enterprise and open-source tools available in the market.

Zum Testen einer Webapplikation bieten sich zwei Wege an: Entweder man testet einzelne Webkomponenten oder man betreibt aufwendige End-To-End-Tests des gesamten Systems. Aber geht das nicht besser? Dieser Vortrag stellt mit dem Konzept UI-Tests einen alternativen Ansatz vor, bei dem die Anwendung im Browser automatisiert getestet wird, ohne auf Backend oder Systemabhängigkeiten angewiesen zu sein. Anhand eines Beispiels wird gezeigt, wie dieses Vorgehen Funktionalität und Qualität sicherstellt und welche neuen Möglichkeiten es eröffnet. UI-Tests sind somit ein mächtiges Werkzeug, von dessen Einsatz das gesamte Produktteam profitieren kann.

Zielpublikum: Entwicklungsteams, also Softwareentwickler:innen, Tester:innen, Produktverantwortliche
Voraussetzungen: Grundlagen der Webentwicklung und des Browser-basierten Testens
Schwierigkeitsgrad: Advanced

Extended Abstract:
In der nutzerzentrierten Softwareentwicklung ist die UI die wichtigste Schnittstelle des Systems, denn sie ermöglicht den Nutzern erst die Interaktion mit der Anwendung. Ironischerweise ist das Testen dieser Schnittstelle mit gewissen Herausforderung verbunden. Um Nutzerflows im Browser nachzustellen, fährt man klassischerweise aufwendige End-to-End-Tests, die langsam und ressourcenintensiv sind, da sie das gesamte System erfordern. Details werden oft durch Einzelkomponententests abgedeckt, deren Aussagekraft jedoch limitiert ist. Das Konzept der UI-Tests beschreitet einen Weg dazwischen. Das Webfrontend wird komplett hochgefahren und mittels simulierter Nutzerinteraktionen im Browser automatisiert getestet. Allerdings werden dahinterliegende Systeme (Backends, Infrastruktur) nicht tatsächlich angesprochen, sondern durch vordefinierte Antworten ersetzt. Dieses Vorgehen kombiniert die Vorteile der beiden klassischen Vorgehen auf eine Weise, dass sie die Nachteile des jeweils anderen ausgleichen. Zudem ermöglicht es, Browserunabhängigkeit und Responsivität sicherzustellen. Dieser Vortrag wird anhand eines praktischen Beispiels das Vorgehen vorstellen, die Vorteile herausarbeiten und das Konzept kritisch beleuchten. Er wird zudem Tipps für den Einsatz in der Praxis geben, die auf eigenen Erfahrungen basieren. Er ist somit nicht nur für Entwickler:innen, sondern für das gesamte Entwicklungsteam geeignet.