Ekran Görüntüsü Nasıl Alınır? Selenium Web Sürücüsü

By: Krishna Rungta Krishna Rungta
Hours Güncellenmiş

⚡ Akıllı Özet

Ekran Görüntüsü Al Selenium WebDriver, TakesScreenshot, tam sayfa, öğe yakalama ve AShot özelliklerini kapsayarak hata ayıklama ve görsel regresyon için görsel kanıt yakalamayı açıklıyor.

  • 📷 Neden Yakalayacağız: Başarısızlıkları kanıtlayın ve çalıştırmaları belgeleyin.
  • ️ Ekran görüntüsü alır: WebDriver'ı yayınla, getScreenshotAs'ı çağır, dosyayı kaydet.
  • 🖼️ Element Yakalama: Selenium 4, WebElement üzerinde getScreenshotAs özelliğini destekler.
  • ???? AShot: Sayfaların tamamını birleştirir ve pikselleri karşılaştırır.
  • 🤖 Yapay Zeka Görsel Testleri: Applitools, gürültüyü göz ardı ederek farkları tespit eder.
  • 📊 Raporlar: Ekran görüntülerini Allure veya ExtentReports'a yerleştirin.
Devamını Oku

Ekran Görüntüsü Nasıl Alınır? Selenium Web Sürücüsü

ekran görüntüsü Selenium

A ekran görüntüsü Selenium Web sürücüsü Hata analizi için kullanılır. Selenium web sürücüsü yürütme sırasında otomatik olarak ekran görüntüsü alabilir. Ancak kullanıcıların kendi başlarına bir ekran görüntüsü yakalaması gerekiyorsa, WebDrive'a ekran görüntüsünü alıp saklamasını bildiren TakeScreenshot yöntemini kullanmaları gerekir. Selenium.

Ekran Görüntüsü Girişi Selenium

Ekran Görüntüsü Nasıl Alınır? Selenium

İşte Selenium WebDriver'da ekran görüntüsünün nasıl yakalanacağına dair adım adım bir süreç

) 1 Adım Web sürücüsü nesnesini TakeScreenshot'a dönüştürün

TakesScreenshot scrShot =((TakesScreenshot)webdriver);

) 2 Adım Görüntü dosyası oluşturmak için getScreenshotAs yöntemini çağırın

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

) 3 Adım Dosyayı İstenilen Konum'a kopyalayın

Örnek: Bu örnekte ekran görüntüsünü alacağız. https://demo.guru99.com/V4/ ve C:/Test.png olarak kaydedin

Selenyumdaki ekran görüntüsü kodu:

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);

    }

}

NOT: Selenium sürüm 3.9.0 ve üzeri Apache Commons IO JAR'ı sağlamaz. Bunları kolayca indirebilirsiniz okuyun ve projenizde onları arayın

Kaçırmayın:

Ashot API'si nedir?

Ashot üçüncü taraf bir yardımcı programdır. Yandex Tarafından desteklenen Selenium Ekran görüntülerini yakalamak için WebDriver. Tek bir WebElement'in ekran görüntüsünün yanı sıra bir sayfanın tam sayfa ekran görüntüsünü de alır; bu, ekran boyutundan daha önemlidir.

Ashot API'si nasıl indirilir ve yapılandırılır?

Ashot API'yi yapılandırmanın iki yöntemi vardır

  1. Maven'i kullanma
  2. Herhangi bir alet kullanmadan manuel olarak

Maven aracılığıyla yapılandırmak için:

Maven Aracılığıyla Yapılandırma

  • Dosyayı kaydedin; Maven kavanozu derleme yolunuza ekleyecektir
  • Ve artık hazırsınız!!!

Herhangi bir bağımlılık aracı olmadan manuel olarak yapılandırmak için

  1. MyCAD'de yazılım Güncelleme ye git https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot
  2. Şimdilik en son sürüme tıklayın. 1.5.4
  3. Kavanoza tıklayın, indirin ve makinenize kaydedin

Herhangi Bir Bağımlılık Aracı Olmadan Manuel Olarak Yapılandırın

  1. Jar dosyasını derleme yolunuza ekleyin:
  2. In Eclipse, projeye sağ tıklayın -> özelliklere gidin -> Yapı Yolu -> Kütüphaneler -> Harici kavanozlar ekleyin
  3. Jar dosyasını seçin
  4. Uygula ve Kapat

AShot API ile Tam Sayfa Ekran Görüntüsü Yakalayın

) 1 Adım Bir Ashot nesnesi oluşturun ve yalnızca ekran boyutu sayfasının ekran görüntüsünü istiyorsanız takeScreenshot() yöntemini çağırın.

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

Ancak sayfanın ekran görüntüsünün ekran boyutundan daha büyük olmasını istiyorsanız, politikayı ayarlamak için takeScreenshot() yöntemini çağırmadan önce shootStrategy() yöntemini çağırın. Daha sonra web sürücüsünü geçen takeScreenshot() yöntemini çağırın, örneğin:

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

Burada 1000 milisaniye cinsinden kaydırma süresidir, dolayısıyla ekran görüntüsü almak için program her 1000 ms'de bir kaydırma yapacaktır.

Adım 2): Şimdi ekran görüntüsündeki görüntüyü alın ve dosyaya yazın. Dosya türünü jpg, png vb. olarak sağlayabilirsiniz.

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

Ekran boyutundan daha büyük bir sayfanın tam sayfa ekran görüntüsünün alınması.

Örnek: İşte tam sayfa ekran görüntüsünü yakalama örneği: https://demo.guru99.com/test/guru99home/ ve “ekran görüntüsü.jpg” dosyasına kaydedin.

Ashot API'sinin ShootingStrategy sınıfını kullanmamız sayesinde ekran boyutundan büyük bir sayfanın tam görüntüsünü yakalayabileceğiz.

İşte Selenyum programındaki ekran görüntüsü kodu:

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"));
	
	}

}

Sayfanın belirli bir öğesinin ekran görüntüsünün alınması

Örnek: İşte bir öğenin ekran görüntüsünü yakalama örneği. Guru 99 logosu üzerinde https://demo.guru99.com/test/guru99home/ sayfasını açın ve “ElementScreenshot.jpg” dosyasına kaydedin.

Selenyumdaki ekran görüntüsü kodu:

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"));
	}
}

AShot Kullanarak Görüntü Karşılaştırma

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();
    }
}

SSS

Arızaları belgeliyorlar ve aralıklı hataları hızla tespit ediyorlar.

Applitools gibi araçlar, dinamik içeriği göz ardı ederek ekran görüntülerini akıllıca karşılaştırır.

Evet. Yapay zeka araçları TakesScreenshot, AShot ve benzeri komutlar üretir. Selenium 4 kısa alıntı.

AShot kullanın veya Selenium 4. Chrome Geliştirici Araçları ile Page.captureScreenshot komutunu kullanın.

TakesScreenshot ekran görüntüsünü alır. AShot ise tam sayfaları birleştirir.

Görüntülenenleri yakalar. Paylaşmadan önce hassas verileri gizleyin.

getScreenshotAs tarafından döndürülen dosyayı kendiniz kaydedin.

Evet. element.getScreenshotAs(OutputType.FILE) yöntemini doğrudan kullanın.

Bu yazıyı şu şekilde özetleyin: