How can I take a screenshot of the full web-page (including non-visible parts) with Selenium/WebDriver using c# and the ChromeDriver?

So that is full page, including elements that are not in view, but for which you need to scroll down.

Here is my current code:

 Screenshot capture= ((ITakesScreenshot)driver).GetScreenshot();
  • Do you get an error? A little bit more details could help. – Niels van Reijmersdal Dec 17 '17 at 12:19
  • No errors, it is working with me but it doesn't take full page screenshot including scrolling , I want full page screen capture inside web page – Ahmed Assem Dec 17 '17 at 12:29
  • Sorry, misread your question. Next time maybe add a bit more context with your question. Like explaining what you tried, what you expect and what you got. If i understand correctly: Taking screenshots works, but it only shows you what is visible? but you want to also want an image of what is down below if the user would scroll. – Niels van Reijmersdal Dec 17 '17 at 12:43
  • Maybe you can also explain your usecase, e.g. why do you need a screenshot of the fullpage. Then what are you going todo with it after you have it. Maybe we can help you with an alternative. – Niels van Reijmersdal Dec 17 '17 at 13:03
  • 1
    @BharatMane they're related, but not duplicate. This one specifically mentions the requirement of including elements that are not currently visible in the scroll region. Nothing in the linked question calls that out specifically. – c32hedge Dec 18 '17 at 14:54

You cannot take full page screenshots with Selenium/WebDriver. The WebDriver W3C requirement specify taking screenshots as:

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

So you can only take screenshots of what is currently visible. I don't think there are a lot of use-cases where during a test you need a screenshot of the full-page. Simulating a user means act as the user would, the user can also only see the viewport. This simplifies the implementation of the WebDriver.

Implement it yourself:

What you could do is scroll and take multiple screenshots and combine them into one image after you got the shots:

  1. Calculate the browser window viewport and document height, with help of the JavaScript executor.
  2. Take a screenshot.
  3. Scroll down the viewport height with window.scrollBy() and the JavaScript executor.
  4. Take another screenshot.
  5. Repeat until end of page, e.g. reached the document height.
  6. Combine screenshots into one image.
  • The SaveAsFile() function take one parameter also (string fileName) and it works fine with me. – Ahmed Assem Dec 17 '17 at 12:31

Not the answer you're looking for? Browse other questions tagged or ask your own question.