Article Directory
foreword
This article is to write test cases for the blog system that has been done before , and use the Selenium4 automatic testing tool and the Junit5 unit test framework to write code for the test cases of the blog system.
1. Writing test cases for the blog system
The blog system consists of four pages, login, list, details, and edit pages. For details and implementation, please refer to the previous blog system articles.
2. Automated testing
Creating a driver is a common part of the test, so it can be placed in a class, and then create a test class for the login page, login list page, login details page, and login edit page, and finally create a suite to select the class to be tested.
The AutotestUtils class includes methods for creating objects and saving screenshots during test execution.
//1.创建驱动对象
public static ChromeDriver createDriver() {
if (driver == null) {
driver = new ChromeDriver();
//创建隐式等待
driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(10));
}
return driver;
}
//通过格式化时间戳来动态的获取截图名
public List<String> getTime() {
//文件格式 20230307-225600
SimpleDateFormat simpleDateFormat1 = new SimpleDateFormat("yyyyMMdd-HHmmssSS");
SimpleDateFormat simpleDateFormat2 = new SimpleDateFormat("yyyyMMdd");
String fileName = simpleDateFormat1.format(System.currentTimeMillis());
String dirName = simpleDateFormat2.format(System.currentTimeMillis());
List<String > list = new ArrayList<>();
list.add(dirName);
list.add(fileName);
return list;
}
/**
* 获取屏幕截图，把所有的用例执行的结果保存下来
*/
public void getScreenShot(String str) throws IOException {
List<String> list = getTime();
//dir+fileName
String fileName = "./src/test/java/com/blogWebAutoTest/"+list.get(0)+"/"+str+"_"+list.get(1)+".png";
File srcFile = driver.getScreenshotAs(OutputType.FILE);
//把屏幕截图生成的文件放到指定的路径
FileUtils.copyFile(srcFile,new File(fileName));
}
1. Blog Login Page Test
Write according to the test case.
Mainly used in the technical test suite @Suite, organizes the sequence of obtaining URLs, login success/failure, and closing resources.
Note: When setting multiple sets of data for login (using @CsvSource), you need to clear the data in the login box first.
BlogLoginTest
//调用AutotestUtils中的createDriver
private static ChromeDriver driver = createDriver();
//测试登录页面的一些共同步骤
//1.获取浏览器对象
//2.访问登录页面的URL
@BeforeAll
public static void baseControl() {
driver.get("http://121.4.74.140:8080/blogSystem2/blog_login.html");
}
/**
* 检查登录页面打开是否正确
* 检查点：主页 写博客 元素是否存在
*/
@Test
@Order(1)
public void loginPageLoadRight() {
driver.findElement(By.cssSelector("#username"));
driver.findElement(By.cssSelector("#password"));
}
/**
*检查正常登录是否成功
*/
//@ParameterizedTest
@CsvSource({
"张三,123","王一,123"})
@Order(3)
public void loginSuccess(String name,String password) {
//清空登录框，以防多组登录
driver.findElement(By.cssSelector("#username")).clear();
driver.findElement(By.cssSelector("#password")).clear();
//进行登录
driver.findElement(By.cssSelector("#username")).sendKeys(name);
driver.findElement(By.cssSelector("#password")).sendKeys(password);
driver.findElement(By.cssSelector("#login-button")).click();
//如果跳转到博客列表页，才算登录成功
driver.findElement(By.cssSelector("body > div.container > div.container-right > div:nth-child(1) > div.date"));
driver.navigate().back();
}
/**
* 登录失败检测
*/
@ParameterizedTest
@CsvSource({
"张三,1234"})
@Order(2)
public void loginFail(String name,String password) {
//清空登录框，以防多组登录
driver.findElement(By.cssSelector("#username")).clear();
driver.findElement(By.cssSelector("#password")).clear();
//进行登录
driver.findElement(By.cssSelector("#username")).sendKeys(name);
driver.findElement(By.cssSelector("#password")).sendKeys(password);
driver.findElement(By.cssSelector("#login-button")).click();
//登录失败情况
String expect = "用户未注册或用户名密码错误！登录失败！";
String actual = driver.findElement(By.cssSelector("body")).getText();
Assertions.assertEquals(expect,actual);
}
2. Blog list page test
After successfully logging in, enter the blog list page, and check whether the blog list page is displayed normally by checking whether there are certain elements on the list page.
BlogListTest:
/**
* 登录列表页面可以正常显示
*/
@Test
public void listPageLoadRight() throws IOException {
driver.findElement(By.cssSelector("body > div.nav > a:nth-child(5)"));
driver.findElement(By.cssSelector("body > div.nav > a:nth-child(6)"));
getScreenShot(getClass().getName());
}
3. Blog edit page test
On the blog writing page:
First of all, it is necessary to check whether the blog writing page is displayed normally, and judge whether the blog writing page is displayed normally by checking whether some specific elements exist like the blog list page; secondly, check whether the blog editing submission is normal, and publish a
blog , When writing a blog, because the blog editor uses a third-party plug-in, you cannot directly use sendKeys to edit by clicking certain elements;
finally, after publishing the blog, compare the title of the latest blog with the title when editing the blog, and they are equal Then the blog is published successfully.
BlogEditTest
/**
* 检查编辑页面可以正常打开
*/
@Test
@Order(1)
public void editPageLoadRight() throws IOException {
driver.findElement(By.cssSelector("body > div.nav > a:nth-child(5)"));
driver.findElement(By.cssSelector("body > div.nav > a:nth-child(6)"));
getScreenShot(getClass().getName());
}
/**
* 检查编写博客页面可以正常编写提交
*/
@Test
@Order(2)
public void editAndSubmitBlog() throws IOException {
String expect = "测试博客可以编写并提交";
driver.findElement(By.cssSelector("#blog-title")).sendKeys(expect);
//因为博客系统使用的是第三方软件，所以不能直接使用sendKeys
driver.findElement(By.cssSelector("#editor > div.editormd-toolbar > div > ul > li:nth-child(17) > a > i")).click();
driver.findElement(By.cssSelector("#submit")).click();
getScreenShot(getClass().getName());
//获取最后一条博客的标题文本，检查是否和预期一样
String actual = driver.findElement(By.cssSelector("body > div.container > div.container-right > div:nth-child(5) > div.title")).getText();
Assertions.assertEquals(expect,actual);
}
4. Blog details page test
The details page test is similar to the list page test, except that the selected elements may be different during the test. .
@Test
public void detailPageLoadRight() throws IOException {
driver.findElement(By.cssSelector("body > div.container > div.container-right > div > h3"));
driver.findElement(By.cssSelector("body > div.container > div.container-right > div > div.date"));
getScreenShot(getClass().getName());
}
@AfterAll
public static void driverQuit() {
driver.quit();
}
In case the driver release is forgotten, directly write the driver release as a test class
QuitDriverTest
public class QuitDriverTest extends AutotestUtils {
private static ChromeDriver driver = createDriver();
@Test
public void quitDriver() {
driver.quit();
}
}
Summarize
Highlights of the test code of the blog system:
(1) Use the annotations provided by Junit5: avoid generating too many objects, resulting in waste of resources and time, and improve the efficiency of automated execution.
(2) The driver object is only created once, avoiding the waste of time and resources caused by repeatedly creating the driver object for each use case.
(3) Use parameterization: keep the use cases concise and improve the readability of the code.
(4) Use test suites: reduce the workload of testers, and execute all test cases at once through the suite.
(5) Waiting is used: the efficiency of automation operation is improved, and the stability of automation is improved.
(6) Screenshots: It is convenient to trace the problem and solve the problem.