How to know if panel i showing

Question

So. I'm having some issues where my panel is not always displaying (though it seems the rest of the add-on is still working). I'm trying to write some logs to find out why this is happening, but there are some things I don't really understand.

To experiment I made a simple add-on as such

// main.js
const panels        = require("panel");
const {Cc, Ci}      = require("chrome");
const widgets       = require("widget");

var my_widget = widgets.Widget({
    id: "google-link",
    label: "Click me",
    contentURL: "http://google.com/favicon.ico",
    width: 20,
    height: 20,
    panel: my_panel,
    onClick: function() {
        my_panel.show();
        console.log('Panel displaying? ' + my_panel.isShowing);
    }
});

var my_panel = panels.Panel({
    width: 500,
    height: 500,
    contentURL: "http://google.com",
});

my_panel.port.on("show", function() {
    console.log('Panel emitted show');
});

What happens is firstly: the isShowing is always false, even when I clearly see the panel. And the show event never seems to get triggered (I'm really looking to catch the error event, but this is just to find events in the first place).

The fine print: This is using SDK 1.6.1 and Firefox 10ESR. Perhaps this is something that is solved in later versions, I don't know. Either way I'd like to know if I'm thinking right here.

Answer 1

Your code is not quite right, see this variation:

// main.js
const panels        = require("panel");
const {Cc, Ci}      = require("chrome");
const widgets       = require("widget");

var my_widget = widgets.Widget({
    id: "google-link",
    label: "Click me",
    contentURL: "http://google.com/favicon.ico",
    width: 20,
    height: 20,
    panel: my_panel,
    onClick: function() {
        my_panel.show();
        // this is false because the panel is shown asynchronously
        console.log('Panel displaying? ' + my_panel.isShowing);
    }
});

var my_panel = panels.Panel({
    width: 500,
    height: 500,
    contentURL: "http://google.com",
});

// there is no port property on panel
my_panel.on("show", function() {
    console.log('Panel emitted show');
    // this is true...
    console.log('Panel displaying? ' + my_panel.isShowing);
});

The code is here:

https://builder.addons.mozilla.org/package/161691/latest/