Skip to main content

Implementing UI tests on iOS and Android using screenshot comparison tools

Have you ever thought when writing or maintaining UI tests, there must be a better way?

Take a look at screenshot tests provided by Google Firebase and Facebook:

ios-snapshot-test-case
A "snapshot test case" takes a configured UIView or CALayer and uses the renderInContext: method to get an image snapshot of its contents. It compares this snapshot to a "reference image" stored in your source code repository and fails the test if the two images don't match.

GitHub Facebook

screenshot-tests-for-android
Testing rendering for your Android app is hard. How do you prevent visual regressions in paddings and margins and colors from creeping in?
Iterating on UI code is hard. How do you quickly verify that your layout or view changes work correctly in all configurations?

screenshot-tests-for-android can solve these problems by providing a test framework that checks for visual differences across changes.

GitHub Facebook

Google Firebase Test Lab
Test Lab lets you run Espresso, Robotium, or UI Automator 2.0 instrumentation tests written to exercise your app from the Firebase console, Android Studio, or the gcloud command line interface. You can also use Robo test to automatically exercise your app from the Firebase console or the gcloud command line.


Robo test captures logs, creates an "activity map" that shows a related set of annotated screenshots, and creates a video from a sequence of screenshots to show you the simulated user operations that it performed. Learn more about Robo test.

Firebase Test Lab

Firebase Test Lab for Android includes a library that you can use to take screenshots when running instrumentation tests, such as tests written using the Espresso test framework. To add this capability to your test, use the cloudtestingscreenshotter_lib.aar library.

The ability to take screenshots is already incorporated into the test APK, app-debug-test-unaligned.apk, for the NotePad sample app, and screenshots are also captured when you run Robo test. The following instructions tell you how to add the screenshot library to your app and how to call that library from your test.

After your test has run, you can review the screenshots in Android Studio or in the Firebase console.
Screenshot comparison screen

Firebase Take Screenshots

PointFree SnapShotTesting with Swift!

Comments

Most Favorite Posts

Judo App - Server Driven UI out of the box

Judo App Judo brings server-driven UI to your iOS and Android apps. Build user interfaces visually in a fraction of time and publish them instantly without submitting to the app store. Build Experiences - With No Code The Judo app for macOS, available through the App Store, is built for design professionals with common keyboard shortcuts and familiar concepts like canvas, layers and inspector panel. Workflow is streamlined with the ability to drag and drop media files directly into your experiences and manage your own Judo files in Finder. Manage Creative Execution A Judo experience is interactive and can include text, images, video and buttons. An experience may be part of a screen, a single screen, or more typically multiple linked screens. Judo supports screen transitions, carousels, horizontal scrolling and modals. Clients can add custom fonts and define global colors and these are updates applied universally. Effortlessly Deploy Judo Cloud syncs your experiences with your iOS and ...

Native Or Web? Bizness Apps Adds HTML5 Platform To Let SMBs Create Their Own Apps — For Both

Bizness Apps’s value proposition is simple: The startup wants to make mobile apps affordable, customizable, and simple to make for the small business owner. Thus, the startup offers a DIY iPhone, iPad, and Android app platform that enables SMBs to create, edit, and manage mobile apps without any programming experience required. You start with a template, customize them to suit your business, and then Bizness Apps makes them native apps and distributes them on iTunes and the Android Marketplace. TechCrunch

Server-driven UI (SDUI): Meet Zalandos AppCraft and AirBnB Lona

A short WTF: Joe Birch:  SERVER DRIVEN UI, PART 1: THE CONCEPT Zalando seems to follow the SDUI principle as well - defining a common design language and construct the screens on the backend while displaying them natively on the clients. They even go one step further; they implemented a mighty toolset to enable non-technical stakeholders to define their own native app screens Compass: Web tooling to create screens and bind data Beetroot: Backend service that combines the screen layout definition with the data Lapis/Golem: iOS/Android UI render engines Crazy cool! Good job, guys (when you do an open-source release?) To even move faster a Flutter based UI render engine implementation was great! See also AirBnB Lona SDUI approach Building a Visual Language Why Dropbox sunsetted its universal C++ mobile project and AirBnB its React Native implementation

Remote Desktop with VNC

Access your Mac from any computer with the use of VNC. This article describes the process of setting up a VNC server on your Mac, and how to access it from afar. Remote Desktop on your Mac for Free VNC Server VNC Client

Measuring a Mobile World: Introducing Mobile App Analytics

Analytics für mobilen App-Traffic ermöglicht durchgängige Messungen entlang des Weges von Kunden innerhalb einer mobilen App. Dazu werden Messwerte in allen Phasen des Kundenkontakts gesammelt – zum Beispiel Akquisitionsmesswerte wie neue/aktive Nutzer, Interaktionsmesswerte wie Besucherfluss, Kundentreue oder App-Abstürze sowie Ergebnismesswerte wie Ziel-Conversions und In-App-Käufe. So hilft Analytics Mobilentwicklern und Marketingexperten, erfolgreichere Apps zu erstellen und bessere Nutzererfahrungen zu schaffen. Die Funktion wird nun Schritt für Schritt eingeführt und gegen Ende des Sommers für alle Nutzer verfügbar sein. Google Analytics Mobile App Analysis