about:debugging (before Firefox 68)

La page about:debugging vous fournit une place ou vous pouvez attacher les outils de développeurs de Firefox a un nombre de debugging targets. En ce moment, il soutien trois sortes principales de target: restartless add-ons, tabs, et workers.

Ouvrir la page about:debugging

Ils y a plusieurs façons d’ouvrir la page about:debugging:

  • Cliquez "about:debugging" dans la barre URL de Firefox.
  • Dans Tools > Web Developer menu, cliquez sur "Service Workers".
  • Sélectionnez Web Developer menu sous menu Hamburger (), puis sélectionnez "Service Workers".

Quand about:debugging ouvre, a votre gauche, vous allez voir une barre latérale permettant de basculer entre les deux vues principales: une pour add-ons et une pour workers.

Que system add-ons apparaisse ou non dans la liste sur cette page dépends sur les configurations de préférences de devtools.aboutdebugging.showSystemAddons. Si vous devez voir system add-ons, naviguez ver about:config et assurez-vous que la valeur est réglée sur true.

Add-ons

La section Add-ons dans about:debugging soutien seulement les restartless add-ons, en incluent basic bootstrapped extensions, Add-on SDK add-ons, et WebExtensions.

Cette page vous permet de faire deux choses :

  • Charger un add-on temporairement d’un disque
  • Connectez l’Add-on Debugger a tout restartless add-ons

Connecter l’Add-on Debugger

NNotez qu’en ce moment, il est recommandé d’utiliser le Browser Toolbox, pas l’Add-on Debugger, pour le débogage de WebExtensions. Regardez Debugging WebExtensions pour plus de détails.

La page Add-ons dans about:debugging vous donnes une liste de tous les restartless add-ons qui sont actuellement installés (notez que cette liste pourrait avoir des add-ons inclus qui sont venus préinstaller avec votre Firefox). À côté de chaque entrée est un bouton appeler "Debug".

Si le bouton "Debug" est désactivé, cocher la boite "Enable add-on debugging".

Si vous cliquez "Debug", vous allez voir un dialogue vous demandant d’accepter une connexion entrante. Cliquez "OK", et Add-on Debugger va commencer dans une fenêtre séparée. Notez que parfois la fenêtre débogueur est cacher par la fenêtre principale de Firefox.

Allez voir la page sure Add-on Debugger pour toutes les chose vous pouvez faires avec cet outil.

Le bouton "Enable add-on debugging" fonctionne en allumant les preferences devtools.chrome.enabled et devtools.debugger.remote-enabled. Les deux préférences doivent être true pour activer add-on debugging. Cocher la boite définit les deux préférences sur true, et décocher les définit sur false.

Vous pouvez aussi modifier les préférences directement dans about:config, ou par cocher "Enable browser chrome and add-on debugging toolboxes" et "Enable remote debugging" dans Developer Tools Settings.

Charger un add-on temporaire

Avec le bouton "Load Temporary Add-on" n’importe quelle sorte de restartless add-on temporairement, à partir d’un répertoire sur disque. Il suffit de cliquer le bouton, naviguer ver le répertoire contenant le fichier add-on's, et sélectionner n’importe quel fichier dans ce répertoire. L’add-on temporaire sera afficher sous l’en-tête "Temporary Extensions".

Vous n’avez pas à emballer ou à signer l’add-on. L’add-on restera installer jusqu’au redémarrage de Firefox.

Les gros avantages de cette méthode, comparer à installer un add-on d’un XPI, sons:

  • Vous n’avez pas à reconstruire un XPI et le réinstaller quand vous changez le code d’add-on's
  • Vous pouvez charger un add-on sans le signer et sans le besoin de désactiver signing.

Modifier un add-on temporaire

Si vous installez l’add-on de cette façon, que-ce passe t’il quand vous modifiez les fichiers add-on’s ?

Avant Firefox 48

  • Si vous modifiez des fichiers charger à la demande, comme content scripts ou popups, les modifications que vous faites sont détectés et ramassés automatiquement, et vous les verrez la prochaine fois le script de contenu est charger ou le popup se montre.
  • Si vous modifiez des fichiers qui restent chargés tout le temps, comme background vous pouvez trouver les changements vous avez faites par désactiver et réactiver l’add-on dans la page about:addons.
  • Si vous modifiez des fichiers qui sont analyses qu’à l’installation, comme le fichier  manifest.json, vous allez devoir recommencer Firefox, et puis charger l’add-on encore.

Notez qu’avant Firefox 48, charger l’add-on encore par appuyant "Load Temporary Add-on" sans recommencer Firefox ne fonctionne pas.

A partir de Firefox 48

De Firefox 48 et plus tard:

  • Comme avant: Si vous modifiez des fichiers charger à la demande, content scripts ou popups, les modifications sont détectées et ramassées automatiquement, et vous les verrez la prochaine fois le script de contenu est charger ou le popup se montre.
  • Il y a une meilleure façon de gérer les autres cas: cliquez le bouton "Reload" à côté du bouton "Debug". Cela fait ce qu’il dit:

Notez que dans Firefox 49 et plus tard, le bouton Reload est seulement activer pour les add-ons temporaire. Il va être désactiver pour tout autre add-ons.

Tabs

Dans Firefox 49 et plus tard, une page Tabs est disponible dans about:debugging — cela vous donne une liste complète de tous les onglets débogables ouverts dans l’instance courent Firefox.

Chaque entrée tab à un bouton Debug à-côté — quand cliquer, ceci va ouvrir un toolbox spécifique à l’onglet, vous permettant de déboguer les contenus de cet onglet.

Notez que cette fonctionnalité n’est pas immédiatement utile pour le débogage des onglets desktop— vous pouvez ouvrir le toolbox pour déboguer un onglet déjà assez facilement— mais cela va devenir beaucoup plus utile quand about:debugging commence le support pour remote debugging, et cette page peut commencer à lister les onglets disponibles pour le débogage sur navigateurs mobiles, des simulateurs, etc. allez voir bug 1212802 pour les nouvelles sur ce domaine.

Workers

La page Workers vous montre vos workers, categoriser come suit:

Vous pouvez connectez les outils de développeurs à chaque worker, et envoyer des notifications push au service workers.

État de service worker

A partir de Firefox 52, la liste de service workers vous montre l’état du service worker dans son lifecycle. Trois états sont distingués:

  • "Registering": ceci couvre tous les états entre l’enregistrement initiale du service worker, et son contrôle des pages. C’est-à-dire, qu’il englobe les états "installing", "activating", et "waiting".
  • "Running": le service worker est actuellement en-marche. Il est installé et activer, et gère des évènements en ce moment.
  • "Stopped": le service worker est installer et activer, mais a été terminer apprêt avoir été inactif.

Cette section utilise une démo simple de ServiceWorker, hébergé a  https://serviceworke.rs/push-simple/.

Débogage de workers

Pour un service worker, s’il est déjà en-marche, vous allez voir deux boutons à-côté, étiquetés "Debug" et "Push". S’il n’est pas déjà en-marche, vous verrez un bouton, étiqueté "Start": cliquez dessus pour commencer le service worker.

Cliquer "Debug" connecte le Débogueur JavaScript et Console a ce worker. Vous pouvez définir des points d’arrêt, step through code, watch variables, evaluate code, etc:

Enregistrement des workers

Premièrement, vous n’allez voir aucun worker lister sous Service Workers ou Shared Workers. Aussitôt qu’un worker est enregistrer, la liste est mis-a-jour:

Avant Firefox 47, les service workers se montrais seulement quand ils étaient actuellement en marche.

Désinscrire les service workers

Nouveaux dans Firefox 48.

A partir de Firefox 48, vous allez voir un lien appeler "unregister" à-côté de chaque service worker enregistrees:

Cliquez le lien pour désinscrire le service worker.

Envoyer des évènements-push a des service workers

Envoyer des evenements-push dans about:debugging est nouveau dans Firefox 47.

Pour déboguer les notifications push, vous pouvez définir un point d'arrêt dans le listener push event. Pourtant, vous pouvez aussi déboguez les notifications push localement, sans le besoin d’un server. Juste cliquez sur le bouton "Push" pour envoyer un évènement push au service worker:

Service workers pas compatibles

Dans Firefox 49+, un message d’avertissement va être afficher dans la section Service Workers dans la page Workers si les service workers ne sont pas compatibles avec les configurations actuelles du navigateur, et donc ne peuvent pas être utiliser ou déboguer.

Des Service workers peuvent être indisponible pour plusieurs raisons:

  • Si vous utilisez une fenêtre Private Browsing.
  • Si vos preferences d’Historique sont mis a "Never Remember History" ou "Always use private browsing mode".
  • Si la préférence de dom.serviceWorkers.enable est réglé sur false dans about:config.