Skip to main content

Getting Started With Visual Regression Testing Using XCUI On SmartUI Real Devices

XCUI (XCTest UI) is Apple's native UI testing framework used for testing iOS applications. It is part of the XCTest framework and allows developers to write UI automation tests for iOS apps. In this documentation, you will learn step-by-step how to perform regression testing and find Visual UI Regression bugs easily with the help of Smart Testing.

Prerequisites​

Sample repo

If you do not have any iOS app (.ipa) and an iOS Test app (.ipa) file, you can run your sample tests on LambdaTest by using our sample 🔗 XCUI app and a sample 🔗 XCUI Test App.

Download or Clone the code sample from the LambdaTest GitHub repository to run the tests on the SmartUI. Image View on GitHub

Step 1: Create a SmartUI Project​

The first step is to create a project with the application in which we will combine all your builds run on the project. To create a SmartUI Project, follow these steps:

  1. Go to Projects page
  2. Click on the new project button
  3. Select the platform as Real Device for executing your XCUI tests.
  4. Add name of the project, approvers for the changes found, tags for any filter or easy navigation.
  5. Click on the Submit.

Step 2: Set up your Authentication​

Now, you need to export your environment variables LT_USERNAME and LT_ACCESS_KEY that are available in the LambdaTest Profile page.

Run the below mentioned commands in your terminal to setup the CLI and the environment variables.

export LT_USERNAME=YOUR_LAMBDATEST_USERNAME
export LT_ACCESS_KEY=YOUR_LAMBDATEST_ACCESS_KEY

Step 3: Update your App Configurations​

It should be in your app configurations then only you can perform the XCUI integration.

  • Update this dependency in your test classes. You can do it as follows:
import XCTest
import SmartuiXcui // importing the package
final class MyAppUITests: XCTestCase {
  func testExample() throws {
      // launch application
      let app = XCUIApplication()
      app.launch()
      // take screenshot
      let ltApp = LTApp()
      try ltApp.screenshot(name: "screenshotName")
  }
}

Now build your application.

Step 4: Upload your Application​

To begin testing, upload your iOS application (.ipa file) to LambdaTest's servers. You'll use our REST API for this process.

  • Authentication : You'll need your LambdaTest Username and AccessKey. Combine them in the format Username:AccessKey.
  • Uploading the App : Use cURL command to send a request to our API. The request should include the path to your application file (appFile).
curl -u "YOUR_LAMBDATEST_USERNAME:YOUR_LAMBDATEST_ACCESS_KEY" --location --request POST 'https://manual-api.lambdatest.com/app/uploadFramework' --form 'appFile=@"<PATH_OF_YOUR_IOS_APP>"' --form 'type="xcuit-ios"'
info
  • Provide the path of your ios application in the above URL in place of <PATH_OF_YOUR_IOS_APP>
  • Response of above cURL will be a JSON object containing the App URL of the format - lt://APP123456789123456789 and will be used in the last step.

Step 5: Upload Your Test Suite​

Upload your XCUI test suite (.ipa) file to LambdaTest servers using our REST API.

The following sample cURL command shows how to upload a test suite:

curl -u "YOUR_LAMBDATEST_USERNAME:YOUR_LAMBDATEST_ACCESS_KEY" --location --request POST 'https://manual-api.lambdatest.com/app/uploadFramework' --form 'appFile=@"<PATH_OF_YOUR_TEST_SUITE_APP>"' --form 'type="xcuit-ios"'
info
  • Provide the path of your ios application in the above URL in place of <PATH_OF_YOUR_TEST_SUITE_APP>
  • Response of above cURL will be a JSON object containing the App URL of the format - lt://APP123456789123456789 and will be used in the last step.

Step 5: Executing The Test​

  • You will need base64 encoded authentication in order to execute your Espresso automation test suite. Enter your username:accesskey in Basic Authentication Header Generator to generate your auth token.

Take note of the base64 encoded authentication which needs to be added in the next step.

YOUR_LAMBDATEST_USERNAME:YOUR_LAMBDATEST_ACCESS_KEY
  • Once you have uploaded your app and test suite, you can execute your test by running the following command:

Enter your BASIC_AUTH_TOKEN, APP_ID (generated in the fourth step) and TEST_SUITE_ID (generated in the fifth step) in the below command.

curl --location 'https://mobile-api.lambdatest.com/framework/v1/xcui/build' \
--header 'Authorization: Basic BASIC_AUTH_TOKEN' \
--header 'Content-Type: application/json' \
--data '{
    "app" : "APP_ID", //enter your app-id
    "testSuite": "TEST_SUITE_ID", //enter your test-suite id
    "device" :  ["iPhone 13-16"], //enter your device names
    "smartUI.project": "XCUI-SmartUI-Project",
    "build" : "Proverbial-XCUITest",
    "video" : true,
    "queueTimeout": 10800,
    "idleTimeout": 150,
    "devicelog": true,
    "network": false,
    "only-testing" : ["LambdaUiKitIOSUITestsLaunchTests"],
    "smartUI.cropStatusBar" : true,
    "smartUI.cropNavigationBar" : true
}'

You can check the executed builds over at LambdaTest SmartUI.

Smart Crop With SmartUI​

The all-new Real Device mobile notification status bar and navigation bar crop feature in SmartUI allows you to take your visual regression testing workflows to the next level. With Smart Crop, you can crop the status bar and navigation bar or footer from screenshots, enabling them to focus solely on the core UI elements during visual comparisons.

By leveraging machine learning algorithms, it accurately detects and crops the status bar and navigation bar from screenshots. With precise image processing techniques, SmartUI precisely identifies the location of status bar elements. By excluding it from visual comparisons, the focus is solely on critical UI elements.

Original ScreenshotCropped Screenshot
ProfileProfile
Last updated on

Test across 3000+ combinations of browsers, real devices & OS.

Book Demo

Help and Support

Related Articles