Come acquisire uno screenshot Selenium webdriver

Schermata in Selenium

A Schermata in Selenium Webdriver viene utilizzato per l'analisi dei bug. Selenium webdriver può acquisire automaticamente schermate durante l'esecuzione. Ma se gli utenti devono acquisire uno screenshot da soli, devono utilizzare il metodo TakeScreenshot che notifica al WebDrive di acquisire lo screenshot e archiviarlo in Selenium.

Screenshot in Selenium

Come acquisire uno screenshot Selenium

Ecco una procedura passo passo su come acquisire screenshot nel selenium WebDriver

Passo 1) Converti l'oggetto del driver Web in TakeScreenshot

TakesScreenshot scrShot =((TakesScreenshot)webdriver);

Passo 2) Chiama il metodo getScreenshotAs per creare il file immagine

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

Passo 3) Copia il file nella posizione desiderata

Esempio: In questo esempio cattureremo lo schermo di https://demo.guru99.com/V4/ e salvalo come C:/Test.png

Ecco il codice dello screenshot in selenio:

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

    }

}

NOTA: Selenium la versione 3.9.0 e successive non fornisce Apache Commons IO JAR. Puoi semplicemente scaricarli qui e chiamali nel tuo progetto

Cos'è l'API Ashot?

Ashot è un'utilità di terze parti di Yandex sostenuto da Selenium WebDriver per acquisire gli screenshot. Richiede uno screenshot di un singolo WebElement nonché uno screenshot dell'intera pagina di una pagina, che è più significativo delle dimensioni dello schermo.

Come scaricare e configurare l'API Ashot?

Esistono due metodi per configurare l'API Ashot

  1. Utilizzando Maven
  2. Manualmente senza l'utilizzo di alcuno strumento

Per configurare tramite Maven:

Configura tramite Maven

  • Salva il file e Maven aggiungerà il jar al percorso di creazione
  • E ora sei pronto!!!

Per configurare manualmente senza alcuno strumento di dipendenza

  1. Vai su https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot
  2. Fare clic sulla versione più recente, per ora. È 1.5.4
  3. Clicca sul barattolo, scaricalo e salvalo sul tuo computer

Configura manualmente senza alcuno strumento di dipendenza

  1. Aggiungi il file jar nel percorso di build:
  2. In Eclipse, fai clic con il pulsante destro del mouse sul progetto -> vai su Proprietà -> Percorso di creazione -> Librerie -> Aggiungi jar esterni
  3. Seleziona il file jar
  4. Applica e chiudi

Cattura screenshot a pagina intera con l'API AShot

Passo 1) Crea un oggetto Ashot e chiama il metodo takeScreenshot() se desideri solo lo screenshot per la pagina delle dimensioni dello schermo.

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

Ma se vuoi uno screenshot della pagina più grande della dimensione dello schermo, chiama il metodo shootingStrategy() prima di chiamare il metodo takeScreenshot() per impostare la policy. Quindi chiama un metodo takeScreenshot() passando il webdriver, ad esempio,

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

Qui 1000 indica il tempo di scorrimento in millisecondi, quindi per acquisire uno screenshot, il programma scorrerà ogni 1000 msec.

Passo 2): Ora prendi l'immagine dallo screenshot e scrivila nel file. Puoi fornire il tipo di file come jpg, png, ecc.

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

Acquisizione di uno screenshot a pagina intera di una pagina più grande delle dimensioni dello schermo.

Esempio: Ecco l'esempio di acquisizione di uno screenshot a pagina intera di https://demo.guru99.com/test/guru99home/ e salva nel file "screenshot.jpg".

Grazie all'utilizzo della classe ShootingStrategy dell'API Ashot, saremo in grado di catturare un'immagine completa di una pagina più grande della dimensione dello schermo.

Ecco il codice dello screenshot nel programma selenium:

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

}

Catturare uno screenshot di un particolare elemento della pagina

Esempio: Ecco l'esempio di acquisizione dello screenshot dell'elemento del logo Guru 99 su https://demo.guru99.com/test/guru99home/ pagina e salvarla nel file "ElementScreenshot.jpg".

Ecco il codice dello screenshot in selenio:

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

Confronto di immagini utilizzando 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();
    }
}

Sommario

  • Ashot API è un freeware di Yandex.
  • È un'utilità per acquisire uno screenshot Selenium.
  • Ti aiuta a acquisire uno screenshot di un singolo WebElement su piattaforme diverse come browser desktop, iOS Simulator Mobile Safari, Android Browser emulatore.
  • Può acquisire uno screenshot di una pagina più grande della dimensione dello schermo.
  • Questa funzionalità è stata rimossa nella versione 3 del selenio, quindi l'API Ashot è una buona opzione.
  • Può decorare gli screenshot.
  • Fornisce un confronto tra screenshot.

Per saperne di più leggi di più