Capture screenshot of browser content (website)

Question

My aim is to have an image of a website (Yes, as simple as that). I know that there are tools like html2canvas. However I don't want the client browser to render the screenshot.

One reason is that I use a chrome extension with a webview which essentially behaves liken an iFrame. For security reasons rendering a screenshot for a website containing an iFrame does not work.

I also know they're working on the capability to natively support capturing website screenshots but I want a cross browser solution and not be dependent on the possibility of the browser. All this happens on a server so it should be executable via command line.

What I'm doing now is:

1. Open browser via command line
2. Switch focus to browser window via command line
3. Make screenshot (screencapture on mac, scrot on Linux) via command line

Doing it at this basic level has the disadvantage of the image containing status bars, browser plugin stuff etc. In fact I only want to have the actual website content without all this application-specific stuff around.

• The worst solution would be to hard code the 0|0 position of the content relative to the window for every browser. This is shitty (for obvious reasons).
• Another solution I've come up with is: tell the browser (I can talk to a plugin via socket) to add something like a QR-Code at x:0;y:0;, send the screenshot to the image processing server. After that remove the QR-Code and send the screenshot again. Then I know every point relative to 0|0 but it is also not that elegant.

The best thing would be a command line tool that somehow lets me determine what part of an application I want to capture an image of.

An example is this plugin for Firefox or this server-side tool or all these tools providing screenshots of websites with different browsers and OS like this. I wonder how they get rid of browser-specific GUI elements.

Addition:

I don't know if I made this clear enough, but I want a screenshot of a content of a specific browser but without the browser-specific GUI elements. That means an application running a headless browser will have no use for me. Because the headless browser has its own engine. I specifically want to have a screenshot of e.g. Firefox version x.

Answer 1

Do you know about Selenium? It's a testing tool that actually opens a specific browser and runs scripted tests. It can be used to take screenshots as well.

This might be a solution to your problem.