Nav links

Friday, 9 July 2004

Creating Firefox extensions

Due to its comparative youth, there is a decided lack of information about writing extensions for Mozilla Firefox. Until it reaches its version 1 release, the specs are expected to remain in flux, and this has probably discouraged a few tutorial writers from creating a soon-to-be-outdated series on Firefox.

However, if you're keen, and given the number of Firefox extensions there are lots of keen people around, there is some information scattered about.


  • Books (free)


  • Articles

    • The most complete Firefox extensions information page I've seen is at Roachfiend

    • The Future of Mozilla Application Development
    • - a tutorial-style article about packaging Firefox extensions.
    • Tutorial: Creating a Mozilla Extension - a comprehensive, but old, tutorial for creating extensions for the Mozilla suite. Some changes necessary for it to work for Firefox are mentioned at the end. Due to its completeness it's worth doing the tutorial, but it's inconvenient that it's not aimed at Firefox.

    • Packaging Firefox extensions - crucial documentation on how extensions must be packaged, from the main developer of Firefox

    • Jed Brown has written a quite comprehensive article on converting extensions to the latest packaging format.

    • XUL Planet has a great XUL reference and some great tutorials, that finish just a bit too soon. This is the place to go to learn about all the available XUL tags.



  • Forums

    • The extensions forum at Mozillazine seems pretty well-stocked with knowledgable people.





It's also highly recommended to pick apart a simple extension to see how it works. Knowing that .xpi and .jar files are just renamed .zip files means they can be easily unzipped. Something like Search Button, by Pike, might be a comfortable place to start.

Once you're actually writing code rather than fussing with getting your environment set up then you should find it plain sailing. Seeing as the code is in Javascript you can use the debugging tool of champions, alert("here I am"), liberally scattered throughout to see what's going on.

The DOM Inspector is also greatly helpful. You can go straight to your code by entering the location of its overlay, such as 'chrome://myextension/content/myextensionOverlay.xul' then hitting 'inspect'. Or check out how the browser is made up at 'chrome://browser/content/browser.xul'.

If your extension does not appear to be there, then force Firefox to rebuild its overlay cache by deleting the overlayinfo folder in the firefox/chrome folder. Then resave the installed-chrome.txt file, and restart the browser. You should do this anyway at least once to build up the confidence that you're not killing anything important.

Actually, that last paragraph really only applies to Firefox 0.8. With Firefox 0.9 extensions are installed in profile folders, and I'm not sure what's going on with overlays there.