Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How to take full-page screenshots with Selenium and Google Chrome in Ruby
#!/usr/bin/env ruby
require 'selenium-webdriver'
wd = Selenium::WebDriver.for :remote, url: 'http://10.3.1.7:4444/wd/hub', desired_capabilities: :chrome
wd.navigate.to 'https://snipt.net/restrada/python-selenium-workaround-for-full-page-screenshot-using-chromedriver-2x/'
# Get the actual page dimensions using javascript
#
width = wd.execute_script("return Math.max(document.body.scrollWidth, document.body.offsetWidth, document.documentElement.clientWidth, document.documentElement.scrollWidth, document.documentElement.offsetWidth);")
height = wd.execute_script("return Math.max(document.body.scrollHeight, document.body.offsetHeight, document.documentElement.clientHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight);")
# Add some pixels on top of the calculated dimensions for good
# measure to make the scroll bars disappear
#
wd.manage.window.resize_to(width+100, height+100)
img = wd.screenshot_as(:png)
File.open('full-page.png', 'w+') do |fh|
fh.write img
end
wd.quit
@spacecowb0y

This comment has been minimized.

Copy link

@spacecowb0y spacecowb0y commented Sep 3, 2015

Works like a charm! 👍

@rkuzsma

This comment has been minimized.

Copy link

@rkuzsma rkuzsma commented Nov 12, 2015

Neat hack, thanks! Unfortunately, I couldn't get Chrome to resize beyond the screen's dimensions on Mac OS X. An approach like https://github.com/yandex-qatools/ashot/ might work for others with my issue.

@mgrachev

This comment has been minimized.

Copy link

@mgrachev mgrachev commented Jan 8, 2016

For this you can use the gem gastly.

@monkpit

This comment has been minimized.

Copy link

@monkpit monkpit commented May 25, 2016

Nice snippet :) unfortunately this will fail for pages with frames or elements that behave like frames.

@nikolja06

This comment has been minimized.

Copy link

@nikolja06 nikolja06 commented Aug 12, 2016

Thank you very much!!!

@itsNikolay

This comment has been minimized.

Copy link

@itsNikolay itsNikolay commented Oct 19, 2016

Good job! Thanks!

@sanketparlikar

This comment has been minimized.

Copy link

@sanketparlikar sanketparlikar commented May 5, 2017

Good job! Thank you very much!

@Aeliot-Tm

This comment has been minimized.

Copy link

@Aeliot-Tm Aeliot-Tm commented Jul 19, 2017

Unfortunately, I can't create screenshot of really big pages this way.
For example, I have a page with width ~1000px height ~8000px, but I got an exception if I set such browser height.

WebDriverError: unknown error: session deleted because of page crash
from unknown error: cannot determine loading status
from tab crashed
  (Session info: chrome=58.0.3029.81)
  (Driver info: chromedriver=2.29.461571 (8a88bbe0775e2a23afda0ceaf2ef7ee74e822cc5),platform=Linux 4.4.73-18.17-default x86_64) (WARNING: The server did not provide any stacktrace information)
Command duration or timeout: 1.13 seconds
Build info: version: '3.4.0', revision: 'unknown', time: 'unknown'
System info: host: '*****', ip: '*****', os.name: 'Linux', os.arch: 'amd64', os.version: '4.4.73-18.17-default', java.version: '1.8.0_121'
Driver info: org.openqa.selenium.chrome.ChromeDriver
Capabilities [{applicationCacheEnabled=false, rotatable=false, mobileEmulationEnabled=false, networkConnectionEnabled=false, 
        chrome={chromedriverVersion=2.29.461571 (8a88bbe0775e2a23afda0ceaf2ef7ee74e822cc5), 
        userDataDir=/tmp/.org.chromium.Chromium.g3Abe6}, takesHeapSnapshot=true, pageLoadStrategy=normal, 
        databaseEnabled=false, handlesAlerts=true, hasTouchScreen=false, version=58.0.3029.81, platform=LINUX, 
        browserConnectionEnabled=false, nativeEvents=true, acceptSslCerts=true, locationContextEnabled=true, 
        webStorageEnabled=true, browserName=chrome, takesScreenshot=true, javascriptEnabled=true, 
        cssSelectorsEnabled=true, unexpectedAlertBehaviour=}]
Session ID: *******
@ndabien

This comment has been minimized.

Copy link

@ndabien ndabien commented Oct 22, 2017

Thanks for sharing, very helpful! There are many user feedback widget available on the market, if you are interested in the widget which does not slow down your website speed then I suggest you BugRem.com, you should definitely check it out.

@jaypinho

This comment has been minimized.

Copy link

@jaypinho jaypinho commented Nov 10, 2017

Thank you! I have just run into the same problem as Aeliot-Tm: it seems like ChromeDriver fails whenever the page is too large (this is especially noticeable for news site homepages such as washingtonpost.com). Has anyone figured out a way to fix this?

@samnissen

This comment has been minimized.

Copy link

@samnissen samnissen commented Feb 17, 2018

For anyone using watir, you can tack on my gem watir-screenshot-stitch to take full page screenshots using html2canvas https://github.com/samnissen/watir-screenshot-stitch

@bragboy

This comment has been minimized.

Copy link

@bragboy bragboy commented Mar 2, 2018

These lines

img = wd.screenshot_as(:png)

File.open('full-page.png', 'w+') do |fh|
  fh.write img
end

can be replaced with one single line

  wd.save_screenshot('full-page.png')
@sandeepnagra

This comment has been minimized.

Copy link

@sandeepnagra sandeepnagra commented Mar 20, 2018

It doesn't for me. I still get only visible screen's screenshot.

@farhadbaghirov

This comment has been minimized.

Copy link

@farhadbaghirov farhadbaghirov commented May 3, 2018

Great Job.it worked for me but after resize() method,you should use maximize() method,because browser's size and location changed

@buurkeey

This comment has been minimized.

Copy link

@buurkeey buurkeey commented Oct 17, 2018

It doesn't for me. I still get only visible screen's screenshot.

unfortunately same for me too

@chhunge

This comment has been minimized.

Copy link

@chhunge chhunge commented Jul 22, 2019

It doesn't for me. I still get only visible screen's screenshot.

unfortunately same for me too

same =(

@Rayseus

This comment has been minimized.

Copy link

@Rayseus Rayseus commented Sep 4, 2019

Hi it will change the browser window size every time which is not good for screenshot many times

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.