目錄

一、總述

二、登錄頁面測試

一些準備工作?

驗證頁面顯示是否正確

?驗證正常登錄的情況

該過程中出現的問題

驗證登錄失敗的情況

?關于登錄界面的總代碼?

測試視頻

三、注冊界面的自動化測試

測試代碼

過程中出現的bug?

測試視頻

四、博客列表頁測試

登錄情況下的測試

未登錄情況下的測試?

五、博客詳情頁測試

用戶已登錄的情況下測試

?用戶未登錄的情況下測試

六、個人主頁測試

七、博客編輯頁面測試

用戶登錄的情況下

八、博客修改頁面測試

用戶登錄的情況下

九、總結

總測試視頻

?總代碼

一、總述

?還記得這個SpringBoot實戰(zhàn)項目嗎？SpringBoot實戰(zhàn)——個人博客項目_是小魚兒哈的博客-CSDN博客

今天我們就對這個web項目，用selenium進行自動化測試，看看這個項目有什么問題？是否達到了我們的預期效果。

?博客網站如下：登陸頁面

?首先要對這個博客各個頁面設計測試頁面。

?下面我們就一個頁面一個頁面的寫代碼，進行測試。

二、登錄頁面測試

一些準備工作?

首先我們新建一個Maven項目。

在test包下面寫我們的測試代碼。

?因為我們在自動化測試的時候要頻繁獲取頁面中的元素，但很多時候我們頁面元素的加載速度趕不上我們自動化代碼的執(zhí)行速度，所以就會導致找不到元素這種情況。

可以看到，報了錯誤——》找不到我們頁面對應的元素。

那么我們加上隱式等待試試

?因此，我們不如在整個項目中，創(chuàng)建一個公共類（進行隱式等待，讓我們的程序能夠等一下我們的頁面加載）

【另外，?隱式等待 作用于 WebDriver 整個生命周期】
【只要沒有走到 driver.quit，即沒有退出瀏覽器，隱式等待都是一直存在的】?

所以我們之后要寫的登錄界面只要繼承的隱式等待，自然也能夠使得測試登錄界面的代碼能夠稍微停頓一下，等頁面渲染完成。

??

下面我們進行登錄頁面的自動化測試代碼編寫

我們要編寫3個測試用例

• 驗證頁面顯示是否正確
• 驗證正常登錄的情況
• 驗證登錄失敗的情況

首先因為我們每個測試用例都要 創(chuàng)建驅動實例，進入到用戶登錄頁面、所以我們不妨這樣做：

?這樣再將我們的測試用例按一定的順序來執(zhí)行，就會使得我們的整個測試過程很流程、自然。

驗證頁面顯示是否正確

/**
     * 檢查登錄頁面是否正常顯示
     * @throws InterruptedException
     */
    @Test  
    @Order(1)
    void loginPageTest() throws InterruptedException {
        // 隱式等待--// 隱式等待，更加絲滑——》作用于下面的整個作用領域，這個方法中的所有元素，在這3秒內不斷輪詢
        driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(3));
        // 利用斷言判斷登錄的文本內容顯示是否正確
        String expect = "登錄";
        String actual = driver.findElement(By.cssSelector("body > div.login-container > div > h3")).getText(); // 檢查登錄頁面的登錄文本是否存在
        Assertions.assertEquals(expect, actual);

        driver.findElement(By.cssSelector("body > div.nav > a:nth-child(4)")); // 檢查博客登錄頁的主頁超鏈接是否存在
        // 檢查提交按鈕是否存在
        driver.findElement(By.cssSelector("#submit"));

    }

?上面中我們用到了junit和隱式等待

junit 中提供和了非常強大的注解功能

@Test說明方法 是測試方法，執(zhí)行當前這個類時，會自動的執(zhí)行該類下的所有帶@Test注解的用例

下面我們進行測試

?驗證正常登錄的情況

/**
     * 檢查正常登錄的情況，每寫一個測試用例就測試一下
     */
    @ParameterizedTest // 寫了該注解就不用在寫@Test注解了(多參數）
    @Order(2)
    @CsvSource({"admin, admin", "小魚兒, 123"})
    void loginRightTest(String username, String password) throws InterruptedException, IOException {
        // 隱式等待是作用不了非HTML頁面的元素的，所以彈窗無法等待，看下是否在切換到彈窗之前彈窗還沒有出現，終端報的錯誤是不是noalert
        // 多個賬號登錄，在重新輸入賬號時，需要把之前的輸入的內容清空
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password")).clear();
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password")).sendKeys(password);
        driver.findElement(By.cssSelector("#submit")).click();
        // 隱式等待無法處理彈窗 && 顯示等待和隱式等待無法共存（父類AutotestUtils中用了隱式等待）
        Thread.sleep(100); // 顯示等待，等待彈窗出現
        Alert alert = driver.switchTo().alert();
        alert.accept(); // 選擇確認

        // 上述步驟只是說明輸入了賬號和密碼，但還不知道點擊提交后是否會跳轉到博客列表頁
        String expect = "http://49.235.66.46:9000/blog_list.html";
        String actual = driver.getCurrentUrl();
        Assertions.assertEquals(expect, actual); // 查看當前的url是否在博客詳情頁面
        // 進行截圖，看當前是否跳轉到了登錄界面
        // 程序執(zhí)行的速度和頁面渲染的速度
        File srcFile =  driver.getScreenshotAs(OutputType.FILE);
        String fileName = "loginRightTest.png";
        FileUtils.copyFile(srcFile, new File(fileName));
        //因為我們要測試多個賬號，所有在一個賬號檢測完了后，還需要回退到登錄界面
        driver.navigate().back();
    }

該過程中出現的問題

?在驗證用戶正常登錄的過程中，我一開始沒有用強制等待或者顯示等待（我只是用了隱式等待）。結果——在處理彈窗的過程就出現了問題。

?咦！不對呀，我不是用了隱式等待了嗎？

難道不應該是等彈窗加載完了，程序才會繼續(xù)往下執(zhí)行——獲取彈窗的嗎？

原來：

隱式等待是作用不了非HTML頁面的元素的，所以彈窗無法等待（彈窗還沒有出現，頁面還沒加載完成，我們的程序就在嘗試著獲取彈窗了——》這怎么獲?。孔匀痪蛨箦e了?。?！

那么我們既然用不了隱式等待，我們用顯示等待好了。但你別忘了，你這個對登錄界面測試的類是繼承了AutoTestUtils的（里面實現了隱式等待）

并且——顯示等待和隱式等待盡量不要共存（會出現一些意想不到的錯誤）

所以呢？這種情況下，我們只好用強制等待了。

但是——強制等待是比較消耗時間的?

我們需要考慮在整個項目中，類似這樣的強制等待多不多，如果太多的話——我們就要考慮重寫換一種策略了。

驗證登錄失敗的情況

    /**
     * 檢查登錄失敗的情況
     */
    @Order(3)
    @ParameterizedTest // 多個參數
    @CsvSource({"admin, 123"})
    void loginFailTest(String username, String password) throws IOException, InterruptedException {
        // 把之前默認填充內容清空
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password")).clear();
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password")).sendKeys(password);
        driver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);
        Alert alert = driver.switchTo().alert();
        System.out.println(alert.getText());
    }

?關于登錄界面的總代碼?

package webAutoTest.tests;

import com.sun.xml.internal.stream.StaxErrorReporter;
import org.apache.commons.io.FileUtils;
import org.junit.jupiter.api.*;
import org.junit.jupiter.params.ParameterizedTest;
import org.junit.jupiter.params.provider.CsvSource;
import org.junit.jupiter.params.provider.ValueSource;
import org.openqa.selenium.Alert;
import org.openqa.selenium.By;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import webAutoTest.common.AutotestUtils;
import org.openqa.selenium.OutputType;

import java.io.File;
import java.io.IOException;
import java.time.Duration;
@TestMethodOrder(MethodOrderer.OrderAnnotation.class) // 說明當前該類下面的測試方法要按一定的順序執(zhí)行
public class loginTest extends AutotestUtils {
    public static ChromeDriver driver = createDriver();
    @Test
    @BeforeAll // 被@BeforeAll修飾的方法要是靜態(tài)的
    static void init() {
        // 跳轉到博客登錄頁面
        driver.get("http://49.235.66.46:9000/login.html");
    }

    /**
     * 檢查登錄頁面是否正常顯示
     * @throws InterruptedException
     */
    @Test
    @Order(1)
    void loginPageTest() throws InterruptedException {
        // 隱式等待--// 隱式等待，更加絲滑——》作用于下面的整個作用領域，這個方法中的所有元素，在這3秒內不斷輪詢
        driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(3));
        // 利用斷言判斷登錄的文本內容顯示是否正確
        String expect = "登錄";
        String actual = driver.findElement(By.cssSelector("body > div.login-container > div > h3")).getText(); // 檢查登錄頁面的登錄文本是否存在
        Assertions.assertEquals(expect, actual);

        driver.findElement(By.cssSelector("body > div.nav > a:nth-child(4)")); // 檢查博客登錄頁的主頁超鏈接是否存在
        // 檢查提交按鈕是否存在
        driver.findElement(By.cssSelector("#submit"));

    }

    /**
     * 檢查正常登錄的情況，每寫一個測試用例就測試一下
     */
    @ParameterizedTest // 寫了該注解就不用在寫@Test注解了(多參數）
    @Order(2)
    @CsvSource({"admin, admin", "小魚兒, 123"})
    void loginRightTest(String username, String password) throws InterruptedException, IOException {
        // 多個賬號登錄，在重新輸入賬號時，需要把之前的輸入的內容清空
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password")).clear();
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password")).sendKeys(password);
        driver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);
        Alert alert = driver.switchTo().alert();
        alert.accept(); // 選擇確認

        // 上述步驟只是說明輸入了賬號和密碼，但還不知道點擊提交后是否會跳轉到博客列表頁
        String expect = "http://49.235.66.46:9000/blog_list.html";
        String actual = driver.getCurrentUrl();
        Assertions.assertEquals(expect, actual); // 查看當前的url是否在博客詳情頁面
        // 進行截圖，看當前是否跳轉到了登錄界面
        // 程序執(zhí)行的速度和頁面渲染的速度
        File srcFile =  driver.getScreenshotAs(OutputType.FILE);
        String fileName = "loginRightTest.png";
        FileUtils.copyFile(srcFile, new File(fileName));
        //因為我們要測試多個賬號，所有在一個賬號檢測完了后，還需要回退到登錄界面
        driver.navigate().back();
    }

    /**
     * 檢查登錄失敗的情況
     */
    @Order(3)
    @ParameterizedTest // 多個參數
    @CsvSource({"admin, 123"})
    void loginFailTest(String username, String password) throws IOException, InterruptedException {
        // 把之前默認填充內容清空
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password")).clear();
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password")).sendKeys(password);
        driver.findElement(By.cssSelector("#submit")).click();
        Thread.sleep(100);
        Alert alert = driver.switchTo().alert();
        System.out.println(alert.getText());
    }
    @AfterAll
    @Test
    static void quit() {
        driver.quit();
    }
}

測試視頻

三、注冊界面的自動化測試

測試代碼

package webAutoTest.tests;

import org.apache.commons.io.FileUtils;
import org.checkerframework.checker.units.qual.A;
import org.junit.jupiter.api.*;
import org.junit.jupiter.params.ParameterizedTest;
import org.junit.jupiter.params.provider.CsvSource;
import org.openqa.selenium.Alert;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.chrome.ChromeDriver;
import webAutoTest.common.AutotestUtils;

import java.io.File;
import java.io.IOException;

/**
 * 注冊界面的自動化測試
 */
@TestMethodOrder(MethodOrderer.OrderAnnotation.class) // 說明當前該類下面的測試方法要按一定的順序執(zhí)行
public class regTest extends AutotestUtils { // 繼承用于隱式等待的公共方法
    public static ChromeDriver driver = new ChromeDriver();
    @Test      // @Test說明方法 是測試方法，執(zhí)行當前這個類時，會自動的執(zhí)行該類下的所有帶@Test注解的用例
    @BeforeAll // 帶有BeforeAll注解的方法會在當前類下的所有測試用例之前（方法）執(zhí)行一次，注意只是執(zhí)行一次
    public static void init() {
        // 既然是對注冊界面的測試，自然要先跳轉到該界面
        driver.get("http://49.235.66.46:9000/reg.html");
    }

    /**
     * 對頁面內容的完整性進行測試
     */
    @Test
    @Order(1)
    public void regPageTest() {
        // 利用斷言驗證頁面顯示的文本是否正確
        String expect = "注冊";
        String actual = driver.findElement(By.cssSelector("body > div.login-container > div > h3")).getText();
        Assertions.assertEquals(expect, actual); // 如果不正確

        driver.findElement(By.cssSelector("body > div.nav > a:nth-child(4)")); // 檢查博客登錄頁的主頁超鏈接是否存在
        // 檢查提交按鈕是否存在
        driver.findElement(By.cssSelector("#submit"));
    }
    /**
     * 正常注冊
     */
    @ParameterizedTest // 多參數——加了該注解就不用@Test了
    @Order(2)
    @CsvSource({"皮皮, 123456, 123456"}) // 多參數
    public void regRightTest(String username, String password1, String password2) throws InterruptedException, IOException {
        // 每次都要提前把之前輸入框的內容給清除（不管有沒有內容）
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password1")).clear();
        driver.findElement(By.cssSelector("#password2")).clear();
        // 將信息填入輸入框
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password1")).sendKeys(password1);
        driver.findElement(By.cssSelector("#password2")).sendKeys(password2);
        // 找到提交按鈕，并點擊提交
        driver.findElement(By.cssSelector("#submit")).click();
        // 強制等待，讓彈窗顯示出來（避免我們頁面還沒加載完成，我們下面的代碼就嘗試獲取彈窗
        Thread.sleep(500);

        // 注冊成功后，會出現彈窗，獲取彈窗并且關閉
        Alert alert = driver.switchTo().alert();
        alert.accept(); // 點擊彈窗中的確定，以便讓程序繼續(xù)執(zhí)行下去
        // 注冊成功后，應該會跳轉到登錄頁面
        Thread.sleep(100);
        String expectURL = "http://49.235.66.46:9000/login.html";
        String actualURL = driver.getCurrentUrl(); // 獲取當前頁面的URL
        Assertions.assertEquals(expectURL, actualURL);
        // 獲取此時的屏幕截圖，此時應該以及跳轉到了登錄頁面
        File srcFile = driver.getScreenshotAs(OutputType.FILE);
        String fileName = "regRightTest.png";
        FileUtils.copyFile(srcFile, new File(fileName));
        // 因為注冊成功會跳轉到登錄界面，所以但接下來我們還有在注冊界面測試，所以要回退到注冊界面
        driver.navigate().back();
    }
    /**
     * 測試注冊失敗的情況
     * (小魚兒這個用戶名我以及注冊過了再次注冊，由于用戶名的唯一約束，會導致注冊失?。?     * (前后兩次輸入的密碼不一致）
     */
    @ParameterizedTest
    @Order(3)
    @CsvSource({"小魚兒, 1234, 1234", "阿良, 123, 123456"})
    public void regFailTest(String username, String password1, String password2) throws InterruptedException {
        // 每次輸入信息前， 先要清除輸入框的原有內容
        driver.findElement(By.cssSelector("#username")).clear();
        driver.findElement(By.cssSelector("#password1")).clear();
        driver.findElement(By.cssSelector("#password2")).clear();
        // 往輸入框中輸入數據
        driver.findElement(By.cssSelector("#username")).sendKeys(username);
        driver.findElement(By.cssSelector("#password1")).sendKeys(password1);
        driver.findElement(By.cssSelector("#password2")).sendKeys(password2);
        driver.findElement(By.cssSelector("#submit")).click();
        // 等待彈窗加載完成
        Thread.sleep(100);
        Alert alert = driver.switchTo().alert(); // 獲取彈窗
        // 利用斷言判斷是否注冊失敗
        if (password1.equals(password2)) {
            String expect = "注冊失敗，請檢查你的輸入！"; // 前后密碼一致的情況下
            String actual = alert.getText();
            alert.accept(); // 獲取到彈窗內容后在關閉彈窗
            Assertions.assertEquals(expect, actual); // 看瀏覽器的實際彈窗內容是否和我們預期的一樣
        }
        else {
            String expect = "兩次密碼輸入不一致，請先檢查！";
            String acutal = alert.getText();
            alert.accept();
            Assertions.assertEquals(expect, acutal);
        }

    }

    /**
     * 關閉注冊彈窗
     */
    @Test
    @AfterAll  // 帶有AfterAll注解的方法會在當前類下的所有測試用例(方法）執(zhí)行之后 執(zhí)行一次，注意只是執(zhí)行一次
    public static void close() {
        driver.quit();
    }

}

過程中出現的bug?

2、在注冊頁面的自動化測試的過程中，我通過多對象傳入同一個測試方法來對多種注冊失敗的情況進行測試（該用戶以及注冊、前后密碼輸入不一致）

結果在通過斷言——發(fā)現我預期的彈窗內容和實際的彈窗內容不一致，導致測試的時候出現問題

通過查看下面的報錯信息，結合程序一起查看，我才發(fā)現——我的判斷條件有問題

應該用password1.equals(password2)

接著我改好了，但程序又出現了問題??

No ParameterResolver registered for parameter [java.lang.String arg1] in method [public void webAutoTest.tests.regTest.regFailTest(java.lang.String,java.lang.String,java.lang.String) throws java.lang.InterruptedException].

中間的逗點我寫成了全角的中文——》當然有問題啊

改成半角的逗點后——》又又有新的問題出現了??

通過這行報錯信息可以看出

Command: [f0ef8a1466c85d3fc87f96ebd8e83a28, findElement {using=css selector, value=#username}]

在第二個錯誤登錄的測試用例的執(zhí)行的時候——》他找不到頁面中的元素#username。

不對呀?。?！我明明這個cssSelector寫的沒有問題啊，頁面中也確實存在這個元素啊，為什么會找不到呢？

后來我把 ——driver.findElement(By.cssSelector("#username")).clear(); 這行代碼給注釋掉了

結果

看來不是頁面元素selector的問題，難道是頁面加載還沒完成？？？

不會的——我們整個類繼承了AutotestUtil（里面實現了隱式等待了啊，這里又不是彈窗，隱式等待應該能夠發(fā)揮作用的呀?。。。?/strong>

彈窗——于是我檢查了代碼中有關彈窗的部分。

結果：

沒錯，我是獲取彈窗了

但是我沒關閉彈窗啊?。。?/span>

這就導致在執(zhí)行第二個測試用例的時候，上一個測試用例的彈窗還沒有關閉——當然獲取不到第二個測試用例的輸入了呀！

終于可以了，不容易啊！