Run sample native app visual test

Step 1: Setup environment

Requirements

  • JDK (Highly recommended to use JDK 8 SE)
  • Java build framework
  • Access key
    • You can generate an Access key using the following instruction – Access key
  • Billing unit
    • The billing unit is your team’s unique identifier, or just the word “personal” in the case of an individual account.
      More information can be found here.

Step 2: Upload and install an App

Before running tests, several preparations are required:

  • Upload the app (only once).
  • Find and take a Device
  • Install the App

All of these actions can be performed automatically via API.
For more details, please refer to the Upload and Install document.

Step 3: Add the interaction with visual testing API

After setup up the environment, you need to add the interaction with the visual testing API: 

package com.mobitru.visual;
import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
import lombok.Data;


@Data
@JsonIgnoreProperties(ignoreUnknown = true)
public class VisualBuildData {

    private String id;
    private String name;
    private String project;
    private String branch;
    private String status;
}

package com.mobitru.visual;

import lombok.Builder;
import lombok.Data;

@Data
@Builder
public class VisualBuildInputData {

    private String name;
    private String project;
    private String branch;
}


package com.mobitru.visual;

import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
import lombok.Data;

@Data
@JsonIgnoreProperties(ignoreUnknown = true)
public class VisualSnapshotData {

    private String id;
    private String name;
    private String buildId;
    private String testName;
    private String suiteName;
    private String browser;
    private String browserVersion;
    private String operatingSystem;
    private String operatingSystemVersion;
    private String device;
}

package com.mobitru.visual;

import lombok.Builder;
import lombok.Data;

import java.io.File;

@Data
@Builder
public class VisualSnapshotInputData {

    private String name;
    private String buildId;
    private File image;
    private String testName;
    private String suiteName;
    private String browser;
    private String browserVersion;
}


package com.mobitru;

import com.mobitru.visual.VisualBuildData;
import com.mobitru.visual.VisualBuildInputData;
import com.mobitru.visual.VisualSnapshotData;
import com.mobitru.visual.VisualSnapshotInputData;
import io.restassured.RestAssured;
import io.restassured.config.SSLConfig;
import io.restassured.specification.RequestSpecification;

import static io.restassured.http.ContentType.JSON;
import static java.net.HttpURLConnection.HTTP_CREATED;
import static java.net.HttpURLConnection.HTTP_OK;

public class VisualTestingService {

    private static final String VISUAL_TESTING_HOST = "visual.mobitru.com";
    private static final String VISUAL_TESTING_PROJECT_NAME = "--------- BILLING_UNIT -----------";
    private static final String VISUAL_TESTING_BASE_URL = String.format("https://%s/billing/unit/%s/api/v1/", VISUAL_TESTING_HOST, VISUAL_TESTING_PROJECT_NAME);
    private static final String VISUAL_TESTING_API_KEY = "--------- YOU ACCESS KEY -----------";


    public VisualBuildData createBuild(VisualBuildInputData inputData) {
        return buildBaseSpec().log().all()
                .contentType(JSON)
                .body(inputData)
                .post("/builds")
                .then()
                .statusCode(HTTP_OK)
                .extract()
                .as(VisualBuildData.class);
    }

    public void finishBuild(String buildId) {
        buildBaseSpec().log().all()
                .contentType(JSON)
                .post("/builds/{buildId}/finish", buildId)
                .then()
                .statusCode(HTTP_OK);
    }

    public VisualSnapshotData submitSnapshot(VisualSnapshotInputData data) {
        return buildBaseSpec().log().uri()
                .formParam("name", data.getName())
                .formParam("testName", data.getTestName())
                .formParam("suiteName", data.getSuiteName())
                .formParam("browser", data.getBrowser())
                .multiPart("image", data.getImage(), "image/png")
                .post("/builds/{buildId}/snapshots", data.getBuildId())
                .then()
                .statusCode(HTTP_CREATED)
                .extract()
                .as(VisualSnapshotData.class);

    }

    private RequestSpecification buildBaseSpec() {
        return RestAssured.
                given().
                config(RestAssured.config().sslConfig(new SSLConfig().relaxedHTTPSValidation())).
                baseUri(VISUAL_TESTING_BASE_URL).
                auth().oauth2(VISUAL_TESTING_API_KEY);
    }


}

Step 4: Run sample test

After setting up the environment, installing the native App, and integrating the visual testing API, you can run your first native visual test

package com.mobitru;


import com.mobitru.visual.VisualBuildData;
import com.mobitru.visual.VisualBuildInputData;
import com.mobitru.visual.VisualSnapshotInputData;
import io.appium.java_client.AppiumDriver;
import io.appium.java_client.ios.IOSDriver;
import io.appium.java_client.ios.options.XCUITestOptions;
import io.appium.java_client.remote.options.BaseOptions;
import org.openqa.selenium.By;
import org.openqa.selenium.MutableCapabilities;
import org.openqa.selenium.remote.RemoteWebDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import org.testng.annotations.*;

import java.io.File;
import java.io.IOException;
import java.net.URL;
import java.time.Duration;

import static java.lang.String.format;
import static java.time.Duration.ofMinutes;
import static java.time.Duration.ofSeconds;
import static java.util.Optional.ofNullable;
import static org.openqa.selenium.By.cssSelector;
import static org.openqa.selenium.OutputType.FILE;
import static org.testng.AssertJUnit.assertTrue;

public class AppiumNativeVisualDemo {

    private VisualTestingService visualTestingService = new VisualTestingService();
    private VisualBuildData visualBuildData;

    private static final String PROJECT_NAME = "--------- BILLING_UNIT -----------";

    private static final String ACCESS_KEY = "--------- YOU ACCESS KEY -----------";
    private static final int DEFAULT_WAIT_TIMEOUT_SEC = 10;

    private static final String APPIUM_HUB = "app.mobitru.com";
    private static final String DEVICE_UDID = "00008030-001458E02178802E";
    private static final String BUNDLE_ID = "com.epam.mobitru.demoapp";
    private static final String USER_NAME = "testuser@mobitru.com";
    private static final String PASSWORD = "password1";

    private static final String VISUAL_TEST_NAME = "Java Native Appium Automation Demo";

    private final BaseOptions<? extends MutableCapabilities> options;

    private AppiumDriver driver = null;

    public AppiumNativeVisualDemo() {
        options = new XCUITestOptions();
        options.setCapability("udid", DEVICE_UDID);
        options.setCapability("bundleId", BUNDLE_ID);
        options.setCapability("autoAcceptAlerts", true);
    }


    @BeforeSuite
    public void createVisualBuild() {
        VisualBuildInputData data = VisualBuildInputData.builder()
                .name("Build 1")
                .project("Java Automation Demo")
                .branch("main")
                .build();
        this.visualBuildData = visualTestingService.createBuild(data);
    }

    @BeforeMethod
    public void before() throws Exception {
        driver = new IOSDriver(
                new URL(format("https://%s:%s@%s/wd/hub", PROJECT_NAME, ACCESS_KEY, APPIUM_HUB)), options);

        // For devices with low performance
        driver.manage().timeouts()
                .pageLoadTimeout(ofMinutes(5));
    }

    @Test
    public void demoTest() throws IOException {

        driver.findElement(By.xpath("//XCUIElementTypeTextField[starts-with(@name,'Login')]"))
                .sendKeys(USER_NAME);

        submitSnapshot(driver, "after_enter_login", VISUAL_TEST_NAME);

        driver.findElement(By.xpath("//XCUIElementTypeSecureTextField[starts-with(@name,'Password')]"))
                .sendKeys(PASSWORD);

        submitSnapshot(driver, "after_enter_password", VISUAL_TEST_NAME);

        driver.findElement(By.xpath("//XCUIElementTypeButton[starts-with(@name,'Sign in')]")).click();

        new WebDriverWait(driver, Duration.ofSeconds(DEFAULT_WAIT_TIMEOUT_SEC))
                .until(ExpectedConditions.visibilityOfAllElementsLocatedBy(
                        By.xpath("//*[starts-with(@name,'productHeaderViewLabel')]")));

        submitSnapshot(driver, "after_login", VISUAL_TEST_NAME);

    }

    private void submitSnapshot(AppiumDriver driver, String name, String testName) {
        File screenshot = driver.getScreenshotAs(FILE);
        String serial = driver.getCapabilities().getCapability("udid").toString();
        VisualSnapshotInputData snapshotInputData = VisualSnapshotInputData.builder()
                .buildId(visualBuildData.getId())
                .testName(testName)
                .device(serial)
                .name(name)
                .suiteName(visualBuildData.getProject())
                .image(screenshot)
                .build();
        visualTestingService.submitSnapshot(snapshotInputData);
    }

    @AfterMethod
    public void after() {
        ofNullable(driver).ifPresent(RemoteWebDriver::quit);
    }

    @AfterSuite
    public void finishVisualBuild() {
        visualTestingService.finishBuild(visualBuildData.getId());
    }

}

Scroll to Top