Feb 25 2016 0

Create iOS application screenshots using snapshot

I am currently working on one of my iOS applications, WoW Realms. When all the coding and testing has been completed the time has come to update all of the screenshots needed when submitting the updated version to Apple for review. Since there are now 4 different screen sizes and I want to show 5 different screenshots I would need create 20 screenshots. I would have been even worse when the application was multi-lingual…

I already knew there were tools to help you automate these kind of tasks but I had never taken the time to really look into it. I decided the time had come to take the plunge. I decided to go for snapshot.

Installing snapshot

To install snapshot onto your development machine just execute the following command

sudo gem install snapshot

Since snapshot make use of the Xcode command line tools make sure these are installed running the following command

xcode-select --install

Remember to run it again after an update of Xcode has been installed onto your development machine

Adding snapshot to your project

First step is to run the following command in your Xcode project folder

snapshot init

this will create the required files so you can use snapshot in your project. One of the files created is SnapshotHelper.swift which needs to be added to your UI Test target. My project started out using Objective-C and I didn’t waste my time rewriting my old code into Swift it should also create a bridging header. This bridging header allows you to use classes written in Swift in your Objective-C classes.

This was something that does not work well in Xcode and gave me some headaches to get it to work properly. In the issue tracker on GitHub for snapshot there are several issues reported for SnapshotHelper. Using the information from issues 291 and 397 I have finally been able to get it to work.

There is are a version of SnapshotHelper rewritten in Objective-C, but does not appear to have been updated in some time now.

An other option could have been writing the UI Test cases in Swift. This probably would have been the easier solution…

Creating UI Test

snapshot relies on Xcode UI Test for making the screenshost. So you need to add a UI Testing target to your Xcode project. In my case the UI Test only contains one test method to create all of the required screenshots

-(void)testTakeScreenshots {
    XCUIApplication *app = [[XCUIApplication alloc] init];
    [Snapshot setupSnapshot:app];
    [app launch];

    [Snapshot snapshot:@"01-MainMenu" waitForLoadingIndicator:YES];

    [app.tabBars.buttons[@"Favorites"] tap];
    [app.tables.staticTexts[@"Doomhammer"] tap];
    [Snapshot snapshot:@"02-Favorites" waitForLoadingIndicator:YES];

    [app.tabBars.buttons[@"Alerts"] tap];
    [Snapshot snapshot:@"03-Alerts" waitForLoadingIndicator:YES];

    [app.tabBars.buttons[@"Settings"] tap];
    [Snapshot snapshot:@"04-Settings" waitForLoadingIndicator:YES];
}

I am still struggling to make the last screenshot since this concerns a local notification displayed on the lock screen. Haven’t been able to get this to work yet, so that is still a work in progress.

Running snapshot

In the root of your Xcode project folder a file named Snapfile has been created. This file is used to drive snapshot and to create screenshots for all the different screen sizes and the English language my version contains the following information

devices([
   "iPhone 4s",
   "iPhone 5",
   "iPhone 6",
   "iPhone 6 Plus"
 ])

languages([
  "en-US"
])

output_directory "./screenshots/2.0"

Running snapshot to have it do its making just execute the following from the Terminal.app

snapshot

Now sit back a watch snapshot take over your machine launch iOS Simulators for each device and run your UI Test cases. When it is done you will see something similar to this and a web browser will be opened with a page showing all the screenshots generated and captured

Snapshot finishedSnapshot finished

Adding code specific for screenshots

If you have specific code that needs to be executed only when creating your screenshots using snapshot you can test for the NSUserDefaults setting name FASTLANE_SNAPSHOT, when this is set to YES the iOS Simulator has been launched by snapshot. But testing to see if the key exists is sufficient

#pragma mark - 
#pragma mark =====  Setup for UI Unit Testing via snapshot  =====
-(void) setupSnapshot {
    // Special setup when running UI Unit Tests via snapshot
    if ( [[NSUserDefaults standardUserDefaults] objectForKey:@"FASTLANE_SNAPSHOT"] ) {
        // Do your stuff to create the perfect App Store screenshots
        ...
    }
}

Previous post
Dispalying icons in Page titles - updated Feb 29 I was already using images in front of the fixed Menu/Page links (Home, Archives and Tags) and I wanted to be able to do the same for
Next post
Apps for February 2016 Here is an overview of all the apps I have bought (and still am using) for my iOS devices and/or Mac during the month of February. It has been a
This blog is powered by Blot