Simple Extensions in Firefox 3


It was fascinating to watch the unveiling of Firefox 3 last week. I’m pleased that, in some small way, my contributions helped to bring this browser out the door.

Firefox 3: Download Day Results

First 24 hours: 8.3 million downloads, 69 downloads/second, 20 Gb/s Peak Transfer

While I generally focus on issues tangential to JavaScript code, at Mozilla – like testing, performance analysis, specifications, standards, bug hunting, speaking, demos, and blogging – some of my code is live within the browser, and that makes me quite happy.

One of my first tasks at Mozilla was to, with Mark Finkle, develop a JavaScript API for performing common interactions typically desired by extension developers, called: FUEL. This is a pure-JavaScript implementation that sits as a proxy inbetween the developer and the various, traditional, XPCOM-style ways of performing actions.

If you’re interested in learning more about FUEL I’ve collected a number of links and examples:

The Development of FUEL

FUEL was created over the course of a couple months, in early 2007, by Mark Finkle and I. Mark had much-better knowledge of Mozilla’s APIs and I had good knowledge of JavaScript and API design – the match worked out nicely. I’ve written a couple blog posts on FUEL and so has Mark.

You can also see the features and code that went into FUEL 0.1 and FUEL 0.2 in Bugzilla.

FUEL, Today

Today FUEL lives in Firefox 3 (meaning that you can use it to develop Firefox extensions) and is part of the core Mozilla platform (meaning that portions of the API will be available in any Mozilla-based application that is built). For example you can even use a FUEL-like API in Thunderbird (called ‘STEEL‘). Here are some of the best resources for getting started with FUEL in Firefox 3:

Here are some of my favorite example of FUEL in action. It was very important to me that the most-common actions take no more than a single line of code to perform – with even complex actions keeping nice and trim.

Open, and activate, a new tab pointing to Google.com

  1. Application.browser.open("http://google.com/").active = true;

Close the active browser tab

  1. Application.browser.activeTab.close();

Close all tabs that mention Google

  1. Application.browser.tabs.forEach(function(tab){
  2.   if ( tab.url.match(/google/) )
  3.     tab.remove();
  4. });

Add a new bookmark pointing to Mozilla

  1. Application.bookmarks.add("Mozilla", "http://mozilla.org/");

Remove all bookmarks pointing to Google.com

  1. Application.bookmarks.all.forEach(function(cur){
  2.   if ( cur.url.match(/google.com/) )
  3.     cur.remove();
  4. });

FUEL, Future

Development is still going strong on FUEL. There’s a Google Summer of Code student working on extending the API and porting it to more parts of the platform (along with backwards support for Firefox 2!). We’ll probably end up seeing this in Firefox 3.1 (the next version of Firefox, due out later this year).

If you have any questions concerning how to use FUEL, or to develop Firefox extensions in general, your best bet would probably be to join the #extdev IRC channel on irc.mozilla.org. Lots of knowledgeable people hang out there and will be more-than-capable of answering any questions that you might have.

Once again, I’m terribly excited by the final release of Firefox 3 – here’s hoping to many more excellent releases to come!

Posted: June 23rd, 2008


If you particularly enjoy my work, I appreciate donations given with Gittip.

12 Comments (Show Comments)



Comments are closed.
Comments are automatically turned off two weeks after the original post. If you have a question concerning the content of this post, please feel free to contact me.


Secrets of the JavaScript Ninja

Secrets of the JS Ninja

Secret techniques of top JavaScript programmers. Published by Manning.

Ukiyo-e Database and Search

Ukiyo-e.org

Japanese woodblock print database and search engine.


John Resig Twitter Updates

@jeresig

Infrequent, short, updates and links.