Firefox add-on : extension icon not showing

Question

I'm working on developing a Firefox add-on using the Add-on SDK. My extension is working fine when using SDK, but when I create the .xpi file to add it manually to the browser, it does not show the extension icon.

I tried to change the icon path in the package.json file, but still it didn't shows the icon.

package.json file:

{...
  "icon"        : "Phone-icon48.png",
  "icon64"      : "Phone-icon64.png",
...}

Widget panel used to display icon:

WidgetPackage.Widget({
  label: "Phone Dial",
  id: "phone_dial",
  contentURL: data.url("images/Phone-icon19.png"),
  panel: panel_name
});

Can anyone help me resolve the issue?

Thank You.

Answer 1

This may be a persistent bug. This thread reports a similar problem.

Ah - here is the solution. You put your icons in a folder called data in the root of your addon's directory and call them as if they were in root.

{...
    icon: { "16": "./icon-16.png", "32":"./icon-32.png", "64": "./icon-64.png" },
...}

When I did this then the icons show up in the toolbars. It isn't very clear, but if you piece things together, you might deduce that from here.

Answer 2

A seemingly related issue was closed earlier, yet it happens to me today

A workaround with jpm 1.1.4 and Firefox 48/50:

• Name the icon icon.png and place it in root dir of addon.
• Write no "icon": ... entry in package.json (thus no <em:icon> in install.rdf)

Answer 3

According to Addon SDK docs:

The relative path from the root of the add-on to a PNG file containing the icon for the add-on. Defaults to "icon.png".

So your package.json should look like this:

{...
  "icon"        : "data/images/Phone-icon48.png",
  "icon64"      : "data/images/Phone-icon64.png",
...}