Chạy ẩn Browser trong Selenium (headless browser)

Anh Tester chỉ các bạn chạy ẩn trình duyệt trong automation test với Selenium. Được biết đến rộng rãi hơn với cái tên quốc tế khá là trừu tượng giống như sự hiện diện của nó headless browser, còn trong Tiếng Việt mình nói nôm na là trình duyệt không đầu nhe =))

Thôi cùng xơi nó nào !!!

1. Headless Browsers trong Selenium Webdriver

Headless browser là chương trình giả lập một trình duyệt nhưng không có giao diện người dùng (UI less).

Cơ chế hoạt động của Headless browser tương tự như các trình duyệt thông thường khác, chỉ có điều là nó sẽ không xuất hiện hay hiển thị bất kì giao diện tương tác người dùng nào. Do đó, Selenium sẽ thực thi việc test với trình duyệt này ở chế độ nền (background).

Hiện nay có nhiều loại Headless browser như:

Chrome
Firefox
HTMLUnit driver
PhantomJS
SlimerJS
TrifleJS

2. Headless testing là gì?

Việc thực hiện kiểm thử giao diện của ứng dụng web mà không cần mở ứng dụng trên giao diện người dùng của trình duyệt thì được gọi là headless testing.

Một headless browser hoạt động giống như một trình duyệt web thông thường. Các tester có thể toàn quyền điều khiển các trang web được tải trên headless browser. Chỉ có một điều khác biệt là khi đó bạn sẽ không thể nhìn thấy bấy kì một giao diện đồ họa người dùng nào giống như kiểu bạn đang đi trong đêm tối hoàn toàn không có ánh sáng nhưng mà bạn vẫn có thể đi những bước đi chính xác qua những đoạn cong queo, ngoằn nghoèo để đến được đích =))

3. Khi nào thì sử dụng headless browser testing?

Ta có thể sử dụng headless testing sau khi đã hoàn thành việc kiểm thử trên các trình duyệt thông thường khác và khi cần thực hiện việc kiểm thử hồi quy trong các phiên bản phát hành hoặc phát triển tích hợp liên tục sau đó (CI/CD trên Cloud).

Hoặc trong trường hợp máy test của bạn không thể cài đặt hay sử dụng trình duyệt GUI, thì headless browser testing có lẽ là lựa chọn ổn hơn cả. Ví dụ khi test trên Unix chẳng hạn.

Bạn cũng nên sử dụng headless browser testing khi thực thi song song nhiều test cùng lúc, lúc này với các trình duyệt giao diện sẽ tiêu tốn nhiều bộ nhớ và tài nguyên. Headless browser testing có thể được sử dụng để kiểm tra hiệu năng của server (máy chủ).

Headless browser cũng có thể sử dụng khi bạn thực hiện smoke test ngay khi được bàn giao phiên bản mới, sẽ nhanh chóng kiểm tra và từ chối bàn giao nếu phát hiện vấn đề.

4. Một số nhược điểm của Headless Browser testing

Nhìn chung, headless browser không phải là một ý tưởng thực sự tốt. Nó có thể thực hiện các công việc tương tự nhưng một điều quan trọng là nó không mang được sự trực quan giống như một người dùng thực sự sẽ nhìn thấy và tương tác. Headless browser có thể che dấu những vấn đề mà chỉ khi sử dụng những trình duyệt thông thường bạn mới gặp phải.

Với headless browser sẽ khó debug để xác định các phần tử có vấn đề do page load quá nhanh.

Với trình duyệt thông thường, các chức năng được thực thi hoạt động ngay trước mắt, do đó ta có thể dễ dàng tương tác và phán hiện các điểm sai sót, cũng sẽ dễ dàng debug hơn nếu như có một vấn đề nào đó xảy ra.

Các mã code cho các headless browser không đảm bảo sẽ hoạt động bình thường khi chúng ta chuyển từ một headless browser nào đó sang HTMLUnit, ví dụ như bạn code cho Headless Chrome hay Firefox, và sau đó lại muốn thay đổi để code chạy cho Headless HTMLUnit, việc này đôi khi có thể làm cho code của chúng ta hoạt động không đúng nữa, nên hoặc là bạn không chuyển nữa hoặc là ngồi sửa code những đoạn nào không tương thích . Tuy nhiên giữa Chrome và Firefox thì lại khá là tương đồng, nên sẽ dễ dàng hơn nhiều nếu muốn nhảy từ cái này sang cái kia.

Tương tác trên Headless browser không thể đại diện cho một người dùng thật sự, vì chẳng người dùng nào lại có thể tương tác các tác vụ mà không nhìn thấy bất cứ một giao diện hay hình ảnh nào cả, và vì vậy ta sẽ không thể phát hiện ra vấn đề nếu như vấn đề đó liên quan đến các hình ảnh trên ứng dụng.

Trên thực tế headless brower không nhanh hơn trình duyệt thực, bởi vì phần lớn thời gian vẫn để tải dữ liệu phụ thuộc vào tốc độ mạng, htlm, Javascript, hình ảnh và CSS. Headless browser chỉ không cần tải màu cho màn hình mà thôi.

Việc quản lý và chụp ảnh màn hình khá là khó đối với Headless browser.

5. Headless Browser trong Selenium Java

Chúng ta có thể thực hiện automation với headless browser, và chỉ có automation mới có thể thực thi được trên headless browser.

Đối với vai trò của một người dùng, họ sẽ chẳng quan tâm và cũng không có khái niệm nào về Headless browser hay UI less browser. Vì với những khái niệm này trên thực tế rõ ràng là không thể trông thấy hay tương tác trực tiếp được.

Trên headless browser, có thể thực thi các test mà được tạo ra dựa trên việc thực hiện trên các trình duyệt UI thông thường, do đó việc debug cũng chỉ có thể thực hiện trên trình duyệt UI thông thường mà thôi.

Trong bài viết này chúng ta sẽ đi qua các Headless browser đó là:

Chrome
Firefox

5.1. Headless Chrome browser in Selenium Java

Các bước để tạo headless Chrome:

1. Set path cho Chrome driver server sử dụng System.setProperty:

System.setProperty("webdriver.chrome.driver", "resources\drivers\chromedriver.exe");

2. Tạo một đối tượng cho ChromeOptions thuộc package: org.openqa.selenium.chrome.ChromeOptions

ChromeOptions options = new ChromeOptions();

3. Tạo một method setHeadless từ đối tượng ChromeOptions, đặt paramenter = true. Medthod này sẽ tạo ra một trình duyệt chrome mà không có giao diện người dùng, chính là cái headless Chrome browser mà ta cần:

// set chrome as Headless
options.setHeadless(true);

Ta cũng có thể sử dụng method addArguments có sẵn trong đối tượng ChromeOption để tạo một headless chrome browser, ở đây ta cần thêm giá trị của parameter là "--headless" để khởi tạo trình duyệt không có UI với cú pháp như sau:

options.addArguments("--headless");

4. Bây giờ bạn sẽ tạo một đối tượng cho ChromeDriver và đừng quên truyền vào đó option vừa tạo bên trên vào hàm khởi tạo ChromDirver.

WebDriver driver = new ChromeDriver(options);

Code nào:

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;

public class HeadlessChromeTesting
{
	public static void main(String[] args) {
		//set the driver server exe path
		System.setProperty("webdriver.chrome.driver", "\resources\drivers\chromedriver.exe");
		ChromeOptions options = new ChromeOptions();
		// set chrome as Headless
		options.setHeadless(true);
        //Hoặc này
        //options.addArguments("--headless");

		//Khởi tạo Chrome Driver với options trên
		WebDriver driver = new ChromeDriver(options);
		driver.get("https://anhtester.com");
		// get the title of the page
		System.out.println("Page title is - " + driver.getTitle());
		// get the title of the url
		System.out.println("Current Url : "+ driver.getCurrentUrl());
		
		// close the browser
		driver.quit();
  }
}

5.2. Headless Firefox browser in Selenium Java

Với Headless Firefox browser ta cũng thực hiện các tương tự các bước như khởi tạo một headless Chrome browser tóm tắt nhanh các cú pháp như sau:

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxOptions;

public class HeadlessFirefoxTesting
{
	public static void main(String[] args) {
		//set the driver server exe path
		System.setProperty("webdriver.gecko.driver", "\resources\drivers\geckodriver.exe");
		FirefoxOptions options = new FirefoxOptions();
		// set chrome as Headless
		options.setHeadless(true);
        //Hoặc này
        //options.addArguments("--headless");

		//Khởi tạo Chrome Driver với options trên
		WebDriver driver = new FirefoxDriver(options);
		driver.get("https://anhtester.com");
		// get the title of the page
		System.out.println("Page title is - " + driver.getTitle());
		// get the title of the url
		System.out.println("Current Url : "+ driver.getCurrentUrl());
		
		// close the browser
		driver.quit();
  }
}

Với chế độ trình duyệt headless thì giá trị --headless được dùng kể từ phiên bản 96, Chrome có chế độ không đầu mới cho phép người dùng nhận được đầy đủ chức năng của trình duyệt (thậm chí chạy các tiện ích mở rộng). Giữa các phiên bản 96 đến 108 --headless=chrome.

Nhưng từ sau phiên bản 109 thì giá trị thay đổi thành --headless=new.

Dùng --headless=new chắc mang lại trải nghiệm tốt hơn khi dùng headless với Selenium. Áp dụng cho tất cả các ngôn ngữ lập trình.

Trước v109:

ChromeOptions options = new ChromeOptions();
options.setHeadless(true);
WebDriver driver = new ChromeDriver(options);
driver.get("https://selenium.dev");
driver.quit(); 

Sau v109:

ChromeOptions options = new ChromeOptions();
options.addArguments("--headless=new");
WebDriver driver = new ChromeDriver(options);
driver.get("https://selenium.dev");
driver.quit(); 

6. Headless Browser trong Selenium C#

Nó khá đơn giản để chạy các bài kiểm tra của bạn ở chế độ không đầu. Bạn chỉ cần thêm đối số "headless" vào đối tượng ChromeOptions tương tự như Selenium Java bên trên.

IWebDriver driver;
var chromeOptions = new ChromeOptions();
chromeOptions.AddArgument("headless");
//driver = new ChromeDriver(chromeOptions);
driver = new ChromeDriver("D:\\TESTER\\SeleniumC#", chromeOptions);

Hoặc bạn có thể dùng cách này để chấp nhận nó hiện icon chrome nhưng nó sẽ không mở màn hình browser lên

ChromeDriverService service = ChromeDriverService.CreateDefaultService();
service.HideCommandPromptWindow = true;

var options = new ChromeOptions();
options.AddArgument("--window-position=-32000,-32000");

var driver = new ChromeDriver(service, options);

Lưu ý: từ sau phiên bản 109 thì giá trị thay đổi thành --headless=new

Dùng --headless=new chắc mang lại trải nghiệm tốt hơn khi dùng headless với Selenium. Áp dụng cho tất cả các ngôn ngữ lập trình.

7. Dùng Headless browser nào nhanh hơn?

Để trả lời câu hỏi này không gì chính xác hơn là chính bạn tự kiểm chứng với môi trường thực thế của bạn. Và lựa chọn trình duyệt nào cho dự án của bạn, theo quan điểm của mình thì trước tiên cần cân nhắc đó là sự ổn định của công cụ sau đó mới đến các yếu tố khác như tốc độ hay các khả năng khác, tuy nhiên với độ phổ biến rộng rãi thì mình nghĩ rằng Chrome hay Firefox sẽ là những lựa chọn nên được ưu tiên.

Hi vọng bài viết này sẽ mang lại chút hữu ích cho các bạn về Headless browser và cách sử dụng nó trong automation với Selenium. Rất mong nhận được những đóng góp và góp ý của các bạn về chủ đề này.

==> Tìm hiểu thêm: Khởi chạy các loại trình duyệt trong Selenium