Earlier than we get began
Firefox helps browser extensions like Chromium-based browsers (Chrome, Arc, Courageous, Edge and many others.). Typically they’re known as add-ons in Firefox land.
This publish assumes that you’re debugging a browser extension you’re constructing, i.e. have the supply code for and may construct it regionally.
It’s additionally assumed that the Firefox add-on has been constructed, i.e. generated the recordsdata, together with a manifest for the add-on to work.
The next directions work for Firefox and Firefox Deveoper Edition.
Setup Firefox for debugging an add-on
-
Open the browser DevTools and click on on the three dots button, then choose settings.
-
Scroll right down to the Superior Settings part and guarantee Allow browser chrome and add-on debugging toolboxes is checked.
-
Load the add-on by clicking on the puzzle icon within the prime proper of Firefox or through the appliance menu, Instruments -> Add-ons and Themes
-
Click on on the cog icon to open the menu and choose Debug Add-ons
-
Make sure you constructed the extension with the adjustments in my department by working
npm run construct
-
Click on on the Load Non permanent Add-on... button
-
Choose the manifest file of the add-on from the OS file menu and click on the Open button.
-
The extension is now prepared to be used.
-
Navigate to a GitHub web page the place you need to begin debugging the remaining points with the Firefox add-on
-
If you wish to debug or examine the extension, click on the Examine button from the Non permanent Extensions part the place the extension was simply loaded.
And that’s it!
Photograph by Birger Strahl on Unsplash