If you are looking for information on the about:debugging page as it existed before Firefox 68, please go to: about:debugging (before Firefox 68) for more information. This page now covers the about:debugging page as it is in Firefox 68 and later.
Since at the time of updating this page, Firefox 68 has not been released, some of the images will show Firefox Developer Edition.
The about:debugging page provides a single place from which you can attach the Firefox Developer Tools to a number of debugging targets. At the moment it supports three main sorts of targets: restartless add-ons, tabs, and workers.
Opening the about:debugging page
There are two ways to open about:debugging:
- Type "about:debugging" in the Firefox URL bar.
- In the Tools > Web Developer menu, click "Service Workers".
When about:debugging opens, on the left-hand side, you'll see a sidebar with two options and information about your remote debugging setup:
- Use the Setup tab to configure the connection to your remote device.
- This Firefox
- Provides information about temporary extensions you have loaded for debugging, extensions that are installed in Firefox, the tabs that you currently have open, and service workers running on Firefox.
Connecting to a remote device
Note: At the moment, it's recommended that you use the Browser Toolbox, not the Add-on Debugger, for debugging WebExtensions. See Debugging WebExtensions for all the details.
The Add-ons section in about:debugging lists all web extensions that are currently installed. Next to each entry is a button labeled Inspect. If the Inspect button is disabled, make sure that "Enable extension debugging" is checked.
Note: This list may include add-ons that came preinstalled with Firefox.
If you click Inspect, you'll see a dialog asking you to accept an incoming connection. Click "OK", and the Add-on Debugger will start in a separate window. Note that sometimes the debugger window is hidden by the main Firefox window.
See the page on the Add-on Debugger for all the things you can do with this tool.
The "This Firefox" tab combines the features of Add-ons, Tabs, and Workers into a single tab that has been divided into the following sections:
- Temporary Extensions
- Displays a list of the extensions that you have loaded using the Load Temporary Add-on... button.
- This section lists information about the extensions that you have installed on your system.
- Service Workers, Shared Workers, and Other Workers
- There are three sections on this page that deal with Service Workers, Shared Workers, and Other Workerss.
Whether or not internal extensions appear in the list on this page depends on the setting of the
devtools.aboutdebugging.showHiddenAddons preference. If you need to see these extensions, navigate to
about:config and make sure that the preference is set to
Loading a temporary extension
With the "Load Temporary Add-on..." button you can temporarily load a web extension from a directory on disk. Click the button, navigate to the directory containing the add-on and select its manifest file. The temporary extension will be displayed under the "Temporary Extensions" header.
You don't have to package or sign the extension and it will stay installed until you restart Firefox.
The big advantages of this method, compared with installing an add-on from an XPI, are:
- you don't have to rebuild an XPI and reinstall when you change the add-on's code
- you can load an add-on without signing it and without needing to disable signing.
Once you have loaded a temporary extension, you will see the following information about it:
- Loads the extension in the debugger.
- Reloads the temporary extension. This is handy when you have made changes to the extension.
- Unloads the temporary extension.
Other information about the extension is included as well:
- The location the extensions source code on your local system
- Extension ID
- The temporary id assigned to the extension.
- Internal UUID
- The internal UUID assigned to the extension.
- Manifest URL
- If you click the link, the loaded manifest for this extension is loaded in a new tab.
Updating a temporary extension
If you install an extension in this way, what happens when you update the extension?
- If you change files that are loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is loaded or the popup is shown.
- For other changes, click the "Reload" button next to the "Debug" button. This does what it says:
The permanently installed extensions are listed in the next section, Extensions. For each one, you will see something like the following:
Just as it does with temporarily loaded extensions, the link next to Manifest URL will open the loaded manifest in a new tab.
The Workers page shows your workers, categorised as follows:
- All registered Service Workers
- All registered Shared Workers
- Other workers, including Chrome Workers and Dedicated Workers
You can connect the developer tools to each worker, and send push notifications to service workers.
Service worker state
The list of service workers shows the state of the service worker in its lifecycle. Three states are possible:
- "Registering": this covers all states between the service worker's initial registration, and its assuming control of pages. That is, it subsumes the "installing", "activating", and "waiting" states.
- "Running": the service worker is currently running. It's installed and activated, and is currently handling events.
- "Stopped": the service worker is installed and activated, but has been terminated after being idle.
This section uses a simple ServiceWorker demo, hosted at https://serviceworke.rs/push-simple/.
Unregistering service workers
The Unregister button allows you to "unregister" the service worker:
Sending push events to service workers
To debug push notifications, you can set a breakpoint in the push event listener. However, you can also debug push notifications locally, without needing the server. Click the "Push" button to send a push event to the service worker.
Service workers not compatible
A warning message will be displayed at the top of the This Firefox tab if service workers are incompatible with the current browser configuration, and therefore cannot be used or debugged.
Service workers can be unavailable for several reasons:
- If you are using a Private Browsing window.
- If your History preference is set to "Never Remember History" or "Always use private browsing mode".
- If the
dom.serviceWorkers.enablepreference is set to false in