江门市住房和城乡建设局门户网站在线看网址不收费不登录
项目背景介绍
背景:当在学习一项技能的时候,我们总会习惯通过博客来记录所学的知识点,方便后期遗忘时随时查看和快速复习。本次开发的Web网站程序便是为了更加轻量和方便地记录自己的学习笔记
概述:一个Web网站程序,可以随时随地查看自己和其他用户发布的博客,也可以自己注册登录后发布属于自己的博客
相关技术栈:SpringBoot SpringMVC MyBatis MySQL Redis HTML CSS JavaScript
博客登录页:
博客注册页:
博客主页:
个人博客列表页:
博客详情页:
博客编辑页:
草稿列表:
写博客页:
测试计划
1. 手工测试
1.1 编写测试用例
1.2 执行测试用例(部分)
由于篇幅及时间受限,仅针对部分用例进行了测试
测试环境
操作系统:
版本 Windows 10 家庭中文版
版本号 22H2
安装日期 2021/6/19
操作系统内部版本 19045.2728
体验 Windows Feature Experience Pack 120.2212.4190.0浏览器:
Google Chrome 版本 111.0.5563.65(正式版本) (64 位)
网络:
协议: Wi-Fi 5 (802.11ac)
网络频带: 5 GHz
博客登录页:界面能否正常加载,输入正确或错误的账号、密码及验证码是否能得到预期的响应
a)界面
b)输入正确的账号、密码错误的验证码
预期结果:弹窗提示验证码错误,并自动刷新验证码
实际结果如下:
c)输入正确的验证码、错误的账号或密码
预期结果:提示用户名或密码错误。
实际结果如下:
d)输入正确的账号、密码及验证码:
预期结果:跳转到个人博客列表页。
实际结果如下:
e)输入正确的账号和密码,同一用户重复登录:
预期结果:提示用户重复登录,然后返回该用户博客列表页。
实际结果如下:
f)同一用户多次输入错误的密码及正确的验证码:
预期结果:提示用户账户被冻结,一段时间内禁止该用户登录。
实际结果如下:
博客列表页:检测界面是否符合预期,点击“查看全文”按钮是否能跳转到对应的博客详情页,点击注销是否能退出登录
a)界面
b)点击查看详情
预期结果:进入到对应的博客详情页,且能够正确加载文章内容。
实际结果如下:
c)点击删除
预期结果:删除对应文章,弹窗提示删除成功,作者文章计数更新,并自动刷新页面。
实际结果如下:
通过观察我们发现此处作者的文章计数器并未更新,不符合预期结果。由于这里采用了Redis缓存用户信息,而此处采用的是缓存过期自动更新的设置,没有进行主动的数据同步,推测是由于缓存更新不及时导致的结果。
此处我们手动删除缓存后再刷新测试,得到结果如下:
可以确定导致问题的原因就是缓存更新不及时导致
d)点击修改
预期结果:获取对应文章内容,进入对应文章修改页面。
实际结果如下:
e)退出登录
预期结果:删除对应用户token,并返回登录页
实际结果如下:
2. 使用Selenium进行Web端UI自动化测试
2.1 为什么需要自动化测试
由于随着项目版本的迭代,功能的逐渐增多,各种功能回归测试的需要,单纯的手工测试已经难以满足我们对于测试效率的要求,于是我们引入了自动化测试。它能够将人工从重复机械的测试过程中解放,使得人力资源能够投入到更加关键的测试中。
2.2 测试环境
测试环境
操作系统:
版本 Windows 10 家庭中文版
版本号 22H2
安装日期 2021/6/19
操作系统内部版本 19045.2728
体验 Windows Feature Experience Pack 120.2212.4190.0浏览器:
Microsoft Edge版本 111.0.1661.44 (正式版本) (64 位)
网络:
协议: Wi-Fi 5 (802.11ac)
网络频带: 5 GHzSelenium:
版本:4.0.0
驱动版本 :111.0.1661.44(x64)
2.3 编写测试用例
2.4 自动化测试代码
2.4.1 实现工具类,增加代码复用
package com.example.blogautotest.common;import org.apache.commons.io.FileUtils;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.edge.EdgeDriver;import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.time.Duration;
import java.util.ArrayList;
import java.util.List;public class AutotestUtils {public static EdgeDriver driver;//创建驱动对象public static EdgeDriver createDriver(){//单例模式if(driver==null){driver=new EdgeDriver();//创建隐式等待driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(5));}return driver;}//获取当前时间将截图按照时间保存public List<String> getTime(){//文件夹以天保存//截图以毫秒时间戳保存SimpleDateFormat sim1=new SimpleDateFormat("yyyyMMdd-HHmmssSS");SimpleDateFormat sim2 = new SimpleDateFormat("yyyyMMdd");String filename=sim1.format(System.currentTimeMillis());String dirname=sim2.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();// ./指的是当前的项目路径下,也就是BlogAutoTest下String filename="./src/test/java/com/blogautotest/"+list.get(0)+"/"+str+"_"+list.get(1)+".png";File srcfile=driver.getScreenshotAs(OutputType.FILE);//把屏幕截图生成的文件放到指定的路径FileUtils.copyFile(srcfile,new File(filename));}
}
2.4.2 登陆页面
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.*;
import org.junit.jupiter.params.ParameterizedTest;
import org.junit.jupiter.params.provider.CsvSource;
import org.openqa.selenium.By;
import org.openqa.selenium.edge.EdgeDriver;import java.io.IOException;//设置优先级
@TestMethodOrder(MethodOrderer.OrderAnnotation.class)
public class BlogLoginTest extends AutotestUtils {public static final String UNIVERSAL_KAPTCHA_CODE="c8fd27d19b2aa9fa24affd2a4726778c";public static EdgeDriver driver=createDriver();@BeforeAllpublic static void baseControl(){driver.get("http://127.0.0.1:8080/login.html");}/*检查登录页面打开是否正确检查点:登录标题 用户名是否存在*/@Test@Order(1)public void loginPageLoadRight() throws IOException {//检验页面是否加载正确(两个检查点)driver.findElement(By.cssSelector("body > div.login-container > div > h3"));driver.findElement(By.cssSelector("body > div.login-container > div > div:nth-child(2) > span"));getScreenShot(getClass().getName());}@ParameterizedTest@CsvSource({"zhangsan,123","admin,admin"})@Order(2)public void loginSuc(String name , String password) throws InterruptedException, IOException{driver.findElement(By.cssSelector("#username")).clear();driver.findElement(By.cssSelector("#password")).clear();driver.findElement(By.cssSelector("#rightCode")).clear();driver.findElement(By.cssSelector("#username")).sendKeys(name);driver.findElement(By.cssSelector("#password")).sendKeys(password);driver.findElement(By.cssSelector("#rightCode")).sendKeys(UNIVERSAL_KAPTCHA_CODE);driver.findElement(By.cssSelector("#submit")).click();//处理弹窗Thread.sleep(300);driver.switchTo().alert().accept();//对登录结果进行检测,存在草稿页元素代表登录成功driver.findElement(By.cssSelector("body > div.nav > a:nth-child(5)"));//getScreenShot(getClass().getName());driver.navigate().back();}@ParameterizedTest@CsvSource({"admin,123","zhangsan,666"})@Order(3)public void loginFail(String name,String password) throws IOException, InterruptedException {driver.findElement(By.cssSelector("#username")).clear();driver.findElement(By.cssSelector("#password")).clear();driver.findElement(By.cssSelector("#rightCode")).clear();driver.findElement(By.cssSelector("#username")).sendKeys(name);driver.findElement(By.cssSelector("#password")).sendKeys(password);driver.findElement(By.cssSelector("#rightCode")).sendKeys(UNIVERSAL_KAPTCHA_CODE);driver.findElement(By.cssSelector("#submit")).click();//处理弹窗Thread.sleep(300);//获取弹窗内容String text=driver.switchTo().alert().getText();String except="登陆成功!";driver.switchTo().alert().accept();Assertions.assertNotEquals(except,text);//获取当前页面截屏//getScreenShot(getClass().getName());}
}
2.4.3 博客主页
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.Assertions;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.edge.EdgeDriver;import java.io.IOException;public class BlogListTest extends AutotestUtils {public static EdgeDriver driver=createDriver();@BeforeAllpublic static void baseControl(){driver.get("http://127.0.0.1:8080/blog_list.html");}@Testpublic void listPageLoadRight(){//检查博客列表加载是否正常driver.findElement(By.cssSelector("body > div.container > div > div.blog-pagnation-wrapper > button:nth-child(1)"));driver.findElement(By.cssSelector("body > div.container > div > div.blog-pagnation-wrapper > button:nth-child(4)"));}@Testpublic void jumpTest() throws InterruptedException {//测试分页能否正常跳转Thread.sleep(500);driver.findElement(By.cssSelector("body > div.container > div > div.blog-pagnation-wrapper > button:nth-child(3)")).click();Assertions.assertEquals("http://127.0.0.1:8080/blog_list.html?pindex=2&psize=3",driver.getCurrentUrl());Thread.sleep(500);driver.findElement(By.cssSelector("body > div.container > div > div.blog-pagnation-wrapper > button:nth-child(2)")).click();Assertions.assertEquals("http://127.0.0.1:8080/blog_list.html?pindex=1&psize=3",driver.getCurrentUrl());Thread.sleep(500);driver.navigate().back();}
}
2.4.4 博客详情页
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.edge.EdgeDriver;import java.io.IOException;public class BlogDetailTest extends AutotestUtils {public static EdgeDriver driver=createDriver();@BeforeAllpublic static void baseControl(){driver.get("http://127.0.0.1:8080/blog_content.html?id=12869974016131072");}@Testpublic void blogDeailLoadRight() throws IOException{driver.findElement(By.cssSelector("#data"));driver.findElement(By.cssSelector("#title"));}
}
2.4.5 博客编辑页
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.Assertions;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.edge.EdgeDriver;import java.io.IOException;public class BlogEditTest extends AutotestUtils {public static EdgeDriver driver=createDriver();@BeforeAllpublic static void baseControl(){driver.get("http://127.0.0.1:8080/blog_edit.html");}@Testpublic void editAndSubimitBlog() throws IOException, InterruptedException {driver.findElement(By.cssSelector("#title")).sendKeys("自动化测试");//博客系统使用到的编辑是第三方软件,所以不能直接使用sendKeys向编辑模块发送文本driver.findElement(By.cssSelector("#editorDiv > div.editormd-toolbar > div > ul > li:nth-child(30)")).click();driver.findElement(By.cssSelector("body > div.blog-edit-container > div.title > button:nth-child(2)")).click();Thread.sleep(300);String actual=driver.switchTo().alert().getText();driver.switchTo().alert().accept();String expect = "恭喜:添加成功!";Assertions.assertEquals(expect,actual);}
}
2.4.6 个人列表页
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.Assertions;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.edge.EdgeDriver;public class MyBlogListTest extends AutotestUtils {public static EdgeDriver driver=createDriver();@BeforeAllpublic static void baseControl(){driver.get("http://127.0.0.1:8080/myblog_list.html");}@Testpublic void myListPageLoadRight(){//检查博客列表加载是否正常driver.findElement(By.cssSelector("body > div.nav > a:nth-child(7)"));driver.findElement(By.cssSelector("body > div.container > div.container-left > div > a"));driver.findElement(By.cssSelector("body > div.container > div.container-right > div.blog-pagnation-wrapper > button:nth-child(1)"));driver.findElement(By.cssSelector("body > div.container > div.container-right > div.blog-pagnation-wrapper > button:nth-child(3)"));}@Testpublic void jumpTest(){//测试导航栏能否正常跳转driver.findElement(By.cssSelector("body > div.nav > a:nth-child(4)")).click();Assertions.assertEquals("http://127.0.0.1:8080/blog_list.html",driver.getCurrentUrl());driver.navigate().back();driver.findElement(By.cssSelector("body > div.nav > a:nth-child(6)")).click();Assertions.assertEquals("http://127.0.0.1:8080/blog_edit.html",driver.getCurrentUrl());driver.navigate().back();}
}
2.4.7 退出驱动
package com.example.blogautotest.Tests;import com.example.blogautotest.common.AutotestUtils;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.edge.EdgeDriver;//用于最后关闭驱动
public class driverQuitTest extends AutotestUtils {public static EdgeDriver driver=createDriver();@Testpublic void driverQuit(){driver.quit();}
}
2.4.8 测试结果
可以看到所有测试用例均通过
2.4.9 自动化测试亮点
1.通过使用junit5中的注解,避免生成过多的测试对象,减少资源和时间上的浪费,提高了自动化执行的效率
2.只创建一次驱动,避免每个用例重复创建驱动造成时间和资源的浪费。
3.使用参数化,保持用例的整洁,提高代码的可读性。
4.使用隐式等待,提高了自动化运行效率,提高了自动化的稳定性。
5.使用屏幕截图,方便问题的溯源以及解决。
2.4.10 完整代码
BlogAutoTest: 个人博客系统UI自动化测试