Enrico Foschi’s official blog

Something about me – .NET Team Leader with an entrepreneurial mind

How to check with Javascript if a Firefox Add-on / Extension is installed

with 10 comments

Agglom was used to display an invitation to download the Firefox Add-on Agglomerator in the main pages to all the users.

Unfortunately, the invitation was displayed by users that already installed the Add-on too. The challenge was to check with JS if the user already had the add-on installed and, if he had it, to hide the invitation.

Surfing the web I stumbled upon this page:
http://ha.ckers.org/weird/firefox-extentions.html

Thanks to ha.ckers.org, the feature has been pretty easy to develop. What we did was to include the invitation inside a DIV with a specified id (firefoxExtension). Right after the closing tag of the DIV we appended this image:

<img src=”chrome://agglomerator/skin/icon24.png”
class=”displayNone”
onload=”if(document.getElementById(‘firefoxExtension’))
document.getElementById(‘firefoxExtension’).style.display=’none’;” />

The IMG tag loads an image that is included in Agglomerator (the icon displayed in the toolbar to save and share the current browser session). If the extension has been installed correctly, the icon will be loaded and the onload event will be fired. This is then hiding the DIV with id=firefoxExtension. If the extension is not installed, the onload event won’t be fired.

This is a quick and dirty method and should work with all almost any add-on.

Hope it helps.

Written by Enrico Foschi

August 21, 2008 at 9:14 pm

10 Responses

Subscribe to comments with RSS.

  1. very clever.

    nice.

    Keith

    August 22, 2008 at 1:50 pm

  2. it also has the added benefit of hiding it from all non ff browsers too.

    Keith

    August 22, 2008 at 2:14 pm

  3. Excellent post Enrico.

    Cormac

    August 24, 2008 at 10:58 pm

  4. Very nice but it’s a pity that it doesn’t work in Firefox 3 :(

    aurin

    September 15, 2008 at 5:11 pm

  5. Right, for a security block on the chrome url :(

    agglompress

    September 15, 2008 at 7:31 pm

  6. it gives a security alert on IE if you include it on the https:// application
    Is there any way to avoid it?

    kunal

    September 17, 2008 at 1:00 am

  7. I got a solution for that I check for the browser and then adds the if it is Firefox. But now I am struggling with Firefox 3…… Did anyone find a solution to it? Please share if you did.

    Kunal

    September 19, 2008 at 11:09 pm

  8. Unfortunately we didn’t found any, as well as chrome url is locked in FF 3 for security purposes. We are going to modify our addon in order to inject a javascript property inside the original document property, in order to check that. Anything better?

    agglompress

    September 20, 2008 at 11:47 am

  9. Hi Enrico, any plans for C#/.NET related posts? ;)

    Andrew

    September 21, 2008 at 10:16 pm

  10. We are using a small self-writen add-on to enter sites which can use ntml-authentification. With FF2 we are using the trick with image as shown above. But now we wonder what we can do with FF3. Is there any way to find out if an add-on is already installed and what version it has?
    Can you please provide us with a code-snippet?

    gerd

    December 8, 2008 at 8:03 pm


Leave a Reply