今天来讲讲使用Java结合最新的playwright来做UI自动化测试
目前网上大部分都是关于使用Python做自动化的教程,Java的比较少一些,但是我认为使用Java做自动化还是有优点的,性能就好一点,当然大家根据实际需求来。
一、 普通UI测试
创建 Maven 项目:
在你选择的 IDE(如 IntelliJ IDEA 或 Eclipse)中创建一个新的 Maven 项目。**添加依赖到
pom.xml
**:(我使用的jdk1.8) 打开pom.xml
文件并添加以下依赖:<dependencies><!-- Playwright --><dependency><groupId>com.microsoft.playwright</groupId><artifactId>playwright</artifactId><version>1.41.0</version><scope>test</scope></dependency><!-- TestNG --><dependency><groupId>org.testng</groupId><artifactId>testng</artifactId><version>7.4.0</version><scope>test</scope></dependency> </dependencies>
示例测试用例
接下来,编写一个简单的测试用例,使用 Playwright 打开 Google 页面,并验证页面标题。
创建测试类:
在你的 Maven 项目中,创建一个新的测试类BaiduTest.java
。import com.microsoft.playwright.*; import org.testng.Assert; import org.testng.annotations.*;public class BaiduTest {Playwright playwright;Browser browser;Page page;@BeforeClasspublic void setUp() {playwright = Playwright.create();BrowserType.LaunchOptions options = new BrowserType.LaunchOptions();options.headless = false; // 设置为有头浏览器browser = playwright.chromium().launch(options);page = browser.newPage();}@Testpublic void testBaiduHomePage() {page.navigate("https://www.baidu.com");String title = page.title();Assert.assertEquals(title, "百度一下,你就知道");}@AfterClasspublic void tearDown() {browser.close();playwright.close();} }
使用 TestNG 管理测试用例
使用
@Test
注解:这标记了一个方法作为测试方法。使用
@BeforeClass
和@AfterClass
注解:分别用于在测试类中所有测试方法之前和之后执行代码。断言:使用
Assert
类来进行断言,验证测试结果是否符合预期。
生成测试报告
在
pom.xml
中配置 TestNG 生成测试报告的能力。<build><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-surefire-plugin</artifactId><version>3.0.0-M5</version><configuration><suiteXmlFiles><suiteXmlFile>testng.xml</suiteXmlFile></suiteXmlFiles></configuration></plugin></plugins> </build>
创建
testng.xml
文件来管理测试套件:<!DOCTYPE suite SYSTEM "https://testng.org/testng-1.0.dtd"> <suite name="Sample Suite"><test name="Baidu Tests"><classes><class name="BaiduTest"/></classes></test> </suite>
生成的报告会呈现在target/surefire-reports
目录下生成 XML 格式的测试报告
集成Allure
如果要生成更详细的HTML测试报告,可以集成allure
要集成 Allure,您需要添加相关依赖和插件到您的 POM 文件中:
<dependency><groupId>io.qameta.allure</groupId><artifactId>allure-testng</artifactId><version>2.13.8</version><scope>test</scope>
</dependency>
并配置 Allure Maven 插件:
<plugin><groupId>io.qameta.allure</groupId><artifactId>allure-maven</artifactId><version>2.10.0</version><configuration><reportVersion>2.13.8</reportVersion><reportingOutputDirectory>${project.build.directory}/allure-results</reportingOutputDirectory></configuration><executions><execution><phase>post-integration-test</phase><goals><goal>report</goal></goals></execution></executions></plugin>
然后我们需要在src/test/resources
目录下添加allure.properties
allure.results.directory=target/allure-results
添加这个文件主要让生成的Allure结果放到target目录里面,不然就直接放在根目录,当然你不介意的话
运行和生成报告
可以直接运行测试文件,也可以通过mvn test
执行测试,然后就能在target目录下看到Allure_results的测试结果数据,全部为json格式文件,接下来使用allure generate <results dir> -o <report dir>
在report dir 目录下生成Allure测试报告,打开index.html文件就能查看测试结果
我直接使用
allure generate .target/allure-results
这样就会根据里面的结果生成报告了,同样在Jenkins上面配置Allure的时候要注意results和report的区别,配置正确
二、数据驱动测试
1. 组织测试数据
为了处理多个参数和多组数据,testNG的数据提供者(@DataProvider
)的二维数组会是你的核心工具。数据数组的每个元素都可以包含多种数据,包括不同的定位方式、输入值和其他参数。
import org.testng.annotations.DataProvider;public class TestDataProvider {@DataProvider(name = "complexData")public Object[][] createComplexData() {return new Object[][] {{ "Case 1", "https://example.com/login", "username1", "password1", "login-button-id-1" },{ "Case 2", "https://example.com/login", "username2", "password2", "login-button-id-2" },{ "Case 3", "https://example.com/signup", "newuser1", "newpass1", "signup-button-id" }};}
}
在这个示例中,我们有一个数据提供者 complexData
,包含了多个参数,包括测试用例名称、网址、用户名、密码和按钮 ID。
2. 链接数据提供者到测试方法
现在,我们需要一个测试类,它使用上面定义的数据提供者来获取不同的数据集,并应用于测试方法。
import com.microsoft.playwright.*;
import org.testng.Assert;
import org.testng.annotations.*;public class ComplexTest {Playwright playwright;Browser browser;Page page;@BeforeClasspublic void setUp() {playwright = Playwright.create();BrowserType.LaunchOptions options = new BrowserType.LaunchOptions();options.headless = false; // 设置为 true 运行无头浏览器browser = playwright.chromium().launch(options);page = browser.newPage();}@Test(dataProvider = "complexData", dataProviderClass = TestDataProvider.class)public void testComplexScenarios(String testCaseName, String url, String username, String password, String buttonId) {page.navigate(url);// 输入用户名和密码page.fill("input[name='username']", username);page.fill("input[name='password']", password);// 点击按钮page.click("#" + buttonId);// 检查页面是否成功登录/注册boolean isLoginSuccess = page.locator("#success-message").isVisible();Assert.assertTrue(isLoginSuccess, testCaseName + " - 登录/注册失败");}@AfterClasspublic void tearDown() {browser.close();playwright.close();}
}
在这个示例中,测试方法 testComplexScenarios
接收多个参数。这使得我们可以根据不同的数据集运行相同的测试逻辑。
3. 在报告中显示测试用例名称和具体步骤
为了在报告中显示测试用例名称和步骤结果,可以通过以下方式实现:
使用 TestNG Reporter:TestNG 提供了报告功能,测试用例可以通过
Reporter.log()
输出特定信息,这样在最终报告中会显示这些信息。使用 TestNG 监听器:监听器可以帮助你更好地跟踪测试结果,并自定义报告输出。
示例代码展示了如何记录测试步骤以及在报告中显示测试用例名称:
import com.microsoft.playwright.*;
import org.testng.Assert;
import org.testng.Reporter;
import org.testng.annotations.*;public class DetailedReportTest {Playwright playwright;Browser browser;Page page;@BeforeClasspublic void setUp() {playwright = Playwright.create();BrowserType.LaunchOptions options = new BrowserType.LaunchOptions();options.headless = false; // 设置为 true 运行无头浏览器browser = playwright.chromium().launch(options);page = browser.newPage();}@Test(dataProvider = "complexData", dataProviderClass = TestDataProvider.class)public void testWithReport(String testCaseName, String url, String username, String password, String buttonId) {Reporter.log("开始执行用例:" + testCaseName, true);page.navigate(url);Reporter.log("导航至:" + url, true);// 输入用户名和密码page.fill("input[name='username']", username);Reporter.log("填入用户名:" + username, true);page.fill("input[name='password']", password);Reporter.log("填入密码", true);// 点击按钮page.click("#" + buttonId);Reporter.log("点击按钮:" + buttonId, true);// 检查页面是否成功boolean isSuccess = page.locator("#success-message").isVisible();Assert.assertTrue(isSuccess, testCaseName + " - 操作失败");Reporter.log("用例:" + testCaseName + " 执行成功", true);}@AfterClasspublic void tearDown() {browser.close();playwright.close();}
}
这个例子通过 Reporter.log()
来记录测试用例的步骤和结果,在生成的 TestNG 报告中,你可以看到这些日志信息以及测试用例名称。
当然如果你想要在Allure里面展示详细步骤,比如某个按钮,或者某个节点是否成功,你可以添加Allure.step(<string>)
import com.microsoft.playwright.*;
import com.microsoft.playwright.options.AriaRole;
import org.testng.Assert;
import org.testng.annotations.*;
import io.qameta.allure.*;public class LoginTest {Playwright playwright;Browser browser;Page page;@BeforeClasspublic void setUp() {playwright = Playwright.create();BrowserType.LaunchOptions options = new BrowserType.LaunchOptions();options.headless = false; // 设置为运行有头浏览器browser = playwright.chromium().launch(options);page = browser.newPage();}@Feature("登录功能模块")@Test(dataProvider = "loginData",dataProviderClass = TestDataProvider.class)public void testLogin(String testCaseName,String username, String password, boolean isExpectedAlert ,String expectedMessage, String expectedUrl) {boolean[] alertPresent = {false};String [] alertMessage = {""};
// page.onDialog(dialog -> {
// alertPresent[0] = true;
// alertMessage[0] =dialog.message();
// });page.navigate("https://yourexample.com/mangement/#/login");Allure.step("进入登录页成功");page.locator("input[type=\"text\"]").fill(username);Allure.step(testCaseName+"输入用户名成功");page.fill("#inputPwd", password);Allure.step(testCaseName+"输入密码成功!");page.getByText("登录", new Page.GetByTextOptions().setExact(true)).click();Allure.step(testCaseName+"点击登录按钮成功!");String newUrl = page.url();if(!testCaseName.equals("Case 1")) {Locator toast = page.getByRole(AriaRole.ALERT);toast.waitFor(new Locator.WaitForOptions().setTimeout(1000));//最多等待五秒if (toast.isVisible()) {alertPresent[0] = true;alertMessage[0] = toast.textContent();}}else {page.waitForTimeout(2000);newUrl = page.url();Allure.step(testCaseName+"登录成功!");}Assert.assertEquals(alertPresent[0],isExpectedAlert, testCaseName + "failed");Assert.assertEquals(alertMessage[0],expectedMessage,testCaseName + "failed");Assert.assertEquals(newUrl,expectedUrl,testCaseName + "failed");}@AfterClasspublic void tearDown() {browser.close();playwright.close();}
}
如果熟悉使用Python进行UI测试用过Allure的应该都清楚
这里简单回顾一下Allure常用的接口,装饰器(更多的大家可以去官网查看)
@Feature:
意义:用于标注主要的功能模块。
用途:帮助组织和分类测试用例,使其按照功能模块进行归类。通过查看报告中的Feature,可以快速地了解哪些功能模块被测试了。
@Story:
意义:用于标注功能模块下的分支功能或具体场景。
用途:进一步细分功能模块,描述更具体的功能点或业务场景。通过Story,可以更详细地了解每个功能模块下的具体测试内容。
@Title:
意义:用于为测试用例或测试步骤提供标题。
用途:使得每个测试用例或步骤在报告中都有一个明确的、描述性的标题,方便用户快速识别和理解。
三、测试数据与代码分离进行数据驱动
当然,让我们继续讨论如何使用 CSV 文件来进行数据驱动的测试。
添加 Maven 依赖
首先,在你的 Maven pom.xml
文件中添加 Apache Commons CSV 或任何其他 CSV 解析库的依赖。这里我们使用 Apache Commons CSV。
<dependency><groupId>org.apache.commons</groupId><artifactId>commons-csv</artifactId><version>1.8</version>
</dependency>
读取 CSV 文件
创建一个 @DataProvider
方法来读取 CSV 文件,并返回测试用例所需的数据。以下是一个例子,演示如何解析 CSV 文件并构造对象数组。
import org.apache.commons.csv.*;
import org.testng.annotations.DataProvider;import java.io.FileReader;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;public class CSVDataProviders {@DataProvider(name = "csvTestData")public static Object[][] readCsvData() throws IOException {List<Object[]> testCases = new ArrayList<>();try (CSVParser parser = new CSVParser(new FileReader("path/to/testdata.csv"), CSVFormat.DEFAULT.withHeader())) {for (CSVRecord record : parser) {String testCaseName = record.get("TestCaseName");String inputData = record.get("InputData");String locatorId = record.get("LocatorId");String expectedOutcome = record.get("ExpectedOutcome");testCases.add(new Object[]{testCaseName, inputData, locatorId, expectedOutcome});}}return testCases.toArray(new Object[0][]);}
}
在这个例子中,我们假设 CSV 文件有列标题 TestCaseName
, InputData
, LocatorId
, 和 ExpectedOutcome
。CSVParser
用于读取 CSV 文件,然后每条记录被转换成一个对象数组并添加到列表中。
使用数据提供者
接下来,在你的测试类中使用这个 @DataProvider
:
import com.microsoft.playwright.*;
import org.testng.Assert;
import org.testng.annotations.*;public class DataDrivenTests {Playwright playwright;Browser browser;Page page;@BeforeClasspublic void setUp() {playwright = Playwright.create();browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));page = browser.newPage();}@Test(dataProvider = "csvTestData", dataProviderClass = CSVDataProviders.class)public void testWithCsvData(String testCaseName, String inputData, String locatorId, String expectedOutcome) {page.navigate(inputData); // Assuming inputData is a URL for simplicitypage.click("#" + locatorId);Assert.assertTrue(page.isVisible(expectedOutcome), "Test failed for: " + testCaseName);}@AfterClasspublic void tearDown() {browser.close();playwright.close();}
}
在这个测试方法中,通过 @DataProvider
注解指定数据来源为 csvTestData
,它会自动接收 CSV 文件中的每行数据作为参数。
好了本次分享就到此结束了,欢迎大家一起讨论学习
附官网参考地址:
1、playwright的Java版本相关接口:https://playwright.dev/java/docs/api/class-playwrighthttps://playwright.dev/java/docs/api/class-playwright
2、Allure与testNG相关的接口:
https://allurereport.org/docs/testng/