This extension allows using Google Chrome extensions inside Firefox. The aim is to try to reduce the gap for the development of cross-browser extensions.

The first example is the « readme » extension, installed by default in Google Chrome extensions manager. With the same code, this chrome extension works in Firefox & Chrome in the same way.

Since it’s just a preview release, everything isn’t as polish as I want but you can already test extensions published on the Google chrome extension website, or try to development your own.

You can find it here or here, and I’m waiting for your feedback. You can find more information here.

Some screenshots :

browser action of "readme" Chrome extension

extensions management page

A cette occasion j’ai developpé une petite démo WebGL à partir des tutoriaux grâcieusement fournis sur le blog Learning Web.

Pour voir la démo pour la Cantine, ça se passe ici…

Télécharger Chromium

Tout d’abord il faut télécharger la version de développeur de Chrome. La compilation du projet n’étant pas très simple d’accès (c’est peu de le dire), nous irons récupérer directement un installeur. Heureusement il existe un dépôt qui offre des versions compilées du navigateur, mis à jour très fréquemment. Ça se passe ici : http://build.chromium.org/buildbot/snapshots/.
Pour l’instant seul la version Windows supporte le système d’extension. Il suffit dans d’aller dans le dossier « chromium-rel-xp » et récupérer le fichier « mini_installer.exe » de la version la plus récente.
Chromimum s’installe dans les « Documents and Settings » de l’utilisateur courant sous Windows Xp. Par exemple « C:\Documents and Settings\matoeil\Local Settings\Application Data\Chromium\Application\chrome.exe »

Créer son extension Chromium

Cette partie est reprise du tutoriel présent sur le site de chromium et adaptée.

1. Créez un dossier sur votre ordinateur qui va contenir le code de votre extension. Pour ce tutoriel, nous supposerons que le dossier en question sera « c:\myextension », mais il peut être placé n’importe où.
2. Dans ce dossier, créez un fichier texte nommé « manifest.json » et écrivez dans celui-ci:

   {
     "name": "Ma première Extension",
     "version": "1.0",
     "description": "La première extension que je fais.",
     "toolstrips": [
      "my_toolstrip.html"
     ]
   }

   Note : Attention à bien encoder les fichiers en UTF-8

3. Ajoutez dans le dossier un fichier texte nommé « my_toolstrip.html » et mettre le code suivant dans celui-ci:

   <div class="toolstrip-button">
       <span>Hello, World!</span></div>

4. Trouvez le raccourci Chromium (par exemple, faites un clic-droit sur l’icône Chromium placé sur votre bureau et choississez « Propriétés ») et ajoutez dans ces paramètres de lancement « –enable-extensions » et « –load-extension ». Par exemple :
   chrome.exe –enable-extensions –load-extension= »c:\myextension »
5. Rédémarrer Chromium. Vous devriez voir apparaître votre bouton dans une nouvelle barre d’outils présent dans le bas de la fenêtre de votre navigateur.
6. Vous voulez peut-être que le bouton fasse quelque chose? Ok, créez un nouveau fichier texte, toujours dans le même dossier, et nommez-me « hello_world.html », et mettre ce code dedans.
7. Maintenant changez le code dans « my_toolstrip.html » pour qu’il ressemble à cela:

   <div class="toolstrip-button" onclick="window.open('hello_world.html')">
       <span>Hello, World!</span></div>

8. Redémarrez Chromium et cliquez sur le bouton.
9. Vous pouvez faire une petite dance, vous venez de créer votre première extension Chromium

Vous trouverez ici tous les fichiers de cette extension.