Turning Firefox into a screenshot server with MozRepl

In October I introduced custom interactors and someone asked what can be done with them other than application inspection.

Here‘s a practical application that turns Firefox into a screenshot server. It lets you request e.g. http://localhost:4242/screenshot/http://en.wikipedia.org and receive a PNG screenshot of Wikipedia homepage. (Instructions to run it are at the bottom.)

Features and things to note:

  • Every page is loaded in a new tab, meaning that multiple screenshots can be requested concurrently.
  • You can have MozRepl listen to outside requests and thus have the server run on a machine (or machines) other than the one requesting screenshots.
  • Adding .../pdf/http://en.wikipedia.org, .../postscript/http://en.wikipedia.org, .../getmail/http://mail.google.com?user=foo&password=bar, and so on, shouldn’t be too hard.

This is no finished product but it should give a hint of the possibilities. Known issues: since it takes the screenshot upon DOM load event, pages that use the same event to build sizeable portions of the document (such as iGoogle) might turn out incomplete or just white. Also, Firefox 3.1 seems to hang when the same browser instance is both the requester and the receiver of the screenshot (ok, not the most useful scenario, but still).

To try it:

  1. Get MozRepl, whether devel or stable branch doesn’t matter.
  2. Copy the source of the screenshot server to a file (e.g. /home/foo/mozrepl-init.js)
  3. In about:config, set extensions.mozrepl.initUrl to the URL of that file, e.g. file:///home/foo/mozrepl-init.js. (This file gets read whenever a new MozRepl session is started.)
  4. In about:config, also set extensions.mozrepl.defaultInteractor to “screenshot”.
  5. Select Tools → MozRepl → Start from the menu to start MozRepl.
  6. Point wget (or curl, or another browser) to Firefox with:
     $ wget http://localhost:4242/screenshot/http://en.wikipedia.org 

Update 2009-06-16: Adam has an HTML-to-PNG server with an improved version of the interactor.

3 thoughts on “Turning Firefox into a screenshot server with MozRepl

  1. Adam Hooper

    Fantastic idea, and I really want to use this in my program (a distributed HTML-rendering test framework — http://github.com/adamh/html_to_png_server/tree/master).

    Unfortunately, I’m having trouble getting this to work with quickly-loading pages: all that gets rendered is a properly-sized, completely-white PNG. According to https://developer.mozilla.org/en/drawing_graphics_with_canvas, “Using canvas.drawWindow() while handling a document’s onload event doesn’t work. In Firefox 3.5 or later, you can do this in a handler for the MozAfterPaint event to successfully draw HTML content into a canvas on page load.” (Mozilla’s Developer Pages do not suggest any workarounds.)

    I’ve tried various hacks, such as throwing in a window.setTimeout(), but whenever I try such a change MozRepl seems to freeze up, and I don’t know how to debug it.

    Any ideas? Or if not, how can I go about debugging MozRepl such that setTimeout() will not cause it to freeze?

Comments are closed.