Selenium Tips: Capturing A Larger Screen Area

Capturing screenshots of your tests is one of the most important features you can give to an automation engineer. It's the easiest way to actually understand from a report, why a test failed and how to reproduce it. While our Live Testing will generate videos of the entire test by default, sometimes you just want a screenshot. Selenium supports capturing screenshots on remote machines, as discussed in a previous Tip of the Week (Taking ScreenShots on the Server). Selenium Webdriver3 only has a single method to save the screen:

SaveScreenshot

This method shows the viewport - the part of the screen that the user can view. That means anything to the left or right, below the scrollbars, is going to be missing. Not only that, but the exact size of the viewport will be a default that can change if the HTML changes. That isn’t a huge issue, but if your goal is to take screenshots and compare them, it could be a problem.

One option is the maximize window function, implemented in ruby here in github. That function is as simple as:

driver.manage.window.maximize
driver.save_screenshot("screenshot_orig.png");

That allows screen captures more like this:

Entire Page Screenshot

Sadly, as of publication time, that code only works on FireFox. In Chrome there are two other options. You can manage the window size, like this:

target_size = Selenium::WebDriver::Dimension.new(1440, 1800)
driver.manage.window.size = target_size

Or use resize_to, like so:

driver.manage.window.resize_to(800, 600);

Writing browser-specific code and guessing pixel sizes is far from the best practice we know and more like work-around-practice. It might work, it can get you started, and it is free. f you need more visual debugging tools, our service Live Testing will capture full screen videos which will record every single selection event without any extra code. If you still want actual images, images by portion of the screen, and a workflow to review and approve or fail images when they differ, consider our partner AppliTools, which provides a code and backend library that works seamlessly with Sauce. Thank for tuning in, and check back after the new year for more Selenium Tip of The Week from Sauce Labs! PS: You should follow us on twitter