Javascript detects if browser extension is installed

There is no easy or standard way for all browsers, but it is possible to use Javascript to detect if certain extension is installed or not. Today I quickly looked at Chrome/Firefox/Safari for this requirement (the list below is also in this browser order).

List all installed extensions
chrome://extensions
about:addons
Safari->Preference->Extensions

Find installed extensions on Mac OSX
~/Library/Application Support/Google/Chrome/Default/Extensions/
~/Library/Application\ Support/Firefox/Profiles/[profile name]/extensions/
~/Library/Safari/Extensions

Image URL to detect if extension is installed
chrome-extension://[extension-id]/[image_file], I am not sure if chrome needs web_accessible_resources in manifest.json. However, something like chrome-extension://hojdhekmpemkfjblemnmefjjocededbe/image.png always works even when the extension is disabled.

chrome://[extension-name]/content/[image_file], firefox needs contentaccessible=yes in chrome.manifest and also needs the extension is enabled.

Unfortunately I could not find how to use image URL for Safari (safari.extension.baseURI is a dynamic value after safari restart). One possible way is to inject a HTML node from extension to your target website, if you have control of the extension source code.

How to do image URL based detection?
In your website, add one hidden image element
hidden_img.addEventListener("load", function(e){
   console.log('extension installed');
}, false);
hidden_img.addEventListener("error", function(e){
   console.log('extension not installed');
}, false);

Browser extension

crossrider.com is an interesting one to support creating cross browser extensions in minutes. The write once, run everywhere concept is very promising like phonegap for mobile web development. I have not tried it out, but recently I work on building, packaging and hosting browser extensions. I have some notes to share.

First thing comes first,  what is a browser extension? From wikipedia, a browser extension is a computer program that extends the functionality of a web browser in some way. Depending on the browser and the version, the term may be distinct from similar terms such as plug-in or add-on. The programming language can be native or web language Javascript/CSS/HTML. Today I will quickly go through the build/package/auto-updata/hosting of Chrome Extension and Safari Extension.

Chrome:
http://developer.chrome.com/extensions/docs.html has all the details about how to develop Chrome extension. My note is:
Build: grunt.js (which will do source code minification, image optimization, copy etc)
Package: chrome://extensions -> pack extension...
Hosting: Chrome web store, or self-hosted web site
Auto-update: manifest.json versioning (Chrome web store)

Safari:
http://developer.apple.com/library/safari/#documentation/Tools/Conceptual/SafariExtensionGuide has all the details about how to develop Safari extension. My note is:
Build: grunt.js (which will do source code minification, image optimization, copy etc). Note that Icon.png should have alpha channel.
Package: Safari -> Develop -> Show Extension Builder, where can package (need apple developer ID before build safari extension)
Hosting: Safari extension gallery or self-hosted web site
Auto-update: Update manifest URL in Info.plist (or Safari extension Gallery?)

Firefox:
https://developer.mozilla.org/en-US/docs/Extensions has all the details about how to developer Firefox Extension (one of Add-on types). However, many information is for old Firefox 1.5, 2.0, 3.0 etc. Look forward to seeing updated documents because as of today latest Firefox version is 19. Also Firefox provides more possible ways (Add-on Bar, Toolbar, Menu etc) to develop extension. It has flexibility, but may also confuse developers/users.
My note is:
Build: grunt.js
Package: xpi is a zip file
Hosting: AMO ( http://addons.mozilla.org) is preferred or you can host on your own website.
Auto-update: If you host your extension on AMO, just leave out the updateURL completely in install.rdf. AMO provides secure updates automatically.

Opera:
TBD

Internet Explorer:
TBD