Tag: firefox

Finally, after much trial and error, I have something approaching a usable development environment for a firefox extension. It’s based around roachfiend’s helloworld tutorial.

1. Set up a separate development profile in firefox that you can play around with. The article Setting up extension development environment is a good source for this. I also found this in my ~/.zshrc useful:

   alias firefoxdev="MOZ_NO_REMOTE=1 firefox -p dev -console"

2. Download roachfiend’s helloworld extension. Extract it into a directory called helloworld.
3. Inside the helloworld directory, remove the install.js file. It’s only used by older mozilla’s and we don’t care about it.
4. Inside helloworld/chrome, create a new helloworld directory and extract the contents of helloworld.jar into it. Then remove helloworld.jar.
5. Edit the install.rdf so that urn:mozilla:extension:file:helloworld no longer has a ”.jar” on the end.
6. Now we’re ready to import this lot into subversion:

   % cd helloworld
   % svn import $SVNROOT/helloworld/trunk/src

7. The extension needs to be built and imported into firefox once.

   % zip -9r ../helloworld.xpi *

8. Start firefox (in your development profile), do File / Open / helloworld.xpi and install. Then quit firefox.
9. Change into the development profile directory (I chose ~/work/mozdev to make it easy to find. Then replace the installed extension with the one checked out of subversion.

   % cd ~/work/mozdev
   % cd extensions
   % uuid="{9AA46F4F-4DC7-4c06-97AF-5035170633FE}"
   % mv $uuid $uuid.old
   % svn co $SVNROOT/helloworld/trunk/src $uuid
   % mv $uuid.old/uninstall $uuid

   Of course, this will differ if you have a different UUID (in which case don’t forget to update install.rdf!).

10. You probably want to set a property to ignore that uninstall directory:

    % svn propset svn:ignore uninstall $uuid
    % svn commit -m 'Ignore uninstall.'

11. Start firefox and check that the extension still works.
12. You might want to create a symbolic link to get into the directory easily.

    % cd
    % ln -s ~/work/mozdev/extensions/$uuid helloworld

At this point, you have a version of firefox, with access to a full expanded extension, which you can start developing in. Also the extension is inside subversion, so you can keep track of things sensibly. You’ll note that I imported the extension into a directory called “src”—that’s so that I can put a build script and other stuff above it, in case I ever actually get as far as releasing something.

The steps for cvs instead of subversion should be pretty similiar.

Two very good sources of documentation are: mozillazine knowledgebase: Extension development and devmo: Extensions. It seems like they held all the pieces I needed to pull this together even though I wasn’t coherent enough to spot it.

After a bit of research, I’ve concluded that there are many different ways of developing extensions in mozilla / firefox. And they all vary over time. Most of the problems appear to surround the registration of chrome (the actual browser bits as opposed to the content it displays).

Originally, you had to register the chrome by hand. This involved editing the file chrome/installed-chrome.txt in the mozilla application directory (source: Rapid Application Developmen with Mozilla). You also had to develop your application in the same place. This is probably ok if you’re on windows, but it utterly sucks if you’re in Unix as you don’t have permission to do any of this.

Later on, along came firefox with it’s extension manager. This let you easily install extensions into your profile instead of system wide—a blessing for us Unix users, and probably making life easier for windows users too.

Developing under this setup now used install.rdf and chrome.manifest files. I have no idea if you can develop using the “edit+reload” style with this version.

Now, for firefox 1.1, the extension manager has changed again. And it’s all different. Whilst I understand all the reasons for doing so, the lack of documentation about how all this fits together is very annoying for people trying to develop against a stable platform.

But, looking at the docs shows that extensions really should be easier to get going with this new method. I hope.

Of course, all my troubles are probably because I’m using Ubuntu’s version of firefox instead of one of the official builds…

I’ve tried a few times to play with firefox (or it’s parent, mozilla) in order to write a plugins. There’s no shortage of ideas that I could implement… But every time I get stymied at the first step: getting the development environment set up.

This time, I was following Getting started with extension development, which looked like just the ticket for getting going. Everything laid out in nice, easy steps. Except that I can’t make it work. The extension manager plainly refuses to see the extension I have created. And I have no idea why, because there appears to be no logging at all.

I’ve actually purchased two books on mozilla development over the years, but whilst they have good coverage of the innards, they have less than stellar coverage of how to get there.

Whilst I like firefox greatly, I do wish that it was more like Emacs in how it exposes its development functionality. That’s a lot easier to get started with.

Update: Pilot error. I failed to notice the “requires firefox 1.1 or better” notices contained within…

Firefox is a fine web browser. But one of the best features is the ability to add in extensions. These are a few of the extensions that I have to install.

• AdBlock. Lets you switch off the annoying flashing adverts.
• Web Developer. If you’re developing web sites, you need this to understand how your web pages really work.
• View Cookies. A simple but useful tool if you’re developing web sites.
• Live HTTP Headers. Shows you what really happened under the hood. Again, more useful for web site developers.
• GreaseMonkey. This should be installed by default. It lets you use JavaScript to alter any web page in any way. Very handy for fixing up those little “broken” things lying around the web.
• Show Anchors. Really handy for linking to some particular piece of a web page instead of the page as a whole.

The other extremely handy extension is the DOM Inspector, but that’s more of a builtin thing than an extension.