且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何使用Selenium和Java获取完整网页的屏幕截图?

更新时间:2023-11-13 10:20:34

LE:我看到很多人都对整个屏幕截图感兴趣,所以我想我可能会更新答案带有一些积极意义(银色子弹).

有很多Web测试框架可以(只需最少的设置和工作)生成 整页屏幕截图 .我来自NodeJS测试环境,因此只能担保以下内容: WebdriverIO & Google的木偶.

如果有人对使用WebdriverIO进行简单操作感兴趣,请查看答案.


最简单的回答是否,您不能,如果您仅使用硒(详细原因如下).但是,您可以做的是充分利用设备的[监视器] 视口.

因此,请使用ChromeOptions()启动浏览器实例(驱动程序),这是设置ChromeDriver特定功能的方法.我们可以执行以下操作:

  • 最大化窗口(使用--start-maximized开关);
  • 进入全屏状态(在Windows上为F11键,在Mac上为Control+Cmd+F,使用--start-fullscreen开关).
  • 注意:Chrome命令行开关的完整列表可在此处.

您的代码应如下所示:

// Setting your Chrome options (Desired capabilities)
ChromeOptions options = new ChromeOptions();
options.add_argument('--start-maximized');
options.add_argument('--start-fullscreen');

// Creating a driver instance with the previous capabilities
WebDriver driver = new ChromeDriver(options);

// Load page & take screenshot of full-screen page
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);

现在关于整页问题,所有驱动程序(chromedrivergeckodriverIEDriverEdgeDriver等)都在实现获取屏幕截图" .

如果您阅读该定义,则会清楚地说明以下内容:

截取屏幕截图"命令截取***浏览上下文的 VIEWPORT 的屏幕截图.

从传统角度讲,某些驱动程序能够生成完整的屏幕截图(有关它的更多信息,请参见 ),就像旧的FirefoxDriver,IEDriver等一样.现在已经不再是这样了,因为它们现在都实现了WebDriver W3C标准.

How to take a screenshot of the entire web page (full-page screenshot), not only partial (top-to-bottom) using Selenium WebDriver?

My code: (Java bindings)

System.setProperty("webdriver.chrome.driver","/home/alex/Downloads/chromedriver_linux64/chromedriver");
WebDriver driver = new ChromeDriver();
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(scrFile, new File(RESULT_FILENAME));

Any ideas on how to tackle this?

LE: I see quite a lot of people are interested in the full-page screenshot, so I thought I might update the answer with some positives (silver bullets).

There are quite a handful of web testing frameworks that can (with minimal setup & effort) produce a full-page screenshot. I come from a NodeJS testing environment, so I can only vouch the following: WebdriverIO & Google's Puppeteer.

If anyone is interested in an easy way to do it with WebdriverIO, check this answer.


Short answer is NO, YOU CANNOT, if you're only using Selenium (detailed reason bellow). But, what you can do is make the most out of your device's(monitor) viewport.

So, start your browser instance (driver) using ChromeOptions(), which is the method for setting ChromeDriver-specific capabilities. We can do the following:

  • maximize the window (using the --start-maximized switch);
  • go full-screen (F11-key on Windows, Control+Cmd+F on Mac, using the --start-fullscreen switch).
  • Note: complete list of Chrome command-line-switches can be found here.

Your code should look like this:

// Setting your Chrome options (Desired capabilities)
ChromeOptions options = new ChromeOptions();
options.add_argument('--start-maximized');
options.add_argument('--start-fullscreen');

// Creating a driver instance with the previous capabilities
WebDriver driver = new ChromeDriver(options);

// Load page & take screenshot of full-screen page
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);

Now regarding the full page problem, all drivers (chromedriver, geckodriver, IEDriver, EdgeDriver, etc.) are implementing the WebDriver W3C standard. Thus, they are dependent on the way the WebDriver team wants to expose the functionality of different features, in our case, 'Take Screenshot'.

If you read the definition, it clearly states the following:

The Take Screenshot command takes a screenshot of the top-level browsing context’s VIEWPORT.

Legacy-wise, some drivers were able to produce a full-page screenshot (read more about it here), like the old FirefoxDriver, IEDriver, etc. That is no longer the case as they now all implement (to the letter) the WebDriver W3C standard.