Incrementally building Mozilla/Firefox

Mozilla code base is really huge and has variety of files which are built in a variety of ways. It was sort of always confusing for me to figure out where all I should run make after I change any of the files. I generally asked on the IRC and someone just told me where to run make.

Today it was the same thing. But I also thought I would as well learn the logic to decide for myself the next time. Here is the chat transcript of NeilAway answering these questions.

The MDC page (https://developer.mozilla.org/en/Incremental_Build) has almost the same content for the native code. Neil here explains it for all the types of files involved.

Also to add to the following things running : "make check" from the objdir will run the automated tests.

• For xul/js/css/xbl it usually suffices to find the jar.mn (it may be in an ancestor folder) and make realchrome in the corresponding objdir
• For idl you're often looking at a full rebuild, depending on how widely it's used
• For .cpp and .h you obviously have to make in the folder itself, and then look for a corresponding build folder
• Except for uriloader where you use docshell/build and content, dom, editor and view use layout/build
• If you're building libxul or static then this is all wrong
• You don't look for a build folder, I think for libxul you build in toolkit/library and for static you build in browser/app

Getting the size of an already loaded page (from cache) in a Firefox extension.

Today this question came up in the IRC (moznet, #extdev). One of the add-on developers wanted to get the size of the page, either bytes or number of characters. The most obvious thing that came to my mind was progress listeners for definitive answers or the content length from the channel for not so critical scenario. But then he said he wants it for an already loaded page. And he further said that the information is already there somewhere as it is shown by the Page Info dialog (Right Click on a web page and select View Page Info). He was indeed right. Somebody in the code is already going through the trouble of calculating the data size and we can just re-use that. And I immediately started the quest to find that out.

As usual to figure out any browser component I opened up DOM Inspector. That tool is improving, which was against my earlier perception (Sorry Shawn Wilsher), though the highlighting part is still screwed up. Nevertheless, locating that particular label "Size" and the textbox in front of it containing the value was not difficult at all. I got the "id" of the textbox containing the size value. (Its "sizetext" :) ).

Next it was MXR (http://mxr.moziila.org/) in action. I did a text search for the id and got a bunch of results, one of which was pageInfo.js with this entry : line 489 -- setItemValue("sizetext", sizeText); . It is here. The very line made it apparent that it is the place where the value is being set and hence it is the place from where I can get to know how the value is being calculated.

Once I saw the code it was very clear and straight forward and pretty simple also. We have the URL. From the URL we get the cache entry for that URL. (Every cache entry has a key and that key is the URL - so neat). We try to get the cache entry from the HTTP Session first and if that fails we try FTP Session. The cache entry has the size as an attribute on itself, so its just getting that attribute value. DONE.

I am not sure how this will behave if we have disabled every type of cache. AFAIK, there will still be some in-memory cache as long as the page is still loaded. Probably good enough.

That was the end of a small but interesting quest. :-)

An official full-fledged Firefox Add-ons dev guide

Having done a little work on Mozilla Firefox and extensions for it I have always felt the lack of an official, step by step document for extension development. I do accept that there are a lot of resources available on the internet. Innumerable number of blogs and tutorials explaining the process step by step. But most of them become outdated with newer versions of Firefox and the authors are not really keen about updating the info. That is why an official tutorial or guide from Mozilla itself would be the right thing. It will make sure the contents in the guide are up-to-date and worth reading for developing an extension for the currently available version of Firefox.

There are documents for extension development on MDC like the various links present at: https://developer.mozilla.org/en/Extensions but it was either scattered or pretty brief in most places though it did touch most parts of extension development. Nevertheless a wholesome "official" guide was needed and here it is now. I went through the guide and as the blog post says it is still in BETA with a lot of "TO-DO" tags in there. In spite of that it is very much usable. Do visit it and post back your feedback to make it a much better guide.

Add-ons Blog » Blog Archive » Firefox Add-ons Developer Guide (beta release) - Calling all Add-on Developers!

Lets hope we will have more and more quality extensions now. :-)

Image for a statusbar panel in a firefox extension

I was working on a firefox extension which, like many other extensions, was adding a small button to the status bar. Doing this is very clearly explained here in : this MDC tutorial

I followed the instructions properly but to my surprise I did not see the image on the status bar, but just a square box in the defualt chrome color. I tried forums/web search and the IRC too, but no help. Then I read the statusbarpanel reference page - statusbarpanel - MDC -- completely and it appears that for the image to show up the statusbarpanel has to be of a specific class called : "statusbarpanel-iconic". I just added that and it worked. :-)

Here is my code

<statusbar id="status-bar">
     <statusbarpanel id="graph_status_bar_panel"
              image="chrome://myext/skin/chart_status_bar.png"
              class="statusbarpanel-iconic" onclick="toggleGraphPanel(event)"
              tooltiptext="View Graph Panel" />
</statusbar>