0

I'm looking to capture a 5000px long screenshot. But after capturing, it only captures content that is equal to the height of my desktop screen height which is 1080px and rest is blank.

casper.viewport(1024, 5000);

enter image description here

Rahul Dagli
  • 4,301
  • 15
  • 47
  • 85

1 Answers1

0

Make sure you set up your Casper options correctly. Look at their documentation at http://docs.casperjs.org/en/latest/modules/casper.html#index-1.

It appears there is a secion on viewport size here http://docs.casperjs.org/en/latest/modules/casper.html#viewportsize. From the docs: PhantomJS ships with a default viewport of 400x300, and CasperJS won’t override it by default.

mildog8
  • 2,030
  • 2
  • 22
  • 36
  • I tried explicitly setting height, for both viewport and image but its still showing blank `casper.captureSelector('./screenshots/build/desktop/main-content-' + currentPage + '.png', '.main-content', { top: 0, left: 0, width: 1024, height: 5000 });` – Rahul Dagli Dec 20 '16 at 14:58
  • @RahulDagli Have you changed the viewport size in caspers settings – mildog8 Dec 20 '16 at 14:59
  • Here's the viewport height `casper.viewport(1024, 5000);` – Rahul Dagli Dec 20 '16 at 14:59
  • yes, I believe from reading the casper docs you need to explicitly set the viewport dimensions otherwize they will be overridden by PhantomJS. Please try casper.options.viewportSize = {width: 1024, height: 5000} before you call to casper.viewport() – mildog8 Dec 20 '16 at 15:04
  • I tested with other page and it's working there. I think this issue might be related to rendering of the page while capturing the screenshot since the outer scrolling is hidden ie. `body` and `html` and internal scrolling is enabled. – Rahul Dagli Dec 21 '16 at 07:38