【简码短链】使用Selenium实现UI自动化测试

1.环境准备

Chrome浏览器 版本为版本 129.0.6668.90（正式版本） （64 位）

129版本的Chrome浏览器的驱动,将webdriver放到jdk所在的bin目录下
在命令行中输入:

chromedriver

验证是否成功

打开IDEA,创建Maven项目,在

pom.xml

导入所需要的依赖包

<dependencies><dependency><groupId>org.seleniumhq.selenium</groupId><artifactId>selenium-java</artifactId><version>4.22.0</version></dependency><dependency><groupId>commons-io</groupId><artifactId>commons-io</artifactId><version>2.16.1</version></dependency><dependency><groupId>org.junit.jupiter</groupId><artifactId>junit-jupiter</artifactId><version>5.10.2</version><scope>test</scope></dependency><dependency><groupId>org.junit.platform</groupId><artifactId>junit-platform-suite</artifactId><version>1.8.2</version><scope>test</scope></dependency></dependencies>

创建common包用于存在公共的类/方法
Tests目录下用来存放测试用例

对每个页面进行测试时都需要先创建浏览器驱动对象,因此可以把创建浏览器驱动的方法放到common下面,并使用单例模式保证浏览器驱动只被创建一次
添加隐式等待,确保页面元素能够渲染出来

publicclassAutoTestUtils{publicChromeDriver driver;// 获取驱动对象publicChromeDrivergetChromeDriver(){if(driver ==null){
            driver =newChromeDriver();
            driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(10));}return driver;}}

添加屏幕截图功能

publicstaticList<String>getTime(){SimpleDateFormat sim1 =newSimpleDateFormat("yyyyMMdd-HHmmssSS");String filename = sim1.format(System.currentTimeMillis());SimpleDateFormat sim2 =newSimpleDateFormat("yyyyMMdd");String dirname = sim2.format(System.currentTimeMillis());List<String> list =newArrayList<>();
        list.add(dirname);
        list.add(filename);return list;}publicstaticvoidgetScreenShor(String str)throwsIOException{List<String> list =getTime();String filename ="./src/test/java/com/hyacinth/shortlinkAutoTest/"+list.get(0)+"/"+str+"_"+list.get(1)+".png";File srcfile = driver.getScreenshotAs(OutputType.FILE);FileUtils.copyFile(srcfile,newFile(filename));}

登录页面

测试用例页面如下:

首先在登录页面测试类中定义一个浏览器驱动对象,用来获取浏览器驱动

publicstaticChromeDriver driver =getChromeDriver();

因为每次都需要打开登录页面,因此定义一个方法打开登录页面,并使用@BeforeAll注解,让测试每次开始前都打开登录页面,通过调用get方法，可以导航到网页，为接下来的测试准备页面环境。

@BeforeAllstaticvoidbaseContor(){
        driver.get("http://www.shorturl.cloud/login");}

正常登录的测试:

@ParameterizedTest@CsvSource({"test,test1234","admin,admin123456"})voidloginSuccess(String username,String password)throwsInterruptedException{
         driver.findElement(By.xpath("//*[@id=\"el-id-7439-8\"]")).clear();
         driver.findElement(By.xpath("//*[@id=\"el-id-7439-8\"]")).sendKeys(username);

         driver.findElement(By.xpath("//*[@id=\"el-id-7439-9\"]")).clear();
         driver.findElement(By.xpath("//*[@id=\"el-id-7439-9\"]")).sendKeys(password);
         driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.logon > form > div.btn-gourp > div:nth-child(2) > button > span")).click();// 对登录结果进行检测
        driver.findElement(By.xpath("//*[@id=\"app\"]/div/section/main/div/div/div[1]/div[1]/div[1]"));
        driver.navigate().back();}

异常登录测试:

@ParameterizedTest@CsvSource({"admin,123123123","user","admin123456",",admin123456","admin,"})voidloginFail(String username,String password){
        driver.findElement(By.xpath("//*[@id=\"el-id-7439-8\"]")).clear();
        driver.findElement(By.xpath("//*[@id=\"el-id-7439-8\"]")).sendKeys(username);

        driver.findElement(By.xpath("//*[@id=\"el-id-7439-9\"]")).clear();
        driver.findElement(By.xpath("//*[@id=\"el-id-7439-9\"]")).sendKeys(password);
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.logon > form > div.btn-gourp > div:nth-child(2) > button > span")).click();// 对登录结果进行检测
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.logon > form > div.btn-gourp > div:nth-child(2) > button > span"));
        driver.navigate().refresh();}

注册页面

注册页面测试用例如下:

注册页面同样要先进入登录页面,使用@BeforeAll注解,让测试每次开始前都打开登录页面,通过调用get方法，为接下来的测试准备页面环境。

@BeforeAllstaticvoidbaseContor(){
        driver.get("http://www.shorturl.cloud");}

检查注册页面正常显示

@TestvoidloginPageLoadRight()throwsInterruptedException{// 检查 简码短链标题
        driver.findElement(By.xpath("//*[@id=\"app\"]/div[1]/h1"));// 检查 用户注册文本
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > h2"));// 检查 登录按钮
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > form > div.btn-gourp > div:nth-child(2) > button"));}

正常注册

@ParameterizedTest@CsvSource({"user1,[email protected],13453498765,user1,123123123","user2,[email protected],13456498765,,123123123"})voidregisterSuccessTest(String username,String email,String phone,String name,String password){
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > form > div.el-form-item.is-error.is-required.asterisk-left > div > div.el-input.el-input-group.el-input-group--prepend.el-input--suffix > div.el-input__wrapper")).sendKeys(username);
        driver.findElement(By.cssSelector("#email")).clear();
        driver.findElement(By.cssSelector("#email")).sendKeys(email);

        driver.findElement(By.cssSelector("#phone")).clear();
        driver.findElement(By.cssSelector("#phone")).sendKeys(phone);

        driver.findElement(By.cssSelector("#name")).clear();
        driver.findElement(By.cssSelector("#name")).sendKeys(name);

        driver.findElement(By.cssSelector("#phone")).clear();
        driver.findElement(By.cssSelector("#phone")).sendKeys(phone);// 点击注册
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > form > div.btn-gourp > div:nth-child(2) > button")).click();// 验证注册是否成功
        driver.findElement(By.xpath("//*[@id=\"app\"]/div/section/main/div/div/div[2]/div/div[1]/div/button[1]"));// 返回
        driver.navigate().back();}

异常注册
由于这里测试的数据比较多,可以使用csv文件存放测试数据,使用@CsvFileSource注解来读取文件中的内容

@ParameterizedTest@CsvFileSource(files ="C:\\Users\\wqe\\Desktop\\example.csv")voidregisterLoginFailTest(String username,String email,String phone,String name,String password){
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > form > div.el-form-item.is-error.is-required.asterisk-left > div > div.el-input.el-input-group.el-input-group--prepend.el-input--suffix > div.el-input__wrapper")).sendKeys(username);
        driver.findElement(By.cssSelector("#email")).clear();
        driver.findElement(By.cssSelector("#email")).sendKeys(email);

        driver.findElement(By.cssSelector("#phone")).clear();
        driver.findElement(By.cssSelector("#phone")).sendKeys(phone);

        driver.findElement(By.cssSelector("#name")).clear();
        driver.findElement(By.cssSelector("#name")).sendKeys(name);

        driver.findElement(By.cssSelector("#phone")).clear();
        driver.findElement(By.cssSelector("#phone")).sendKeys(phone);// 点击注册
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > form > div.btn-gourp > div:nth-child(2) > button")).click();// 验证注册是否成功
        driver.findElement(By.cssSelector("#app > div.login-page > div.login-box > div.register > h2"));}

主页面测试

因为进入主页需要登录,所以这里的测试用例执行要在登录之后.
每次测试前都要进行主页之后,因此和前面一样使用@BeforeAll注解进行设置

publicstaticChromeDriver driver =getChromeDriver();@BeforeAllstaticvoidbaseContor(){
        driver.get("http://shorturl.cloud/home/space");}

主页正常显示:

@TestvoidHomePageLoadRight(){
        driver.findElement(By.cssSelector("#app > div > section > header > div > div.logo"));
        driver.findElement(By.xpath("//*[@id=\"app\"]/div/section/main/div/div/div[1]/div[1]/div[1]"));
        driver.findElement(By.xpath("//*[@id=\"app\"]/div/section/main/div/div/div[1]/div[2]/div"));}