web-dev-qa-db-fra.com

Quelle est la façon la plus simple de développer l'extension Firefox?

Je prévois de développer une simple extension Firefox qui raccourcira l'URL d'un onglet actuellement actif, affichera une fenêtre contextuelle avec l'URL raccourcie et la placera dans le presse-papiers.

Dans Google Chrome, ce serait assez facile (selon http://developer.chrome.com/extensions/getstarted.html ) - JavaScript pur plus quelques appels aux API JavaScript d'interaction avec l'interface utilisateur du navigateur.

Cependant, après avoir cherché un bon tutoriel sur les extensions Firefox, les liens les plus officiels que j'ai trouvés sont:

Selon eux, il semblerait que je devrai apprendre le langage XUL, même pour les interactions les plus simples avec l'interface utilisateur du navigateur. En plus de cela, je devrai configurer un profil Firefox personnalisé afin de ne pas gérer mon profil par défaut pendant le développement, créer une structure de répertoire compliquée, écrire un manifeste en XML obscur, comprendre comment empaqueter et tester tout ce que j'implémente, etc.

Nous sommes en 2013, n'y a-t-il pas un moyen plus simple de créer des extensions Firefox?

javascriptgoogle-chromefirefoxfirefox-addonfirefox-addon-sdk
60
dorserg

Nous sommes en 2013, n'y a-t-il pas un moyen plus simple de créer des extensions Firefox?

Oui, il y en a!

Les liens que vous avez fournis dans la question sont incroyablement obsolètes. Il existe une nouvelle façon, bien meilleure, de développer des extensions Firefox - SDK du module complémentaire Firefox .

Cependant, il est assez difficile de tomber dessus en recherchant simplement sur Google le didacticiel sur les modules complémentaires de Firefox. Je suis étonné que Mozilla n'en fasse pas de publicité plus agressive, ou du moins le mentionne sur les pages que vous avez trouvées.

Étapes pour commencer (Mac/Linux, mais devrait être assez similaire pour PC):

  • Téléchargez le SDK depuis https://addons.mozilla.org/en-US/developers/builder , décompressez-le.
  • Parcourez rapidement le fichier README (toujours utile).
  • Exécutez source bin/activate depuis le répertoire du SDK (le même répertoire que le README se trouve)).
  • Exécutez cfx docs - ce bootstraps copie locale de SDK docs et l'ouvre dans votre navigateur.
  • Laissez le répertoire SDK, créez un répertoire vide pour votre extension.
  • Exécutez cfx init dans le répertoire d'extensions - cela génère tous les fichiers/répertoires nécessaires.
  • Suivez le reste de mise en route-avec-cfx page:
    • Mise à jour lib/main.js avec seulement quelques lignes de JS pour placer un widget personnalisé sur la barre des modules complémentaires.
    • Exécutez cfx run - cela ouvre une nouvelle instance de Firefox avec votre nouvelle extension brillante.

Dans l'ensemble, il ne m'a fallu que quelques heures pour lire la documentation, se familiariser avec les API du SDK, trouver le SDK module pour placer un widget sur une barre de navigation au lieu d'une barre d'extension, et développer une extension entièrement fonctionnelle dans environ 50 lignes de JavaScript.

HTH!

Mise à jour

Il existe une nouvelle norme, appelée WebExtensions

De MDN

Il existe actuellement plusieurs outils pour développer des modules complémentaires pour Firefox, mais WebExtensions deviendra la norme d'ici la fin de 2017.

Si vous écrivez un nouveau module complémentaire, nous vous recommandons d'écrire une WebExtension .

72
dorserg

Oui, vous pouvez utiliser trois techniques différentes pour créer des extensions:

  1. Extensions basées sur SDK complémentaires
  2. extensions sans redémarrage démarrées manuellement
  3. extensions de superposition

Vous pouvez lire la comparaison entre ici

Si vous le pouvez, il est conseillé d'utiliser le SDK du module complémentaire, qui utilise le mécanisme d'extension sans redémarrage mais simplifie certaines tâches et nettoie après lui-même. Si le SDK du module complémentaire ne suffit pas à vos besoins, implémentez une extension manuelle sans redémarrage à la place.

Étapes pour commencer avec Extensions basées sur SDK

  1. Installation
  2. Créer des interfaces utilisateur
  3. Interagir avec le navigateur
9
Subodh Ghulaxe

À partir du https://blog.mozilla.org/addons/2016/11/23/add-ons-in-2017/ , la seule façon d'aller de l'avant sera d'utiliser WebExtensions . Les dernières extensions du SDK seront acceptées pour Firefox 52, tandis que Firefox 57 mettra fin à toutes les autres extensions , prenant en charge uniquement les extensions Web.

Firefox a copié l'API d'extension de Google Chrome. Vous pouvez donc utilisez simplement votre Chrome et voyez si toutes les API sont déjà prises en charge dans Firefox (elles devraient l'être dès maintenant). Des programmeurs tels que NoScript 's Giorgio Maone soutiennent activement le changement vers WebExtensions .

Pour développer une WebExtension, vous avez besoin

  • soit le web-ext- outil qui peut être installé via

    npm install --global web-ext

  • ou utilisez simplement about:debugging ou de Chrome chrome:extensions pour charger temporairement l'extension Web.

Quoi qu'il en soit, vous avez besoin d'un manifest.json fichier dans un répertoire que vous avez créé, qui colle toutes les fonctionnalités ensemble. Voir https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Your_first_WebExtension pour un premier exemple. Ou les documents Google sur https://developer.chrome.com/getstarted .

8
serv-inc

Il existe deux façons officielles pour développer des modules complémentaires, chacun d'eux a ses avantages et ses inconvénients:

1- WebExtensions (nouvelle méthode):

Les extensions Web sont l'avenir des modules complémentaires de Firefox. Si vous pouvez utiliser l'API WebExtensions, c'est le meilleur choix. Vous pouvez développer et publier des extensions Web dès maintenant, mais elles sont encore à un stade précoce.

2- SDK complémentaire (ancienne méthode):

Le SDK du module complémentaire fournit des API pour développer des modules complémentaires Firefox et un outil pour les développer, les tester et les empaqueter.

4
iraj jelodari

J'ai fait un tutoriel sur le développement d'extensions à l'aide du SDK du module complémentaire Firefox:

Comment développer une extension Firefox avec le SDK addon

3
ejectamenta