Cách chụp ảnh màn hình trong Selenium webdriver

Ảnh chụp màn hình trong Selenium

A Ảnh chụp màn hình trong Selenium webdriver được sử dụng để phân tích lỗi. Selenium webdriver có thể tự động chụp ảnh màn hình trong quá trình thực thi. Nhưng nếu người dùng cần tự chụp ảnh màn hình, họ cần sử dụng phương pháp TakeScreenshot để thông báo cho WebDrive chụp ảnh màn hình và lưu trữ vào Selenium.

Ảnh chụp màn hình trong Selenium

Cách chụp ảnh màn hình trong Selenium

Dưới đây là quy trình từng bước về cách chụp ảnh màn hình trong Selenium WebDriver

Bước 1) Chuyển đổi đối tượng trình điều khiển web sang TakeScreenshot

TakesScreenshot scrShot =((TakesScreenshot)webdriver);

Bước 2) Gọi phương thức getScreenshotAs để tạo file ảnh

File SrcFile=scrShot.getScreenshotAs(OutputType.FILE);

Bước 3) Sao chép tập tin vào vị trí mong muốn

Ví dụ: Trong ví dụ này chúng ta sẽ chụp ảnh màn hình của https://demo.guru99.com/V4/ & lưu nó dưới dạng C:/Test.png

Đây là mã chụp màn hình trong selen:

package Guru99TakeScreenshot;

import java.io.File;

import org.apache.commons.io.FileUtils;

import org.openqa.selenium.OutputType;

import org.openqa.selenium.TakesScreenshot;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.firefox.FirefoxDriver;

import org.testng.annotations.Test;

public class Guru99TakeScreenshot {

    @Test

    public void testGuru99TakeScreenShot() throws Exception{

		WebDriver driver ;
    	System.setProperty("webdriver.gecko.driver","C:\\geckodriver.exe");
    	driver = new FirefoxDriver();

        //goto url

        driver.get("https://demo.guru99.com/V4/");

        //Call take screenshot function

        this.takeSnapShot(driver, "c://test.png") ;     

    }

    /**

     * This function will take screenshot

     * @param webdriver

     * @param fileWithPath

     * @throws Exception

     */

    public static void takeSnapShot(WebDriver webdriver,String fileWithPath) throws Exception{

        //Convert web driver object to TakeScreenshot

        TakesScreenshot scrShot =((TakesScreenshot)webdriver);

        //Call getScreenshotAs method to create image file

                File SrcFile=scrShot.getScreenshotAs(OutputType.FILE);

            //Move image file to new destination

                File DestFile=new File(fileWithPath);

                //Copy file at destination

                FileUtils.copyFile(SrcFile, DestFile);

    }

}

LƯU Ý: Selenium phiên bản 3.9.0 trở lên không cung cấp Apache Commons IO JAR. Bạn chỉ có thể tải chúng xuống đây và gọi họ trong dự án của bạn

API Ashot là gì?

Ashot là tiện ích của bên thứ ba bởi Yandex được hỗ trợ bởi Selenium WebDriver để chụp ảnh màn hình. Nó chụp ảnh màn hình của một WebElement riêng lẻ cũng như ảnh chụp màn hình toàn trang của một trang, điều này quan trọng hơn kích thước màn hình.

Làm cách nào để tải xuống và định cấu hình API Ashot?

Có hai phương pháp để định cấu hình API Ashot

  1. Sử dụng Maven
  2. Thủ công mà không cần sử dụng bất kỳ công cụ nào

Để định cấu hình thông qua Maven:

Cấu hình thông qua Maven

  • Lưu tệp và Maven sẽ thêm jar vào đường dẫn xây dựng của bạn
  • Và bây giờ bạn đã sẵn sàng!!!

Để cấu hình thủ công mà không cần bất kỳ công cụ phụ thuộc nào

  1. Đến phần https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot
  2. Bây giờ hãy nhấp vào phiên bản mới nhất. Đó là 1.5.4
  3. Bấm vào jar, tải xuống và lưu nó vào máy của bạn

Định cấu hình thủ công mà không cần bất kỳ công cụ phụ thuộc nào

  1. Thêm tệp jar vào đường dẫn xây dựng của bạn:
  2. In Eclipse, nhấp chuột phải vào dự án -> đi đến thuộc tính -> Đường dẫn xây dựng -> Thư viện -> Thêm lọ bên ngoài
  3. Chọn tệp jar
  4. Áp dụng và đóng

Chụp ảnh màn hình toàn trang bằng API Ashot

Bước 1) Tạo một đối tượng Ashot và gọi phương thức takeScreenshot() nếu bạn chỉ muốn chụp ảnh màn hình cho trang kích thước màn hình.

Screenshot screenshot = new Ashot().takeScreenshot(driver);

Nhưng nếu bạn muốn ảnh chụp màn hình của trang lớn hơn kích thước màn hình, hãy gọi phương thức ShootingStrategy() trước khi gọi phương thức takeScreenshot() để thiết lập chính sách. Sau đó gọi một phương thức takeScreenshot() thông qua trình quản trị web, ví dụ:

Screenshot screenshot = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(1000)).takeScreenshot(driver);

Ở đây 1000 được cuộn theo thời gian tính bằng mili giây, vì vậy để chụp ảnh màn hình, chương trình sẽ cuộn trong mỗi 1000 mili giây.

Bước 2): Bây giờ, lấy hình ảnh từ ảnh chụp màn hình và ghi nó vào tập tin. Bạn có thể cung cấp loại tệp dưới dạng jpg, png, v.v.

ImageIO.write(screenshot.getImage(), "jpg", new File(".\\screenshot\\fullimage.jpg"));

Chụp ảnh màn hình toàn trang của một trang lớn hơn kích thước màn hình.

Ví dụ: Đây là ví dụ về chụp ảnh màn hình toàn trang của https://demo.guru99.com/test/guru99home/ và lưu vào tập tin “screenshot.jpg.”

Do sử dụng lớp ShootingStrategy của API Ashot, chúng tôi sẽ có thể chụp được hình ảnh đầy đủ của một trang lớn hơn kích thước màn hình.

Đây là mã chụp màn hình trong chương trình selen:

package Guru99;

import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import org.openqa.selenium.By;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import ru.yandex.qatools.ashot.AShot;
import ru.yandex.qatools.ashot.Screenshot;
import ru.yandex.qatools.ashot.shooting.ShootingStrategies;

public class TestScreenshotUsingAshot {

public static void main(String[] args) throws IOException {
	
System.setProperty("webdriver.chrome.driver", "c:\\chromedriver.exe");
WebDriver driver  = new ChromeDriver();	

driver.get("https://demo.guru99.com/test/guru99home/");
driver.manage().window().maximize();
		
Screenshot = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(1000)).takeScreenshot(driver);

ImageIO.write(screenshot.getImage(), "jpg", new File("c:\\ElementScreenshot.jpg"));
	
	}

}

Chụp ảnh màn hình của một thành phần cụ thể của trang

Ví dụ: Dưới đây là ví dụ chụp ảnh màn hình phần tử của logo Guru 99 trên https://demo.guru99.com/test/guru99home/ trang và lưu vào tập tin “ElementScreenshot.jpg”.

Đây là mã chụp màn hình trong selen:

package Guru99;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import org.openqa.selenium.By;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import ru.yandex.qatools.ashot.AShot;
import ru.yandex.qatools.ashot.Screenshot;
import ru.yandex.qatools.ashot.shooting.ShootingStrategies;
public class TestElementScreenshotUsingAshot {
public static void main(String[] args) throws IOException {
	
System.setProperty("webdriver.chrome.driver", "c:\\chromedriver.exe");
WebDriver driver  = new ChromeDriver();	

driver.get("https://demo.guru99.com/test/guru99home/");
driver.manage().window().maximize();
		
// Find the element to take a screenshot

WebElement element = driver.findElement(By.xpath ("//*[@id=\"site-name\"]/a[1]/img"));

// Along with driver pass element also in takeScreenshot() method.

Screenshot = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(1000)).takeScreenshot(driver,element);

ImageIO.write(screenshot.getImage(), "jpg", new File("c:\\ElementScreenshot.jpg"));
	}
}

So sánh hình ảnh bằng Ashot

package Guru99;

import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import ru.yandex.qatools.ashot.AShot;
import ru.yandex.qatools.ashot.Screenshot;
import ru.yandex.qatools.ashot.comparison.ImageDiff;
import ru.yandex.qatools.ashot.comparison.ImageDiffer;

public class TestImageComaprison {

    public static void main(String[] args) throws IOException {

        System.setProperty("webdriver.chrome.driver", "C:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
        driver.get("https://demo.guru99.com/test/guru99home/");

        // Find the element and take a screenshot

        WebElement logoElement = driver.findElement(By.xpath("//*[@id=\"site-name\"]/a[1]/img"));
        Screenshot logoElementScreenshot = new AShot().takeScreenshot(driver, logoElemnent);

        // read the image to compare

        BufferedImage expectedImage = ImageIO.read(new File("C:\\Guru99logo.png"));

        BufferedImage actualImage = logoElementScreenshot.getImage();

        // Create ImageDiffer object and call method makeDiff()

        ImageDiffer imgDiff = new ImageDiffer();
        ImageDiff diff = imgDiff.makeDiff(actualImage, expectedImage);

        if (diff.hasDiff() == true) {
            System.out.println("Images are same");

        } else {
            System.out.println("Images are different");
        }
        driver.quit();
    }
}

Tổng kết

  • API Ashot là phần mềm miễn phí từ Yandex.
  • Đây là tiện ích chụp ảnh màn hình Selenium.
  • Nó giúp bạn chụp ảnh màn hình của một WebElement riêng lẻ trên các nền tảng khác nhau như trình duyệt máy tính để bàn, iOS Simulator Mobile Safari, Android Trình duyệt giả lập.
  • Nó có thể chụp ảnh màn hình trang của một trang lớn hơn kích thước màn hình.
  • Tính năng này đã bị xóa trong phiên bản selen 3, vì vậy API Ashot là một lựa chọn tốt.
  • Nó có thể trang trí các ảnh chụp màn hình.
  • Nó cung cấp một so sánh ảnh chụp màn hình.

Tìm hiểu thêm về PNV Xem tiếp