In the last chapter, we explored XCUITest API. In this chapter we will be using Applitools Eyes XCUI SDK to add some visual checkpoints test.
In order to get started, you need to have an account with Applitools. You can create an account by going to applitools.com and just start with your email or GitHub account.
I already created an account, and when you create an account you can get your API key for running your tests. If you click on the settings and you will see the âMy API Keyâ tab over here. So, if you click you will get the API Key. Applitools has great documentation, how we can get started with XCUI Swift Tutorial, and how you can add the Applitools Eyes XCUI SKD.
Let's try to add this in our TAU app.
As per the documentation, we need to have a podfile, and this content of the podfile. Let's go back to our app and basically podfile is using a tool called CocoaPods.
CocoaPods is a dependency management system for iOS applications, so that you can use any third-party dependency using CocoaPods.
If using the system Ruby, you can store CocoaPods using
sudo gem install cocoapods
Or if you have any Ruby Version Manager, then you can simply do
gem install cocoapods
and that will install CocoaPods in your system.
Okay, let's create a file called âPodfileâ and add a similar content that is shown in the documentation. So, create a podfile and add the content as per our project. We just need to replace the target with our main target and another target for UI tests with our UI test target.
platform :ios, '9.0'
target âTAUâ do
target âTAUUITestsâ do
pod 'EyesXCUI'
end
end
And, once you have that file, we simply need to run command
pod install
So, pod install command will download the EyesXCUI SDK and we can use that SDK in our app.
One important thing we should keep in mind that, once you install the pod and dependencies using CocoaPods, then you should close all your Xcode sessions and open the xcworkspace file instead of the Xcode project file.
Let's open the workspace file (open TAU.xcworkspace
), which will open the Xcode, but you can see that now Xcode order structure has been changed. It has added the pods directory and different subdirectory in there. But we still have our tests, step definitions and base classes as we wrote previously.
Now, let's add another test for visual evaluation.
Let's create a new file. Let's create a Swift file and let's call it âTAUEyesTestâ.
And now we do import XCTest
framework, and we also do import a new link, to download EyesXCUI framework (import EyesXCUI
).
Now we can add new class, maybe âTAUUITestBaseâ which extends from our base class.
import XCTest
import EyesXCUI
class TAUEyeTest: TAUUITestBase {
}
So, in this class we can add the test which, as mentioned in this documentation, we can just simply copy/paste this test. Just give it a meaningful name so, for example, "testTAUWithEyesXCUI."
Now, once you have an account and can replace this bit with your API Key, but we also need to change some bits and pieces in the test.
So, our application name is definitely different, so let's replace it with TAU, and we can rename the test name with "Live Demo of Eyes XCUI SDK."
Now, this is the first checkpoint where we can take a screenshot of the entire screen, so we have a TAU app that's been checked the entire screen, and now we will press the button.
So, in our case we have "enrollButton" and, once we press the enroll button, we can add another checkpoint there, saying "Please Enter City" message.
And once we add visual checkpoints, we can close our test.
import XCTest
import EyesXCUI
class TAUEyeTest: TAUUITestBase {
func testTAUApplitoolsEye() {
// Start the test.
eyes.open(withApplicationName: "TAU", testName: "Live Demo of EyesXCUI SDK")
// Visual checkpoint #1.
eyes.check(withTag: "TAU", andSettings: Target.window().timeout(inSeconds: 5))
// Click the "Click me!" button.
XCUIApplication().buttons["enrollButton"].tap()
// Visual checkpoint #2.
eyes.checkWindow(withTag: "Please Enter City")
// End the test.
do {
try eyes.close()
} catch {
eyes.abortIfNotClosed()
}
}
}
We already have this kind of setup so what we can do is, basically, we can export this step into our base class.
So, export to base class â expand on the variable called âEyesâ and let's put this API Key over here. And we can get this part in the teardown
.
Now, we also need to import EyesXCUI framework in the base class as well. So, just to tidy up, we have just created the API key and teardown
in the base class.
import Foundation
import XCTest
import EyesXCUI
class TAUUITestBase: XCTestCase {
var app = XCUIApplication()
var eyes = Eyes()
override func setUp() {
super.setUp()
continueAfterFailure = false
app.launch()
eyes.apiKey = "MY-API-KEY"
}
override func tearDown() {
}
}
So, in our test now, what we can do is we can run this test. So, let me call this video at my API key over here and let's run the test once I got the API key.
We are running this test in iPhone XL. You can see our test has been started now and hopefully, once we got test, we should see the test element there, in the Applitools Test Manager as well.
It clicked on the enroll button, so it succeeded.
Let's go back to Applitools SDK and refresh it so we can see the live demo we just created has appeared over here.
We can see that our screenshot has been added â this is basically the screenshot of our main screen, and this is the second checkpoint where we pressed enroll button. We can accept this as a baseline. You can click here (on the âthumbs upâ icon) and accept this screenshot as the baseline.
And if you run this test again, then this test will run against that baseline.
So now we are rerunning the test and we can watch in the live demo. This test is now running. Now we can see that our test has been passed, so from now you can run this test again with the latest changes in the development
Once you do that, you can take this test to your CI server as well. Applitools has documentation on how to set those tests on CI servers, so you can take advantage of that.
That's it for this chapter. As a recap, in this chapterâŠ
In the next chapter we will add continuous integration system for our TAU app, and we will run those tests on continuous integration. So, see you there.