如何在Selenium WebDriver中截图

Selenium Webdriver中的屏幕截图

一个Selenium Webdriver中的屏幕截图用于错误分析。Selenium WebDriver可以自动获取但如果用户需要自己截取屏幕截图，则需要使用TakeScreenshot方法，该方法会通知WebDrive截取屏幕截图并将其存储在Selenium中。

在本教程中，将了解

使用Selenium WebDriver捕获屏幕截图
什么是Ashot API？
如何下载和配置Ashot API？
使用Ashot API捕获全页屏幕截图
截取页面特定元素的屏幕快照
使用Ashot进行图像比较

使用Selenium WebDriver捕获屏幕截图

在Selenium中截图是一个3步的过程

步骤1) 将Web驱动程序对象转换为TakeScreenshot TakesScreenshot scrShot =((TakesScreenshot)webdriver);

步骤2) 调用getScreenshotAs方法创建图片文件 File SrcFile=scrShot.getScreenshotAs(OutputType.FILE);

步骤3) 将文件复制到所需位置

示例：在此示例中，我们将使用http://www.itxiaonv.com/V4/将其另存为C：/Test.png(&S) 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(“http://www.itxiaonv.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); } }

注：Selenium版本3.9.0及更高版本不提供Apache Commons IO JAR。可以简单地下载它们这里在项目中给他们打电话

什么是Ashot API？

Ashot是Yandex在Selenium WebDriver的支持下提供的第三方工具，用于捕获屏幕截图。它采用单个WebElement的屏幕截图和页面的整页屏幕截图，这比屏幕大小更重要。

如何下载和配置Ashot API？

配置Ashot API有两种方法

1.使用Maven
2.手动操作，不使用任何工具

要通过Maven进行配置，执行以下操作：

去https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot
现在，点击最新版本。是1.5.4
复制依赖项代码并将其添加到pom.xml文件中

保存该文件，Maven会将JAR添加到构建路径中
现在准备好了！

在不使用任何依赖项工具的情况下手动配置

去https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot
现在，点击最新版本。是1.5.4
单击JAR，下载并将其保存在机器上

在构建路径中添加JAR文件：
在Eclipse中，右键单击项目->转到属性->构建路径->库->添加外部JAR
选择JAR文件
应用并关闭

使用Ashot API捕获全页屏幕截图

步骤1) Screenshot screenshot = new Ashot().takeScreenshot(driver);

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

这里1000的滚动时间是以毫秒为单位的，所以为了截图，程序将每1000毫秒滚动一次。

步骤2)：现在，从屏幕截图中获取图像并将其写入文件。可以提供jpg、png等文件类型。 ImageIO.write(screenshot.getImage(), “jpg”, new File(“.\screenshot\fullimage.jpg”));

拍摄大于屏幕尺寸的页面的整页屏幕截图。

示例：以下是捕获以下内容的整页屏幕截图的示例http://www.itxiaonv.com/test/guru99home/并保存到文件“creenshot.jpg”。

由于使用了Ashot API的ShootingStrategy类，我们将能够捕获大于屏幕大小的页面的全图。节目内容如下： 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("http://www.itxiaonv.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"));
    
    }
}

截取页面特定元素的屏幕快照

示例：以下是在上捕获Guru 99徽标的元素屏幕截图的示例http://www.itxiaonv.com/test/guru99home/页面并保存到文件“ElementScreenshot.jpg”。以下是代码： 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("http://www.itxiaonv.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进行图像比较

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("http://www.itxiaonv.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();
    }
}

总结

Ashot API是Yandex提供的免费软件。
这是一个用于在Selenium中截屏的实用程序。
它可以帮助在桌面浏览器、iOS Simulator Mobile Safari、Android Emulator浏览器等不同平台上截取单个WebElement的屏幕截图。
它可以截取大于屏幕尺寸的页面的页面截图。
该特性在Selenium版本3中已被删除，因此Ashot API是一个很好的选择。
它可以装饰截图。
它提供了一个屏幕截图比较。