Kiểm tra trình duyệt chéo bằng cách sử dụng Selenium webdriver

Tại sao chúng ta cần Kiểm tra trình duyệt chéo?

Các ứng dụng web rất khác so với các ứng dụng máy tính để bàn truyền thống. Người dùng cuối có thể mở một ứng dụng web trong bất kỳ trình duyệt nào. Ví dụ, một số người thích mở ứng dụng web trên trình duyệt khác nhau. https://twitter.com in Firefox, trong khi những người khác sử dụng cơ rôm, Safari, hoặc là Microsoft Edge.

Trong sơ đồ bên dưới, bạn có thể thấy rằng ở các trình duyệt cũ hơn, hộp đăng nhập của Twitter không hiển thị các góc bo tròn một cách chính xác, trong khi Chrome hiện đại hiển thị các góc đúng như thiết kế.

Vì vậy, chúng ta cần đảm bảo rằng ứng dụng web hoạt động như mong đợi trên tất cả các trình duyệt phổ biến, để nhiều người hơn có thể truy cập và sử dụng nó.

Mục tiêu này có thể được đáp ứng bằng cách sử dụng trình duyệt chéo. Kiểm tra của sản phẩm trên mọi trình duyệt nằm trong phạm vi áp dụng.

Nguyên nhân gây ra sự cố tương thích trình duyệt

1. Kích thước phông chữ không khớp trong các trình duyệt khác nhau.
2. JavaViệc triển khai công cụ kịch bản khác nhau giữa các phiên bản Chrome (V8). Firefox (Khỉ nhện), Safari (JavaScriptCore), và Edge.
3. Sự khác biệt về xác thực CSS và HTML, bao gồm cả việc xử lý tiền tố của nhà cung cấp.
4. Hỗ trợ tính năng HTML5 và ECMAScript không nhất quán hoặc không đầy đủ ở các phiên bản trình duyệt cũ hơn.
5. Căn chỉnh trang, kích thước thẻ div và các biến thể hiển thị bằng flexbox hoặc lưới.
6. Sự khác biệt về hướng ảnh và cấu hình màu sắc.
7. Sự không tương thích giữa trình duyệt và hệ điều hành cơ bản, bao gồm cả những trục trặc của WebView trên thiết bị di động. Android và iOS.

Cách thực hiện kiểm tra trình duyệt chéo

Nếu chúng tôi đang sử dụng Selenium Với WebDriver, chúng ta có thể tự động hóa các trường hợp kiểm thử trên Chrome. Firefox, Microsoft Edgevà trình duyệt Safari.

Để thực hiện các trường hợp kiểm thử với các trình duyệt khác nhau trên cùng một máy tính cùng một lúc, chúng ta có thể tích hợp... TestNG khuôn khổ với Selenium WebDriver. Để có phạm vi phủ sóng hệ điều hành và phiên bản rộng hơn, bộ công cụ tương tự có thể được trỏ đến các nền tảng điện toán đám mây như Sauce Labs, BrowserStack hoặc LambdaTest thông qua một điểm cuối WebDriver từ xa.

Tệp testing.xml của bạn sẽ trông như thế này:

Tệp test.xml này sẽ ánh xạ với Trường hợp thử nghiệm Nó trông như thế này:

Vì tệp testing.xml có nhiều thẻ Test ('ChromeTest', 'FirefoxTrường hợp kiểm thử này sẽ được thực thi một lần cho mỗi trình duyệt, ví dụ như 'Test', 'EdgeTest'.

Bài kiểm tra đầu tiên 'ChromeTest' sẽ truyền giá trị của tham số 'browser' là 'chrome', do đó ChromeDriver sẽ được thực thi. Trường hợp kiểm thử này sẽ chạy trên trình duyệt Chrome.

Bài kiểm tra thứ hai 'FirefoxTest' sẽ chuyển giá trị của tham số 'trình duyệt' dưới dạng 'Firefox', Vì thế FirefoxTrình điều khiển sẽ được thực thi. Trường hợp kiểm thử này sẽ chạy trên... Firefox Trình duyệt. Việc thêm bài kiểm tra Edge hoặc Safari cũng tuân theo cùng một quy trình.

Guru99CrossBrowserScript.java

Hoàn thành Code:

package parallelTest;

import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.edge.EdgeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.safari.SafariDriver;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Parameters;
import org.testng.annotations.Test;

public class CrossBrowserScript {

	WebDriver driver;

	/**
	 * This function will execute before each Test tag in testng.xml
	 * @param browser
	 * @throws Exception
	 */
	@BeforeTest
	@Parameters("browser")
	public void setup(String browser) throws Exception{
		//Check if parameter passed from TestNG is 'firefox'
		if(browser.equalsIgnoreCase("firefox")){
		//create firefox instance
			System.setProperty("webdriver.gecko.driver", ".\\geckodriver.exe");
			driver = new FirefoxDriver();
		}
		//Check if parameter passed as 'chrome'
		else if(browser.equalsIgnoreCase("chrome")){
			//set path to chromedriver.exe
			System.setProperty("webdriver.chrome.driver",".\\chromedriver.exe");
			//create chrome instance
			driver = new ChromeDriver();
		}
		//Check if parameter passed as 'Edge'
		else if(browser.equalsIgnoreCase("Edge")){
			//set path to msedgedriver.exe
			System.setProperty("webdriver.edge.driver",".\\msedgedriver.exe");
			//create Edge instance
			driver = new EdgeDriver();
		}
		//Check if parameter passed as 'Safari'
		else if(browser.equalsIgnoreCase("Safari")){
			//SafariDriver ships with macOS, no driver path needed
			driver = new SafariDriver();
		}
		else{
			//If no browser passed throw exception
			throw new Exception("Browser is not correct");
		}
		driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	}

	@Test
	public void testParameterWithXML() throws InterruptedException{
		driver.get("https://demo.guru99.com/V4/");
		//Find user name
		WebElement userName = driver.findElement(By.name("uid"));
		//Fill user name
		userName.sendKeys("guru99");
		//Find password
		WebElement password = driver.findElement(By.name("password"));
		//Fill password
		password.sendKeys("guru99");
	}
}

thử nghiệm.xml

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">

<suite name="TestSuite" thread-count="3" parallel="tests" >

<test name="ChromeTest">

<parameter name="browser" value="Chrome" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

<test name="FirefoxTest">

<parameter name="browser" value="Firefox" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

<test name="EdgeTest">

<parameter name="browser" value="Edge" />

<classes>

<class name="parallelTest.CrossBrowserScript">

</class>

</classes>

</test>

</suite>

LƯU Ý: Để chạy thử nghiệm, hãy nhấp chuột phải vào thử nghiệm.xml, chọn Chạy với quyền quản trị, rồi nhấp chuột TestNG Thượng hạng.

Mở rộng quy mô với Cloud Browser Grids

Chạy Selenium WebDriver hỗ trợ cục bộ hai hoặc ba trình duyệt, nhưng người dùng thực tế truy cập các trang web từ hàng trăm hệ điều hành và trình duyệt khác nhau. Các phòng thí nghiệm đám mây như... Phòng thí nghiệm nước sốt, BrowserStackvà Kiểm tra Lambda Hiển thị điểm cuối WebDriver từ xa. Trỏ cùng một điểm cuối. Selenium Các bài kiểm tra trên lưới, đáp ứng các yêu cầu về khả năng mong muốn cho trình duyệt, phiên bản, hệ điều hành và độ phân giải, và bộ công cụ có thể mở rộng theo chiều ngang mà không cần quản lý trình điều khiển cục bộ.

Các hệ thống lưới hiện đại cũng tích hợp các tính năng hỗ trợ bởi trí tuệ nhân tạo như so sánh hồi quy trực quan, định vị phần tử tự phục hồi và chấm điểm độ không ổn định, giúp giảm chi phí bảo trì cho các bộ kiểm thử đa trình duyệt có tuổi thọ cao.

Lưu ý: Chương trình được cung cấp đã được xây dựng và kiểm thử trên Selenium 4, Chrome, Firefoxvà Microsoft EdgeNếu chương trình báo lỗi, vui lòng cập nhật các tệp nhị phân trình điều khiển cho phù hợp với phiên bản trình duyệt đã cài đặt của bạn, hoặc sử dụng... Selenium Quản lý tự động giải quyết các vấn đề về trình điều khiển.

Tải về Selenium Tệp dự án cho bản demo trong hướng dẫn này

Câu Hỏi Thường Gặp