Category Archives: Firefox Extensions

Firefox Extensions: Greasemonkey

Apple is publicizing another iTunes contest. Like before, they are giving away a prize for every 100,000 songs download or entries submitted. The latter is the typical alternative that all such contests require to claim that they aren’t a lottery or another form of gambling.

In this case, the free entry form allows up to 25 entries per day. Apple makes it a little tedious by clearing the form when you go Back to it, so you have to re-enter a ton of personal information each time. They also include a captcha image to prevent automated submissions. That’s all cool, but I’d like it to be just a little easier for me to enter for the free iPod goodness.

Among other things, I’m an experienced Javascript programmer, so I know there should be way to automate the form filling a little bit. Enter Greasemonkey. Greasemonkey is a Firefox extension which allows you to customize webpages on the fly. You create a short text file which gives Greasemonkey some URLs to edit and a bit of Javascript to execute on each webpage.

After you install Greasemonkey, you can find some user script you want to install somewhere on the web and right click to “Install User Script…”. Be careful, of course, because user scripts are NOT SAFE! You need to either understand the code you are installing or trust the person who wrote the script.

I created a Greasemonkey user script that fills in some personal information in the iTunes contest form and sets the cursor in the captcha text field. Here’s the code (note that you will have to edit it to insert your own info before using it):

// ==UserScript==
// @name           Apple's iTunes 1 billion contest helper
// @namespace
// @description    Prefill some data in a contest entry form
// @include*
// @include
// ==/UserScript==

var focus_field = "7.1.49";
var data = {};
data[""] = "Chris";
data[""] = "Dolan";
data["7.1.9"] = "1234 Main St";
data["7.1.17"] = "Madison";
data[""] = "WI";
data[""] = "537XX";
data["7.1.25"] = "United States";
data["7.1.29"] = "608";
data["7.1.31"] = "555-1212";
data["7.1.35"] = "January";
data["7.1.36"] = "1";
data["7.1.37"] = "1970";
data["7.1.41"] = "";
data["7.1.45"] = "";

var form = document.forms[0];
for (var i=0; i<form.elements.length; i++) {
   var e = form.elements[i];
   if ( == focus_field)
   var val = data[];
   if (val == null)
   if (e.type == "text") {
      e.value = val;
   } else if (e.type.indexOf("select") == 0) {
      for (var j=0; j<e.options.length; j++)
         if (e.options[j].text == val) {
            e.selectedIndex = j;
   } else
      alert("failed to set "" = "+val);

Save that as a text file called something like foo.user.js and edit it. In Firefox, drag the folder containing that script into the browser pane. You should see a directory listing for a file:// url. Right click on the user.js file and select “Install User Script…”. Then browse to the contest form. Your data should be prefilled.

If you need to edit the script, use “Tools > Manage User Scripts…” to uninstall the current version and install the edited version by the same steps as above.

Disclaimer: I do not feel that this is cheating on Apple’s contest at all. This script is just a helper similar to form auto-fill. You still have to fill in the captcha manually. This just takes a little of the tedium out of form filling.

Firefox Extensions: undoclosetab

This is the third installment of my exploration of useful Firefox extensions

The Mozilla folks are proud of being the popularizers of tabbed browsing, which caused a bit of a revolution in browsing UI. Such a simple concept, but so effective… Tabbed browsing encourages the user to open a bunch of pages in their own tab for a branching thread of surfing.

Warning: stretched analogy coming

This is like how we used to read Choose-Your-Own-Adventure books in the 1980s. (“If you want to read about RFID chips in you Passport, turn to page 87. If you want to continue reading Slashdot, turn to page 134.”) In the old CYOA books,1 you could only follow as many branches as you had fingers to mark your pages (unless you cheated by dogearring or using bookmarks). If a finger slipped out, you had to backtrack a lot to find out where you left off.

A screenshot of the undoclosetab option

The same thing happens if you mistakenly close a tab. “Argh, I didn’t finish reading that article! Now where did I get that link from?” You can use the History or recreate your browsing, but Undo Close Tab is an easier solution. This simple extension allows you to right-click on any tab to re-open the most recently closed tab where you left off. It even keeps a history so you can undo the last 2-3 closes, for example. Be warned, though: the tab closure history is kept per-window so if you close the whole Firefox window you can’t undo.

So here’s a new motto for this extension: “Simple but effective, just like fingers.”

Next time: GeoURL

1 Personal note: one of my first programming projects was writing Choose-Your-Own-Adventures and MadLibs programs in BASIC on my friend’s Apple ][.

Firefox Extensions: Web Developer

This is the second installment of my exploration of useful Firefox extensions

One of the most popular and highly rated Firefox extensions is the Web Developer extension. This tool adds one or more of the following to every web page: a handy context menu or a toolbar. Both contain the same list of tools that let an experienced HTML coder investigate and manipulate the current page. The total list of features is too long to detail here (you really just have to try a few of them), but I’ll highlight some that I use personally.

My favorite feature is the one shown in the screenshot below. The “Validate Local HTML” uploads the page you are currently viewing to a validation service (by default, This permits you to test your HTML before uploading it to a public web server, or allows you to validate a page that is hidden behind a login or form submission.

A screenshot of the Web Developer context menu

Another handy feature for HTML debugging is the Outline control. This submenu allows you to specify any of a variety of HTML entities to highlight. The extension highlights them by drawing boxes around them.

The extension also has a few uses for general users. The Disable submenu has options to turn off aspects of annoying pages, like image animations, page colors or even entire styles for the worst-designed pages. The Forms submenu allows you to convert POST forms to GET, for cases when you want to tweak the form values in the URL bar, or bookmark the results of a form submission.

The Web Developer extension has quite an impressive array of tricks it can accomplish, all with standard operations. If nothing else it demonstrates how flexible and open a platform Firefox has become.

Next time: undoclosetab

Firefox Extensions: Introduction and Live HTTP Headers


Interacting with the web has gotten more fun in the last year or so. Browser technological improvements seem to be getting a higher priority as Firefox, Safari and Opera are competing to present a superior, standards-compliant environment that benefits both developers and end-users. This means that developers can spend less time working around stupid bugs and more time creating interesting content.

These days, if you are building a web application a sound strategy is to create it initially under Firefox or Safari and then apply workarounds to IE problems at the end. It doesn’t really matter if you start with Firefox or Safari as anything that works under one is highly likely to work under the other (and any failure is more likely the developer’s fault, not the browser’s fault! yay!)

This is is marked contrast to five years ago when making a sophisticated website work in both Netscape and IE ususally meant deep sacrifices in functionality, or writing two separate websites.

Firefox in particular has caused an explosion of interest via its extension mechanism. Can you write Javascript and XML? If so, then you have the skills needed to customize the web experience. Because of this ease of development, the breadth of experimental new features has grown as the risk of trying out those features has shrunk. Of course, like the bulk of web itself many of the extensions are junk. But a few are winners that I can no longer imagine working without.

This post, and likely a few more that follow, will detail the Firefox extensions that I consider to be the most useful, primarily to web developers but also to general users. Eventually, I hope to also cover a few that are interesting, but not useful or good enough for regular use in my opnion.

And so, without further ado, I present…

Live HTTP Headers

Live HTTP Headers screen shot

This is the first Firefox plugin I ever installed and I still use it routinely today. Live HTTP Headers adds a new tab to the Page Info dialog that shows details of the HTTP request/response for that page. To see it, install the extension, visit a page and select Page Info (via the Tools menu, via the context menu, or via Cmd-I on Mac). Then select the Headers tab to see the HTTP headers panel.

This panel shows the full HTTP message exchanged between the browser and the web server, less the actual content. This data can be critical for debugging anything deeper than HTML/JS glitches. For example, I maintain the Perl module called CGI::Compress::Gzip which transparently compresses dynamic web content when the browser says that it can support it. I used the HTTP headers to determine what the browser was telling the web server regarding compression — in this case “Accept-Encoding: gzip” was the important one. Then I looked at the web server response, which would tell me the Content-Length (should be smaller when compressed!) and the “Content-Encoding: gzip” message.

The HTTP headers can also tell you what web server and platform is being employed at the other end. Finally, you get to see the raw cookie data that went over the wire.

On the command line, you can get easily see the response headers via something like

    wget -S -O /dev/null


    curl -I

but that’s not as real-world as viewing the browser transaction directly.

Viewing response headers can also be amusing. For example, visitors to Slashdot receive a random Futurama quote like the following:

    X-Bender: Farewell, big blue ball of idiots!

Next time: the Web Developer extension