自動テスト実践ブログシステム


序文

この記事では、以前に行ったブログ システムのテスト ケースを作成し、Selenium4 自動テスト ツールと Junit5 単体テスト フレームワークを使用して、ブログ システムのテスト ケースのコードを作成します。


1. ブログ システムのテスト ケースを作成する

ブログシステムはログインページ、一覧ページ、詳細ページ、編集ページの4ページで構成されており、詳細や導入方法については過去のブログシステムの記事を参照してください。

ここに画像の説明を挿入

2. 自動テスト

ドライバーの作成はテストの共通部分であるため、ドライバーをクラスに配置して、ログイン ページ、ログイン リスト ページ、ログイン詳細ページ、ログイン編集ページのテスト クラスを作成し、最後にスイートを作成して、テストするクラスを選択します。
ここに画像の説明を挿入

AutotestUtils クラスには、オブジェクトを作成し、テスト実行中にスクリーンショットを保存するためのメソッドが含まれています。

    //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. ブログログインページのテスト

テストケースに従って書きます。

主に技術テストスイート @Suite で使用され、URL の取得、ログインの成功/失敗、リソースの終了のシーケンスを整理します。

注: ログイン用に複数のデータ セットを設定する場合 (@CsvSource を使用)、最初にログイン ボックス内のデータをクリアする必要があります。

ブログログインテスト

//调用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. ブログ一覧ページのテスト

ログインに成功したら、ブログ一覧ページに入り、一覧ページに何らかの要素があるかどうかを確認することで、ブログ一覧ページが正常に表示されるかどうかを確認します。
ブログリストテスト:

    /**
     * 登录列表页面可以正常显示
     */
    @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. ブログ編集ページのテスト

ブログ執筆ページでは
、まずブログ執筆ページが正常に表示されているかどうかを確認し、ブログ一覧ページと同様に特定の要素が存在するかどうかでブログ執筆ページが正常に表示されているかどうかを判断する必要があります。ブログの編集投稿が正常かどうかを確認し、
ブログを公開します。ブログを作成するとき、ブログ エディターはサードパーティのプラグインを使用するため、特定の要素をクリックして直接 sendKeys を使用して編集することはできません。最後に、ブログを公開した後
、最新のブログのタイトルとブログ編集時のタイトルを比較し、一致していればブログは正常に公開されます。

ブログ編集テスト

    /**
     *  检查编辑页面可以正常打开
     */
    @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. ブログ詳細ページのテスト

詳細ページのテストはリスト ページのテストと似ていますが、テスト中に選択された要素が異なる場合がある点が異なります。

    @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();
    }

ドライバーのリリースを忘れた場合は、ドライバーのリリースをテスト クラスとして直接記述します
QuitDriverTest

public class QuitDriverTest extends AutotestUtils {
    
    
    private static ChromeDriver driver = createDriver();
    @Test
    public void quitDriver() {
    
    
        driver.quit();
    }
}

ここに画像の説明を挿入

要約する

ブログ システムのテスト コードのハイライト:
(1) Junit5 が提供するアノテーションを使用します。リソースと時間の無駄につながるオブジェクトの生成が多すぎることを回避し、自動実行の効率を向上させます。
(2) ドライバー オブジェクトは 1 回だけ作成されるため、ユース ケースごとにドライバー オブジェクトを繰り返し作成することによる時間とリソースの無駄が回避されます。
(3) パラメータ化を使用する: ユースケースを簡潔に保ち、コードの読みやすさを向上させます。
(4) テスト スイートの使用: テスターの作業負荷を軽減し、スイートを通じてすべてのテスト ケースを一度に実行します。
(5) 待機を使用すると、自動化操作の効率が向上し、自動化の安定性が向上します。
(6) スクリーンショット: 問題を追跡し、問題を解決するのに便利です。

おすすめ

転載: blog.csdn.net/qq_45283185/article/details/129348566