Selenide和Firefox记录错误的屏幕截图

Question

我正在使用Selenide和Phantomjs来测试test应用程序。我将截图如下：

byte[] bytes = ((TakesScreenshot)webDriver).getScreenshotAs(OutputType.BYTES);
ByteArrayInputStream bis = new ByteArrayInputStream(bytes);
returnImage = ImageIO.read(bis);

但是，对于输入元素，屏幕截图如下所示：faulty screenshot

它实际上看起来像这样(当使用chrome/firefox时) how it's supposed to look

有趣的是，当我将Selenide设置为使用phantomjs (Configuration.Browser = "phantomjs")时，它会正确地截取屏幕截图。它也只出现在那种元素上。按钮等可以正常录制。有什么想法吗？

附于这篇文章的截图是被裁剪的，这里的代码截取了整个页面的截图。在我的代码中，我只将屏幕截图裁剪到所需的元素，但即使在显示整个屏幕的屏幕截图上，元素也没有被正确记录。

Answer 1

你可以用下面的代码截取一个元素的屏幕：

WebElement ele = driver.findElement(By.id("hplogo"));

// Get entire page screenshot
File screenshot = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
BufferedImage  fullImg = ImageIO.read(screenshot);

// Get the location of element on the page
Point point = ele.getLocation();

// Get width and height of the element
int eleWidth = ele.getSize().getWidth();
int eleHeight = ele.getSize().getHeight();

// Crop the entire page screenshot to get only element screenshot
BufferedImage eleScreenshot= fullImg.getSubimage(point.getX(), point.getY(),
    eleWidth, eleHeight);
ImageIO.write(eleScreenshot, "png", screenshot);

// Copy the element screenshot to disk
File screenshotLocation = new File("C:\\images\\GoogleLogo_screenshot.png");
FileUtils.copyFile(screenshot, screenshotLocation);

现在，在上面的代码中，您将获得getWidth()和getHeight()。您可以尝试通过添加或减去该值来调整它。