PageObject（PO）設計模式在 UI 自動化中的實踐總結（以 QQ 郵箱登陸為例）

来源:https://www.cnblogs.com/chengzi-ceba/archive/2022/05/06/16230074.html
-Advertisement-
Play Games

Spring Ioc源碼分析系列--Ioc的基礎知識準備 本系列文章代碼基於Spring Framework 5.2.x Ioc的概念 在Spring里，Ioc的定義為The IoC Container，翻譯過來也就是Ioc容器。為什麼會被叫做容器呢？我們來比對一下日常生活中的容器，也就是那些瓶瓶罐 ...


1080×608 28.8 KB

 

PO的思想最早是2013年由IT大佬Martin Flower提出的：

martinfowler.com

bliki: PageObject

A page object wraps an HTML page, or fragment, with an application-specific API, allowing you to manipulate page elements for testing without digging around in the HTML.

   

沒錯，就是他
— 沒錯，就是他 —

在他的文章里有這樣一張經典樣圖,圖片中展示了測試代碼中直接操作HTML元素和使用PO模式將page對象封裝成一個HTML頁面，通過特定方法來操作元素的對比；如下圖：

我們知道，PO主要就是應用在UI自動化測試上(Web端和App端均適用)，因此2015年，Selenium官方給出了PO的設計原則說明：https://github.com/SeleniumHQ/selenium/wiki/PageObjects

對官方的原則進行解讀，我們可以得到如下的信息：

  • 用公共方法代表UI所提供的功能
    如企業微信的通訊錄頁面，其中有“添加成員”、“批量導入，導出”、“設置所在部門”、“刪除”等功能，這些功能都可以封裝成通訊錄這個UI界面所提供的方法；當然，部分數據較多或者較為複雜，復用性也比較高的話，例如添加成員，也可以單獨抽離出來做一個page。

  • 方法應該返回其他的PageObject或者返回用於斷言的數據
    我們既然以頁面為對象進行業務操作，那麼一個方法結束後必然要有返回值：
    要麼返回一個頁面，這個頁面可以是當前頁(因為可能還要在這個頁面進行其他操作)，可以是其他頁面(我們操作某個方法後很可能會跳轉到另一個頁面進行下一步操作)；
    要麼返回需要斷言的值，測試用例總歸有預期結果的對吧，那麼最後肯定要有方法返回一個值，用來給我們做斷言，來判斷用例執行是否符合預期結果。

不要返回null或者寫一個void沒有返回值的方法，這樣的方法沒有意義，既不能為下一步操作創造條件，也不能為用例的斷言提供結果。

  • 同樣的行為不同的結果可以建模為不同的方法
    這個就比較好理解了，拿最簡答的登錄場景來說：
    同樣的行為： 無論輸入的賬號密碼正確與否，都是按照輸入賬號密碼，點擊登錄這樣的行為去操作
    不同的結果：賬號密碼錯誤和正確得到的登錄響應一定是不同的。
    建模為不同的方法：對於登錄頁來說，就可以根據登錄信息正確與否建模出正確登錄、賬號錯誤登錄、密碼錯誤登錄等方法了

  • 不要在方法內加斷言
    對一個測試用例的執行結果進行判斷一定是在測試用例里的，方法只是提供給我們業務上需要的操作，因此斷言不要加在方法里，而是應該寫在用例里

  • 不要暴露頁面內部的元素給外部
    我們使用PO的目的就是為了提高測試用例的可讀性和可維護性，只要我們人能操作的事，通過page對象封裝好的客戶端都可以做到；就類似於一個介面，我們只關心請求操作後介面的返回值是什麼，而不需要關心介面內部到底是如何工作的

  • 不需要建模UI內的所有元素
    一個UI頁面可能會包含很多的元素，但是我們只要根據實際業務需求，將我們用的上的元素進行建模即可

  • 以頁面為單位獨立建模

  • 隱藏實現細節

  • 本質是面向介面編程

  • page ：完成對頁面的封裝

  • driver ：完成對Web、Android、Ios、介面的驅動

  • testcase ：調用各類page完成業務流程併進行斷言

  • data ：配置文件和數據驅動

  • utils ：其他便捷的功能封裝(可選)

1.3.3 PO的優點

  • 減少例如find click這類樣板代碼的重覆
  • 測試用例的可讀性提高，只關心業務流程
  • 測試用例可維護性提高，UI頁面頻繁被修改了，我們只需要去修改對應PO即可，用例無需修改

說的再多，不如動手，下麵以QQ郵箱登錄為例，演示PO模式在UI自動化中的應用

2.1 登錄場景預設
登錄頁面提供login功能——LoginPage類+login方法
登錄頁面內有多少元素並不關心，隱藏內部細節
登錄成功和失敗會返回不同的頁面
loginSuccess——MainPage(進入主頁面)
loginFail——LoginPage(停留在登錄頁)
通過方法返回值判斷登錄是否符合預期

1）創建基礎類BasePage，初始化driver，並封裝常用的元素操作方法，如click、sendKeys等

package poshow.page;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;

import java.util.List;

public class BasePage {

    public static WebDriver driver;


    public WebElement findElement(By by){
        return driver.findElement(by);
    }

    public List<WebElement> finElements(By by){
        return driver.findElements(by);
    }

    public void click(By by){
       findElement(by).click();
    }

    public void sendKeys(By by,String context){
        findElement(by).sendKeys(context);
    }

    public String getText(By by){
        return findElement(by).getText();
    }
}

2）創建MainPage類，用於登錄成功後的返回頁面，由於這裡並未演示登錄後的操作，所以類中無具體方法實現，僅作為loginSuccess後的返回對象

package poshow.page;

public class MainPage extends BasePage{
}

3）創建LoginPage類，繼承BasePage類。定義所需元素定位方式並根據操作動作（輸入賬號、輸入密碼、點擊登錄）將其封裝成具體的業務操作方法，例如登錄成功，用戶名錯誤登錄、密碼錯誤登錄等，輸入的測試數據作為方法的入參傳入(username,password)

package poshow.page;

import org.openqa.selenium.By;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

public class LoginPage extends BasePage{
    //定位器
    By usernameInput = By.name("u");  //獲取用戶名輸入框
    By passwordInput = By.id("p");    //獲取密碼輸入框
    By submitLogin = By.cssSelector("#login_button"); //獲取登錄按鈕
    By ErrM = By.id("err_m");  //獲取錯誤提示信息


    public void openUrl(){
        String url = "https://mail.qq.com/";
        driver = new ChromeDriver();
        driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
        driver.get(url);
        driver.manage().window().maximize();
        driver.switchTo().frame("login_frame");

    }

    private void sleepWait(){
        try {
            Thread.sleep(500);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
    }

    //業務方法

    /*
    登錄方法
     */
    private void login(String username,String password){
        findElement(usernameInput).clear();
        findElement(passwordInput).clear();
        sendKeys(usernameInput,username);
        sendKeys(passwordInput,password);
        click(submitLogin);
    }

    /*
      成功登錄
     */
    public MainPage loginSuccess(String username,String password){
        login(username,password);
        return new MainPage();
    }


    /*
     密碼錯誤登錄
     message:你輸入的帳號或密碼不正確，請重新輸入。
     */
    public String loginWithErrPassword(String username,String password ){
        login(username,password);
        sleepWait();
        return getText(ErrM);
    }

    /*
    賬號為空登錄
    你還沒有輸入帳號！
     */
    public String loginWithErrUsername(String username,String password){
        login(username,password);
        sleepWait();
        return getText(ErrM);

    }

    /*
    密碼為空登錄
     */
    public String loginWithoutPassword(String username,String password){
        login(username,password);
        sleepWait();
        return getText(ErrM);
    }
}

4）最後創建LoginTest測試類，編寫測試用例；用例的編寫更接近於人的行為，人想要登錄郵箱，只需要依靠用戶名和密碼完成登錄的行為即可，無需關註具體的輸入框和登錄按鈕是如何定位，如何進行輸入點擊的。併在用例中加入斷言進行判斷。

package poshow.testcase;

import org.junit.jupiter.api.*;
import poshow.page.LoginPage;
import static org.hamcrest.CoreMatchers.equalTo;
import static org.hamcrest.MatcherAssert.assertThat;

@TestMethodOrder(MethodOrderer.OrderAnnotation.class)
public class LoginTest {

    LoginPage loginPage = new LoginPage();

   @BeforeAll
   static void openUrl(){
        new LoginPage().openUrl();
    }

    @Test
    @DisplayName("密碼錯誤登錄")
    @Order(1)
    void loginWithErrPassword(){
        String username = "376057520";
        String password = "123456";
        String expectedErrM = "你輸入的帳號或密碼不正確，請重新輸入。";

        String errM = loginPage.loginWithErrPassword(username, password);
        assertThat(errM,equalTo(expectedErrM));
    }

    @Test
    @DisplayName("賬號錯誤登錄")
    @Order(2)
    void loginWithErrUsername(){
        String username = "111";
        String password = "123456";
        String expectedErrM = "請輸入正確的帳號！";

        String errM = loginPage.loginWithErrUsername(username, password);
        assertThat(errM,equalTo(expectedErrM));
    }

    @Test
    @DisplayName("空密碼登錄")
    @Order(3)
    void loginWithoutPassword(){
        String username = "376057520";
        String password = "";
        String expectedErrM = "你還沒有輸入密碼！";

        String errM = loginPage.loginWithoutPassword(username, password);
        assertThat(errM,equalTo(expectedErrM));
    }

    @Test
    @DisplayName("正確登錄")
    @Order(4)
    void logSuccess(){
       String username = "376057520";
       String password = "xxx";
       loginPage.loginSuccess(username,password);
    }

}

5）整體結構展示：

  • case儘量保持獨立
  • suite體系管理用例的順序
  • 不要把大量的業務校驗邏輯放到UI自動化測試里， UI主要校驗的是用戶交付，操作流程，樣式、數據、相容性。
  • 與介面測試合理的分工 #### 3.2 補充說明 以上僅僅是為了演示PO而舉的一個簡單的demo，實際上還有很大的優化空間：
  • 常用元素操作方法可以進一步封裝的更完善
  • 可封裝常用的操作util類，例如滑動
  • 特定元素的等待採用顯示等待
  • 登錄用例可以利用參數化來以數據驅動的方式完成，使用例代碼更簡潔易懂
  • PO代碼和testcase代碼可以分開，test下只放case代碼
    原文鏈接
更多技術文章
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 想學會SOLID原則，看這一篇文章就夠了！
    背景 在我們日常工作中，代碼寫著寫著就出現下列的一些臭味。但是還好我們有SOLID這把‘尺子’, 可以拿著它不斷去衡量我們寫的代碼，除去代碼臭味。這就是我們要學習SOLID原則的原因所在。 設計的臭味 僵化性 具有聯動性，動一處，會牽連到其他地方 脆弱性 不敢改動，動一處，全局癱瘓 頑固性 不易改動 ...
  • 戲說領域驅動設計（廿五）——領域事件
    SaaS賽道是一個超大賽道，足夠容納上萬家服務商，不太可能有哪個服務商能滿足所有場景，大部分SaaS服務商在某個垂直領域，提供差異化的產品和服務。SaaS產品大部分都是面向B端客戶，少部分面向C端客戶，本文主要講的B端SaaS產品。 B端SaaS產品的挑戰 B端SaaS產品為企業提供協同辦公的工具， ...
  • 設計模式七大原則—里氏替換原則
    1.基本介紹 裡斯科瓦（Barbara Liskov）使美國麻省理工學院電氣工程於電腦科學系資深教授，她是美國國家工程院院士，在程式語言、分散式計算、程式設計方法及軟體工程領域做出了卓越貢獻。裡斯科瓦於1987年提出了一個關於繼承的原則，也就是現在我們稱為的“里氏替換原則”。 里氏替換原則基於子類 ...
  • ShardingSphere 集成 CosId 實戰
    1.基本介紹 1.1.概念 高層模塊不能依賴於一個“具體化、細節化”的低層模塊，而是通過一個抽象的“規範/標準”建立兩者之間的依賴關係，簡言之就是：不依賴於實現，而是依賴於抽象。這裡“實現”一詞有的地方也稱為“細節”，在編碼中主要體現的是我們根據業務模型具體自定義的普通類，比如：員工類、商品類等。而 ...
  • 為什麼java代碼設計為不支持類多繼承
    package com.oop.demo05;//在java中所有的類都直接或者間接預設繼承object//人 父類public class Person { //public 公有的 //protected 受保護的 //default 預設的 //private 私有的 //private in ...
  • Java代碼中關鍵字static的功能簡介說明？
    Resources 類，顧名思義就是資源，用於讀取資源文件。其有很多方法通過載入並解析資源文件，返回不同類型的 IO 流對象 ...
  • 學習python之前，我們來看看它的辭彙~（零基礎知識分享）
    前言 在學習python的過程中，很多人會說，需要我的英語基礎特別好嘛？ 是不需要的，它所常用的單詞其實就那麼多，只要你用心和常去敲敲代碼，其實是非常容易的。 下麵我整理了一些python常用單詞，你可以看一看，希望對你帶來幫助~ 由於不太好打出來，我就用圖片來代替啦~ 好啦~就到這裡啦~辭彙還是很 ...
  • ReentrantLock學習
    ReentrantLock ReentrantLock功能 ReentrantLock和synchronized一樣是可重入的 可重入即當線程擁有了鎖時，當該線程再次請求鎖資源的時候，線程是可以再次成功獲得的。 static ReentrantLock lock = new ReentrantLoc ...
一周排行
    -Advertisement-
    Play Games
  • 如何基於surging跨網關跨語言進行緩存降級
    基於.NET Framework 4.8 開發的深度學習模型部署測試平臺，提供了YOLO框架的主流系列模型，包括YOLOv8~v9，以及其系列下的Det、Seg、Pose、Obb、Cls等應用場景，同時支持圖像與視頻檢測。模型部署引擎使用的是OpenVINO™、TensorRT、ONNX runti... ...
  • 十年沉澱，重啟開發之路
    十年沉澱，重啟開發之路 十年前，我沉浸在開發的海洋中，每日與代碼為伍，與演算法共舞。那時的我，滿懷激情，對技術的追求近乎狂熱。然而，隨著歲月的流逝，生活的忙碌逐漸占據了我的大部分時間，讓我無暇顧及技術的沉澱與積累。 十年間，我經歷了職業生涯的起伏和變遷。從初出茅廬的菜鳥到逐漸嶄露頭角的開發者，我見證了 ...
  • C#.NET體系圖文概述—2024最全總結
    C# 是一種簡單、現代、面向對象和類型安全的編程語言。.NET 是由 Microsoft 創建的開發平臺，平臺包含了語言規範、工具、運行，支持開發各種應用，如Web、移動、桌面等。.NET框架有多個實現，如.NET Framework、.NET Core（及後續的.NET 5+版本），以及社區版本M... ...
  • 班級擂臺（光榮）榜 - 極簡教育小工具
    前言 本文介紹瞭如何使用三菱提供的MX Component插件實現對三菱PLC軟元件數據的讀寫，記錄了使用電腦模擬，模擬PLC，直至完成測試的詳細流程，並重點介紹了在這個過程中的易錯點，供參考。 用到的軟體： 1. PLC開發編程環境GX Works2，GX Works2下載鏈接 https:// ...
  • web server apache tomcat11-31-websocket
    前言 整理這個官方翻譯的系列，原因是網上大部分的 tomcat 版本比較舊，此版本為 v11 最新的版本。 開源項目 從零手寫實現 tomcat minicat 別稱【嗅虎】心有猛虎，輕嗅薔薇。 系列文章 web server apache tomcat11-01-官方文檔入門介紹 web serv ...
  • day31-jQuery
    1、jQuery介紹 jQuery是什麼 jQuery是一個快速、簡潔的JavaScript框架，是繼Prototype之後又一個優秀的JavaScript代碼庫（或JavaScript框架）。jQuery設計的宗旨是“write Less，Do More”，即倡導寫更少的代碼，做更多的事情。它封裝 ...
  • aardio爬蟲) 實戰篇：逆向有道翻譯web介面
    前言 之前的文章把js引擎(aardio封裝庫) 微軟開源的js引擎(ChakraCore))寫好了，這篇文章整點js代碼來測一下bug。測試網站：https://fanyi.youdao.com/index.html#/ 逆向思路 逆向思路可以看有道翻譯js逆向（MD5加密，AES加密）附完整源碼 ...
  • 面試官：這就是你理解的Java多線程基礎？
    引言 現代的操作系統（Windows，Linux，Mac OS）等都可以同時打開多個軟體（任務），這些軟體在我們的感知上是同時運行的，例如我們可以一邊瀏覽網頁，一邊聽音樂。而CPU執行代碼同一時間只能執行一條，但即使我們的電腦是單核CPU也可以同時運行多個任務，如下圖所示，這是因為我們的 CPU 的 ...
  • Python文本統計與分析從基礎到進階
    掌握使用Python進行文本英文統計的基本方法，並瞭解如何進一步優化和擴展這些方法，以應對更複雜的文本分析任務。 ...
  • Redis多數據源，看這篇就夠了
    背景 Redis多數據源常見的場景： 分區數據處理：當數據量增長時，單個Redis實例可能無法處理所有的數據。通過使用多個Redis數據源，可以將數據分區存儲在不同的實例中，使得數據處理更加高效。 多租戶應用程式：對於多租戶應用程式，每個租戶可以擁有自己的Redis數據源，以確保數據隔離和安全性。 ...
所有分類