I. 05 ĐỐI TƯỢNG NỀN MÓNG PLAYWRIGHT

1. PLAYWRIGHT

• Playwright (Đối tượng gốc): Là điểm bắt đầu của mọi script. Nó chịu trách nhiệm giao tiếp với core của thư viện, quản lý các instance của các loại trình duyệt (Chromium, Firefox, WebKit) và các thiết bị di động mô phỏng.
  
  

• Hàm khởi tạo Playwright:

  • sync_playwright(): Khởi tạo Playwright ở chế độ đồng bộ. Dùng với with sync_playwright() as p:.

  • async_playwright(): Khởi tạo ở chế độ bất đồng bộ (cho hiệu suất cao hơn trong framework async). (Trong Playwright Python thường dùng sync_playwright(), trường hợp này được sử dụng trong hầu hết các kịch bản tự động hóa ở mức cơ bản)
    
    

• Khởi tạo cơ bản:
  

  playwright = sync_playwright().start() # KHỞI TẠO ĐỐI TƯỢNG PLAYWRIGHT
  # Đây là phương pháp khởi tạo thông qua start()
  # Với phương pháp này, chúng ta cần phải gọi hàm stop() để giải phóng tài nguyên sau khi kết thúc một session để tránh memory leak
  playwright.stop()

   

• Khởi tạo thông qua context manager kết hợp với từ khóa with...as...:
  

  # Đây là phương pháp khởi tạo thông qua context manager (kết hợp with)
  # Với phương pháp này, chúng ta không cần phải gọi hàm stop() để giải phóng tài nguyên
  with sync_playwright() as p:
      # các câu lệnh khởi tạo đối tượng khác sẽ ở đây

   

   

2. BROWSER TYPE

• BrowserType (Loại trình duyệt): Class đóng vai trò như một "bệ phóng" riêng cho từng loại trình duyệt. Bản thân các thuộc tính này chưa phải là một trình duyệt đang chạy, mà chúng chứa các phương thức để bạn cấu hình và khởi tạo trình duyệt đó. Tương ứng với 3 "cỗ máy" rendering engine độc lập mà Playwright hỗ trợ: Chromium, Firefox và WebKit.
  
  

• Khởi tạo Browser Type:

  • p.chromium: Khởi tạo cỗ máy trình duyệt Chromium.

  • p.firefox: Khởi tạo cỗ máy trình duyệt Firefox.

  • p.webkit: Khởi tạo cỗ máy trình duyệt WebKit.
    
    

• Khởi tạo cơ bản:
  

  playwright = sync_playwright().start() 
  
  chromium = playwright.chromium # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT CHROMIUM
  firefox = playwright.firefox   # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT FIREFOX
  webkit = playwright.webkit    # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT WEBKIT
  
  playwright.stop()

   

• Khởi tạo thông qua context manager kết hợp với từ khóa with...as...:
  

  with sync_playwright() as p:
      chromium = p.chromium  # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT CHROMIUM
      firefox = p.firefox    # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT FIREFOX
      webkit = p.webkit      # THÔNG QUA PLAYWRIGHT TẠO LOẠI TRÌNH DUYỆT WEBKIT

  
  

• Các thuộc tính và phương thức của BrowserType:

  • .launch(): Dùng để khởi chạy một instance của trình duyệt (phương thức này sẽ trả về kiểu Browser). Đây là phương thức được sử dụng phổ biến nhất.

  • .launch_persistent_context(): Khởi chạy trình duyệt kết hợp tạo một profile cố định (giúp lưu lại cookie, cache, trạng thái đăng nhập).

  • .name: Thuộc tính trả về tên của trình duyệt dưới dạng string (ví dụ: "chromium", "firefox", hoặc "webkit").

3. BROWSER

• Browser (Trình duyệt): Là một tiến trình (process) thực sự của trình duyệt được khởi chạy. Việc khởi động một tiến trình Browser thường tiêu tốn khá nhiều tài nguyên hệ thống (CPU, RAM) và mất thời gian (khoảng vài giây).
  
  

• Hàm khởi tạo Browser bằng phương thức launch() của BrowserType:

  chromium = playwright.chromium.launch() # Khởi chạy tiến trình trình duyệt Chromium
  firefox = playwright.firefox.launch()   # Khởi chạy tiến trình trình duyệt Firefox
  webkit = playwright.webkit.launch()    # Khởi chạy tiến trình trình duyệt WebKit

• Tham số hay dùng cho hàm launch() của BrowserType để khởi tạo Browser:

  • headless (bool): Mặc định là True (chạy ngầm không giao diện). Đặt False để nhìn thấy trình duyệt chạy (rất hữu ích khi debug).

  • args (list): Truyền các flags command-line trực tiếp vào trình duyệt (ví dụ: ['--start-maximized']).
    
    

LƯU Ý

• Hàm launch() của BrowserType là hàm khởi tạo một tiến trình thực sự của trình duyệt, do đó là hàm tốn nhiều tài nguyên nhất trong Playwright, cần sử dụng một cách hợp lý.

• Thông thường sẽ chỉ khởi tạo 1 lần duy nhất và để đơn giản cho các dòng code chúng ta sẽ sử dụng các câu lệnh trên để khởi tạo luôn Browser mà không phải thông qua bước khởi tạo BrowserType.

4. BROWSER CONTEXT

• Browser Context (Ngữ cảnh trình duyệt): Đây là "vũ khí bí mật" của Playwright. Một Context là một phiên làm việc (session) hoàn toàn cô lập (isolated) nằm bên trong một Browser. Nó giống như chế độ Ẩn danh (Incognito) độc lập. Mỗi Context không chia sẻ Cookies, Local Storage hay Cache với các Context khác. Điểm tuyệt vời là việc tạo ra một Context chỉ mất vài mili-giây và tốn cực kỳ ít tài nguyên.
  
  

• Hàm khởi tạo Browser Context bằng phương thức new_context() của Browser:

  context = browser.new_context()

• Tham số hay dùng cho hàm new_context() của Browser:

  • viewport (dict): Giả lập kích thước màn hình thiết bị. Ví dụ: {'width': 1920, 'height': 1080}.
    
    

Đây chính xác là một điểm "ăn tiền" của Playwright so với Selenium

• Nỗi đau của Selenium: Hãy tưởng tượng bạn có 4 Test Suite chạy song song trên 4 Worker, mỗi Suite có 5 test case cần môi trường "sạch" hoàn toàn. Với Selenium, cứ mỗi test case chạy xong, hệ thống lại phải tắt đi và bật lại một trình duyệt mới để xóa sạch cookie/cache. Kết quả là trong suốt quá trình, Selenium phải khởi tạo và đóng trình duyệt vật lý liên tục tới 20 lần. Việc "vắt kiệt" CPU để spawn/kill tiến trình hệ điều hành liên tục như vậy khiến máy test cực kỳ lag và tốn thời gian chờ đợi.

• Sự ưu việt của Playwright Context: Playwright xử lý bài toán Test Suite này mượt mà hơn hẳn! Khi chia 4 Test Suite cho 4 Worker, Playwright chỉ bật đúng 4 trình duyệt từ đầu đến cuối. Khi các test case trong Suite chạy, nó không tắt trình duyệt mà chỉ khởi tạo các Browser Context độc lập rồi đóng lại trong vài mili-giây (giống như bật/tắt tab ẩn danh). Bạn vẫn có 20 môi trường sạch tuyệt đối cho 20 test case, nhưng hệ điều hành chỉ cần mở trình duyệt đúng 4 lần. Nhờ vậy, tốc độ test được đẩy lên tối đa và tài nguyên máy tính được tối ưu triệt để.

5. PAGE

• Page (Trang): Tương đương với một Tab hoặc một cửa sổ Popup hiển thị bên trong một Browser Context. Đây là nơi chứa cấu trúc DOM của trang web và là đối tượng mà chúng ta thường sẽ dùng để điều hướng trang web, định vị các element trên trang web để tương tác trên UI
  
  

• Hàm khởi tạo Page thông qua Browser Context:

  context = browser.new_context()
  page = context.new_page() # Khởi tạo một Page mới trong Context.
  page.goto("https://www.google.com") # Điều hướng đến một trang web.

   

TÓM TẮT MÔ HÌNH

• Playwright quản lý các Browser Type (cụ thể là 3 loại: chromium, firefox, webkit)

• Mỗi một BrowserType sẽ khởi tạo ra một Browser.

• Mỗi một Browser có thể sẽ khởi tạo ra nhiều Browser Context độc lập với nhau.

• Mỗi một Browser Context lại có thể chứa nhiều Page (Tabs).

II. GIAO THỨC DEVTOOL PROTOCOL CỦA PLAYWRIGHT

• Với framework "thế hệ trước" như Selenium, việc chạy thông qua WebDrvier nó giống như gửi thư bưu điện. Bạn gửi thư (HTTP Request) cho ông Bưu tá (WebDriver), ông bưu tá chạy đến nhà Trình duyệt đưa thư, đợi trình duyệt trả lời rồi lại cầm thư chạy về đưa cho bạn. (Chậm, mất thời gian, dễ thất lạc).
  
  

• Với Playwright thì khác, nó sử dụng giao thức DevTool (DevTool Protocol) giống như gọi cuộc gọi Video/Livestream. Hai bên nhìn thấy nhau trực tiếp qua camera (WebSocket). Bạn hô "Click" là bên kia bấm luôn, bên kia bị giật lag là bạn nhìn thấy ngay lập tức để xử lý. Đây là một điểm cực kỳ vượt trội của Playwright so với Selenium.
  
  

• Cụ thể chuyện gì đã diễn ra đằng sau những gì mà bạn nhìn thấy khi Playwright thực thi script automation test nhỉ??

  • Trình duyệt lúc này sẽ đóng vai trò là một Streamer để show toàn bộ sự kiện diễn ra bên trong nó (Ví dụ như: DOM thay đổi thế nào, mạng có request và response ra làm sao, console có trả về lỗi gì không)

  • Khi bạn là tra một script automation test để máy tính thực thi, lúc này Playwright đóng vai trò là một người đang xem Livestream từ phía trình duyệt. Và Playwright lúc này thực sự là một người xem rất quyền lực, nó vừa xem, vừa có quyền ra lệnh cho trình duyệt phải làm gì.
    
    

Từ những điều trên, chúng ta đã thấy được sự ưu việt của việc Playwright và trình duyệt tương tác với nhau khi thực thi script automation test là như thế nào. Nó đi theo 02 "triết lý":

1. Tương tác thời gian thực (Real-time): Playwright (Người xem) và Trình duyệt (Streamer) kết nối với nhau qua một đường truyền trực tiếp (Websocket Protocol). Khi Streamer nói, người xem nghe thấy ngay lập tức. Khi người xem gõ bình luận (ra lệnh), Streamer thấy và phản hồi lại ngay.

2. Không có người trung gian: Không có ai đứng ở giữa nhận tin nhắn chat của bạn, dịch lại rồi mới đưa cho Streamer.