在本文中，我解释了如何使用Applitools Eyes工具进行自动移动视觉测试。在网络世界中，有许多关于视觉回归测试的解决方案，如PhantomCSS，Webdrivercss，Huxley，Wraith等等。借助Applitools Eyes，您可以对网页，移动网页和移动原生应用进行视觉比较。您可以在硒代码中使用Eyes类的功能。
我解释了如何做Appium设置和如何写的移动自动化代码在这篇文章。这就是为什么我不想在这篇文章中谈到这些细节。我想专注于如何将Applitools Eyes与Appium集成，并进行简单的可视化移动测试自动化。
首先，打开Genymotion Emulator并创建一个新设备并将其名称设置为“GoogleGalaxyNexus”。Genymotion的安装在这篇文章和这个链接中描述。
启动GenyMotion模拟器。
然后，打开Appium并检查设置。
我们将使用示例bitbar.apk。首先，你需要把这个apk放在C：\ ApplitoolsApk \ BitbarSampleApp.apk文件夹下，然后在Appium设置中设置这个路径。
将服务器地址设置为“127.0.0.1”，将端口设置为“4723”
并启动Appium服务器。
然后，将BitbarSampleApp.apk拖放到您的模拟器。
现在，我们可以编写我们的测试代码。
打开IntelliJ，然后单击文件 - >新建项目，然后选择Maven，然后单击下一步。
然后写：
GroupId：AppliToolsEyesDemo
ArtifactId：AppliToolsEyesDemo
然后点击下一步。
编写“AppliToolsDemo”作为项目名称，然后单击“完成”。
然后，打开pom.xml并复制粘贴下面的代码。
项目GitHub页面：https：
//github.com/swtestacademy/MobileVisualTestingApplitoolsEyes
pom.xml
XHTML
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>AppliToolsEyesDemo</groupId>
<artifactId>AppliToolsEyesDemo</artifactId>
<version>1.0-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>org.testng</groupId>
<artifactId>testng</artifactId>
<version>6.9.9</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>io.appium</groupId>
<artifactId>java-client</artifactId>
<version>4.0.0</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>com.applitools</groupId>
<artifactId>eyes-selenium-java</artifactId>
<version>RELEASE</version>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>2.53.1</version>
</dependency>
</dependencies>
</project>
点击测试 - > java并右键单击并创建一个新的Java类，并将“AppliToolsDemo”作为类名，然后单击确定按钮。
右键单击“AppliToolsEyesDemo”文件夹，并创建一个新的文件，并给“TestNG.xml”作为名称。
之后，打开“ TestNG.xml ”文件，并在其中写入以下代码。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">
<suite name="AppliTools Demo Tests">
<test name="RunTest" preserve-order="true">
<classes>
<!-- <class name=".*" /> -->
<class name="AppliToolsDemo" />
</classes>
</test>
</suite>
现在，我们可以编写我们的测试代码，但在此之前，我想总结一下我们的测试场景：
· 打开BitbarSampleApp.apk
· 目视检查启动屏幕是否与预期的一样？
· 点击第二个选项“使用Testdroid云”
· 目测检查第二个选项是否被点击？
· 将“SW Test Academy”写入文本栏
· 点击答案按钮
· 等待第二页出现
· 目测检查答案是否正确
· 关闭驱动程序。
正如你可以看到上面的情景，我们将做3个视觉比较。当您运行测试时，首先，AppliTools Eyes截取检查点的截图，并将其作为基准图像进行测试。当你第二次运行测试，第三，第四次等等，AppliTools眼睛的“eyes.checkWindow（）”方法会比较实际的屏幕与基准屏幕与给定的比较匹配的水平严格，精确，布局，内容。在这篇文章中，我们将做一个严格的比较。
现在，我们从
http://www.applitools.com/登录Applitools云测试管理面板。如果您没有帐户，首先需要创建一个新帐户。
当您在右上角登录
https://eyes.applitools.com时，您将会看到您的个人资料详细信息，您将从这里获得您的API密钥。
在左窗格中，你可以看到你的测试运行突出了绿色时，他们通过和红色时，他们失败了。而且，所有的检查点都可以通过，包括绿色+歌唱，失败的时候会看到红色的标志。（注意：如果你是一个盲人，使用这个面板并不容易，亲爱的Applitools，请考虑这个评论。）
当你打开一个图像，你可以到达图像控制面板，在这个面板，你可以很多操作如下图所示。
我认为Applitools Eyes控制面板就足够了。现在，让我们开始写我们的测试代码。我在代码中写了详细的内联注释。
AppliToolsDemo
Java
import com.applitools.eyes.Eyes;
import com.applitools.eyes.MatchLevel;
import io.appium.java_client.android.AndroidDriver;
import io.appium.java_client.remote.MobileCapabilityType;
import org.openqa.selenium.By;
import org.openqa.selenium.remote.DesiredCapabilities;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;
import java.net.MalformedURLException;
import java.net.URISyntaxException;
import java.net.URL;
/**
* Created by ONUR BASKIRT on 07.08.2016.
*/
public class AppliToolsDemo {
final String APP_NAME = "BitbarSampleApp";
final String TEST_NAME = "BitbarDemo";
final String DEVICE = "GoogleGalaxyNexus";
private AndroidDriver driver;
private WebDriverWait wait;
private Eyes eyes;
//Do the Setup before tests
@BeforeClass
public void setUp() throws MalformedURLException {
//Setup of Applitools Eyes
eyes = new Eyes();
//Set API Key of Eyes
eyes.setApiKey("YOUR API KEY");
//Set Match Level
eyes.setMatchLevel(MatchLevel.STRICT);
//Set baseline name
eyes.setBaselineName("GoogleGalaxyNexus-Demo");
//Set host operating System as our device
eyes.setHostOS(DEVICE);
//Setup of Appium
DesiredCapabilities caps = DesiredCapabilities.android();
//Set apk location
caps.setCapability(MobileCapabilityType.APP, "C:\\ApplitoolsApk\\BitbarSampleApp.apk");
//Set device name
caps.setCapability(MobileCapabilityType.DEVICE_NAME,"GoogleGalaxyNexus");
//Set platform name as Android
caps.setCapability("platformName", "Android");
//Set emulator version as 4.4.2
caps.setCapability("platformVersion", "4.4.2");
//And finally create a driver variable with above settings.
driver = new AndroidDriver(new URL("http://127.0.0.1:4723/wd/hub"), caps);
//Set Wait Time
wait = new WebDriverWait(driver,15);
}
@Test
public void bitBarDemoTest() throws MalformedURLException, InterruptedException,URISyntaxException {
//Open Eyes and start visual testing
eyes.open(driver, APP_NAME, TEST_NAME);
//Visual check point #1
eyes.checkWindow("Start Screen");
//Click second radio button
driver.findElement(By.name("Use Testdroid Cloud")).click();
//Visual check point #2
eyes.checkWindow("Answer selected");
//Write "SW Test Academy" to text box
driver.findElement(By.className("android.widget.EditText")).sendKeys("SW Test Academy");
//Click answer button
driver.findElement(By.name("Answer")).click();
//Synchronization after click. Wait until "You are right!" text appear on second screen
wait.until(ExpectedConditions.presenceOfElementLocated(By.name("You are right!")));
// Visual validation point #3
eyes.checkWindow("Answer is correct");
// End visual testing. Validate visual correctness.
eyes.close();
}
@AfterClass
public void teardown(){
//Abort eyes if it is not closed
eyes.abortIfNotClosed();
//close the app
driver.quit();
}
}
在运行我们的代码之前，请确保您的Appium服务器和Genymotion仿真程序正在运行。如果这些先决条件满足，那么你可以运行你的测试代码。之后，将会打开Bitbar应用程序，并在Applitools控制面板中创建一个新的bitbar测试，如下所示。
首先，Applitools会将检查点的所有图像保存为基准图像。
我们也可以添加一些被忽略的比较区域和矩形选择。如下所示。
对于第二次运行，如果测试失败，Applitools Eyes将突出显示有问题的不匹配，并且测试将变成红色。
当您的测试通过时，您的测试突出显示为红色，因为所有检查点都显示不失配错误。
