Mozilla VPN is currently experiencing an outage. Our team is actively working to resolve the issue. Please check the status page for real-time updates. Thank you for your patience.

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

cannot debug addon

  • 5 replies
  • 1 has this problem
  • 18 views
  • Last reply by admin101

more options

Hi,

Thanks to Mozilla for continuing to develop such a clean browser, with movies made of GIF instead of much larger files.

So we have developed an extension or add-on for many years using the same method. But recently ( maybe I forgot ), with a new developer profile, I am unable to edit any files because the .xpi extension in the extensions folder, is compressed and cannot be navigated in a file Explorer.

In the past, I just install the extension and change the file extension from .xpi to .zip, and then extract into a folder with the same name. Then delete the .xpi/.zip folder, and the new folder acts as a pointer for the same instance of installation. And I can just modify the files in that folder usually and I don't need to restart the browser to see the changes. But lately I cannot do this.

What is the best way to debug the add-on with the least number of steps?

Thanks,

Josh

Hi, Thanks to Mozilla for continuing to develop such a clean browser, with movies made of GIF instead of much larger files. So we have developed an extension or add-on for many years using the same method. But recently ( maybe I forgot ), with a new developer profile, I am unable to edit any files because the .xpi extension in the extensions folder, is compressed and cannot be navigated in a file Explorer. In the past, I just install the extension and change the file extension from .xpi to .zip, and then extract into a folder with the same name. Then delete the .xpi/.zip folder, and the new folder acts as a pointer for the same instance of installation. And I can just modify the files in that folder usually and I don't need to restart the browser to see the changes. But lately I cannot do this. What is the best way to debug the add-on with the least number of steps? Thanks, Josh

Chosen solution

admin101 said

For example, these days I have to edit the JavaScript file, CTR+S, then open new Mozilla developer edition, open the debugging tab, then click the open temporary add-on, then select the file, check the operation of the add-on.

Once you temporarily load the extension via about:debugging, after modifying any of its source files, you just have to click the Reload button to reload the extension. (See attached screenshot.)

Read this answer in context 👍 0

All Replies (5)

more options

You should be able to point to a given file inside a folder (unzipped/compressed) with the appropriate contents (manifest.json, js, icon/48.png) to load an addon temporarily, then you can just reload it each time you make changes to those files? per https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension (obviously this isn't your first but details this method)

In about:debugging#/runtime/this-firefox

I think that'd be simplest, but someone might have a better method.

more options

Hi evhenry,

Thanks for the support.

Yes I know about loading the add-on from there, but it just seems quite cumbersome to keep reloading.

Josh

Modified by admin101

more options

For example, these days I have to edit the JavaScript file, CTR+S, then open new Mozilla developer edition, open the debugging tab, then click the open temporary add-on, then select the file, check the operation of the add-on.

Previously, after editing the JavaScript file, CTR+S, ALT+TAB to Mozilla developer edition, then check the operation of the add-on.

more options

Chosen Solution

admin101 said

For example, these days I have to edit the JavaScript file, CTR+S, then open new Mozilla developer edition, open the debugging tab, then click the open temporary add-on, then select the file, check the operation of the add-on.

Once you temporarily load the extension via about:debugging, after modifying any of its source files, you just have to click the Reload button to reload the extension. (See attached screenshot.)

more options

admin101 said

For example, these days I have to edit the JavaScript file, CTR+S, then open new Mozilla developer edition, open the debugging tab, then click the open temporary add-on, then select the file, check the operation of the add-on. Previously, after editing the JavaScript file, CTR+S, ALT+TAB to Mozilla developer edition, then check the operation of the add-on.

Thanks! That's very helpful.