Here at Yelp, we build some popular mobile apps. We have around 5 million monthly unique users and about 1/3 of all Yelp searches come from mobile. Our apps continue to grow in complexity as we add new features. We try our best to test before releases, however, sometimes UI breaks and we don’t notice. For example, in a recent release, we had the ‘Get Directions’ button disappear from our iPad app!

[Screenshot]

We finally noticed it missing when we got a report from a user. We were fairly embarrassed that we hadn’t caught the problem ourselves. This was a problem that we needed to catch. In the past we’ve done manual testing to catch these issues, but being programmers, we decided to solve the problem with programming.

For our iOS apps we use gh-unit, a testing framework developed by one of our engineers, Gabriel Handford. Recently, we added functionality to let us know when our views have changed.

Gh-unit-screens

It works by rendering tested views to images and comparing them agains previous runs. Anytime a view changes, the developer is presented the old image, the new rendered view, and an image diff of the two. The developer then has to sign off by clicking the ‘Approve This Change’ button in the test. The developer then grabs these new images using a script and commits them to version control. This allows us to know exactly what changed in our UI due to a code change.

We think it will be pretty useful for preventing UI-based regressions in our codebase. Get the code here:

https://github.com/gabriel/gh-unit

Also check out a presentation I did on GHUnit UI Verification at the App Developer Conference.

Back to blog