用过 WebDriver 的同学都知道，WebDriver 可以对浏览器中的页面进行截图。例如：
|
1
2
3
4
|
public byte[] takeScreenshot() throws IOException {
TakesScreenshot takesScreenshot = (TakesScreenshot) driver;
return takesScreenshot.getScreenshotAs(OutputType.BYTES);
}
|
这样产生的图片是整个网页。但有时候我们并不需要整个网页，只需要某些特定的 WebElement，以避免一些干扰。
虽然 WebDriver 本身没有提供这样的 API，不过我们可以自己来，就是在全屏的截图中再进行裁剪，如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
public BufferedImage createElementImage(WebElement webElement)
throws IOException {
// 获得webElement的位置和大小。
Point location = webElement.getLocation();
Dimension size = webElement.getSize();
// 创建全屏截图。
BufferedImage originalImage =
ImageIO.read(new ByteArrayInputStream(takeScreenshot()));
// 截取webElement所在位置的子图。
BufferedImage croppedImage = originalImage.getSubimage(
location.getX(),
localtion.getY(),
size.getWidth(),
size.getHeight());
return croppedImage;
}
|
其中 ImageIO 和 BufferedImage 分别来自 javax.imageio 和 java.awt.image。
这种方法可以很好的削减截图的大小，也避免了一些不确定因素（比如日期时间等），是测试中保存截图的很好的方式。
注：如果测试的网页中含有 iframe，则需要使用更复杂的方式计算 WebElement 的位置，详见：计算网页中某个元素的位置。