[Java for Tester] Bài 16 - Mô hình Page Object Model

✅ Mô hình Page Object Model trong Test Automation

🔆 Sơ lược về Page ObjectModel - POM

• OOP (Object-Oriented Programming) là hướng đối tượng, nhìn tất cả mọi vật là Object – đối tượng. Đối tượng được định nghĩa trong các class có các thuộc tính và các hành động khác nhau. Cụ thể các bạn có thể hiểu là biến và hàm.
• POM (Page Object Model) là một design pattern (mẫu thiết kế) sử dụng tính chất OOP để áp dụng vào trong Test Automation giúp mô hình hóa các pages, hoặc các phần (component: header, footer, menu…) trong page của trang web thành mỗi đối tượng riêng biệt. Mỗi component / page sẽ gói gọn tất cả các hành động và các thuộc tính của component / page đó.

Khi triển khai các Pages trên website vào trong code thì nó tương ứng là các Class, hay gọi là Page Class, để khai báo tất cả các object trên trang web đó vào trong 1 class tương ứung với 1 trang.

🔆 Ưu điểm của mô hình Page Object (đối tượng trang)

• Giúp bảo trì dễ dàng: POM hữu ích khi có sự thay đổi trong phần tử giao diện người dùng hoặc có sự thay đổi trong một hành động. Ví dụ: một menu thả xuống được thay đổi thành một nút radio. Trong trường hợp này, POM giúp xác định trang hoặc màn hình cần sửa đổi. Vì mọi màn hình sẽ có các tệp java khác nhau, nên việc xác định này là cần thiết để thực hiện các thay đổi bắt buộc đối với các tệp đó. Điều này làm cho các trường hợp kiểm thử dễ bảo trì và giảm lỗi.
  
  
• Giúp sử dụng lại mã (dùng lại code đã viết): Như đã thảo luận, tất cả các màn hình đều độc lập. Bằng cách sử dụng POM, người ta có thể sử dụng mã thử nghiệm cho một màn hình và sử dụng lại nó trong một trường hợp thử nghiệm khác. Không cần phải viết lại mã, do đó tiết kiệm thời gian và công sức.
  
  
• Dễ đọc code: Khi tất cả các màn hình có các tệp java độc lập, người ta có thể dễ dàng xác định các hành động sẽ được thực hiện trên một màn hình cụ thể bằng cách điều hướng qua tệp java đó thôi. Nếu một thay đổi ảnh hưởng đến một phần mã code nhất định thì nó có thể được thực hiện một cách hiệu quả mà không ảnh hưởng đến các tệp (class/package) khác.
  
  
• Tạo kho lưu trữ: Có thể một kho lưu trữ duy nhất cho các xử lý chung hoặc hoạt động chung cho các trang thay vì có các xử lý này nằm rải rác trong các test case riêng lẻ. VD: getTitlePage(), verifyHeaderPage(),...

✅ Ví dụ triển khai mô hình Page Object Model (POM)

Bước 1: tạo 2 package để chứa các class Page và các class Test phân biệt

Trong ví dụ thì An lấy tên pages và testcases nhé.




Bước 2: tạo các class Page xử lý cho từng trang

Trong ví dụ thì An xử lý cho trang Login nên lấy tên LoginPage nhé.

Website: https://crm.anhtester.com/admin/authentication





Nội dung class LoginPage:

package Bai16_DesignPattern.PageObjectModel.pages;

public class LoginPage {

    //Khai báo các biến giá trị dành riêng cho trang Login (từng page class)
    private String URL = "https://crm.anhtester.com/admin/authentication";

    //Khai báo hàm xây dựng để truyền tham số vào cho từng page class
    public LoginPage() {
        //Truyền tham số gì đó
        //Cụ thể trong Test Automation là một driver để điều khiển browser
    }

    //Khai báo các đối tượng element trên website
    //Trong ví dụ mình dùng kiểu String thay vì WebElement nhé
    private String inputEmail = "//input[@id='email']";
    private String inputPassword = "//input[@id='password']";
    private String buttonLogin = "//button[normalize-space()='Login']";

    //Khai báo các hàm xử lý cho riêng trang Login này
    public void setEmail(String email) {
        System.out.println("Điền giá trị email: " + email);
        System.out.println("Đối tượng email: " + inputEmail);
    }

    public void setPassword(String password) {
        System.out.println("Điền giá trị password: " + password);
        System.out.println("Đối tượng password: " + inputPassword);
    }

    public void clickLoginButton() {
        System.out.println("Click nút Login button: " + buttonLogin);
    }

    public void loginCRM(String email, String password) {
        System.out.println("Đi đến trang web: " + URL);
        setEmail(email);
        setPassword(password);
        clickLoginButton();
    }

    public void verifyLoginSuccess(){
        System.out.println("Verify login success.");
    }

    public void verifyLoginFail(){
        System.out.println("Verify login fail.");
    }

}

Bước 3: tạo các class Test khai báo test cases cho từng trang

Trong ví dụ trên thì An đang xử lý cho trang Login nên lấy tên LoginTest nhé.



Nội dung class LoginTest:

package Bai16_DesignPattern.PageObjectModel.testcases;

import Bai16_DesignPattern.PageObjectModel.pages.LoginPage;

public class LoginTest {

    //Khai báo đối tượng từng class page cần thiết để dùng cho class test cases
    LoginPage loginPage;

    public void testLoginSuccess(){
        loginPage = new LoginPage();
        System.out.println("*****TEST CASE LOGIN SUCCESS*****");
        //Truyền giá trị email và password đúng
        loginPage.loginCRM("admin@example.com", "123456");
        loginPage.verifyLoginSuccess();
    }

    public void testLoginWithEmailInvalid(){
        loginPage = new LoginPage();
        System.out.println("*****TEST CASE LOGIN FAIL*****");
        //Truyền giá trị email sai
        loginPage.loginCRM("admin123@example.com", "123456");
        loginPage.verifyLoginFail();
    }

    public static void main(String[] args) {
        LoginTest loginTest = new LoginTest();

        loginTest.testLoginSuccess();
        System.out.println("===========================");
        loginTest.testLoginWithEmailInvalid();
    }

}

Các bạn thấy là An đã vận dụng kiến thức của Object Class để tiến hành triển khai gọi class LoginPage sang class LoginTest.

Trong ví dụ thì mình chạy hàm "main". Nhưng trong thực tế thì mình không có dùng hàm main nữa, mà sẽ dùng thư viện hỗ trợ chạy test như TestNG Framework hoặc JUnit Framework.

🔆 Kết quả sau khi chạy:

*****TEST CASE LOGIN SUCCESS*****
Đi đến trang web: https://crm.anhtester.com/admin/authentication
Điền giá trị email: admin@example.com
Đối tượng email: //input[@id='email']
Điền giá trị password: 123456
Đối tượng password: //input[@id='password']
Click nút Login button: //button[normalize-space()='Login']
Verify login success.
===========================
*****TEST CASE LOGIN FAIL*****
Đi đến trang web: https://crm.anhtester.com/admin/authentication
Điền giá trị email: admin123@example.com
Đối tượng email: //input[@id='email']
Điền giá trị password: 123456
Đối tượng password: //input[@id='password']
Click nút Login button: //button[normalize-space()='Login']
Verify login fail.

Trong Test Automation thì chúng ta đặc biệt quan tâm chuyện khởi tạo Browser hoặc Mobile device. Nên thường mình cần khai báo một class tên là BaseTest để nó khởi tạo trước khi chạy test cases.

Ví dụ An áp dụng kiến thức Kế thừa trong Java để khai báo và sử dụng class BaseTest như sau.

✳️ Vận dụng tính Kế thừa vào Test Automation

Đầu tiên khai báo class BaseTest:



Trong khai báo trên thì các bạn có thể hiểu là An đang khai báo loại Browser cần chạy cho test case, cụ thể là CHROME. Hoặc đổi tên giá trị trình duyệt nào đó tuỳ ý.

Sau đó khai báo 2 hàm để khởi tạo và đóng trình duyệt.

Nội dung code mẫu trong class BaseTest:

package Bai16_DesignPattern.PageObjectModel.common;

public class BaseTest {

    private String browser = "CHROME";

    public void createDriver() {
        System.out.println("Mở trình duyệt: " + browser);
    }

    public void closeDriver() {
        System.out.println("Đóng trình duyệt: " + browser);
    }
}

Tiếp theo, ở class LoginTest hoặc class test nào đó bất kỳ chúng ta kế thừa lại class BaseTest để gọi hàm sử dụng trực tiếp.



Chổ này trong thực tế thì các Test Automation Framework như TestNG thì nó có các Annotations (ghi chú) khai báo cho tự chạy chứ không cần gọi cụ thể cho từng test cases.

🔆 Kết quả sau khi chạy:

*****TEST CASE LOGIN SUCCESS*****
Mở trình duyệt: CHROME
Đi đến trang web: https://crm.anhtester.com/admin/authentication
Điền giá trị email: admin@example.com
Đối tượng email: //input[@id='email']
Điền giá trị password: 123456
Đối tượng password: //input[@id='password']
Click nút Login button: //button[normalize-space()='Login']
Verify login success.
Đóng trình duyệt: CHROME
===========================
*****TEST CASE LOGIN FAIL*****
Mở trình duyệt: CHROME
Đi đến trang web: https://crm.anhtester.com/admin/authentication
Điền giá trị email: admin123@example.com
Đối tượng email: //input[@id='email']
Điền giá trị password: 123456
Đối tượng password: //input[@id='password']
Click nút Login button: //button[normalize-space()='Login']
Verify login fail.
Đóng trình duyệt: CHROME