{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 我只想做你的唯一 的问题《Firefox Add-on SDK: port.on() / port.emit() disrup》','https://www.manongdao.com/q-950419.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I'm working on a firefox addon using the Add-on SDK, in that addon i have a content-script (in a sidebar) communicating with the main addon script using the port.on() and port.emit() as described here in the Add-on SDK documentation. port.on() / port.emit() work fine until i create an iframe in the sidebar (via the sidebar's content script). Once the iframe is added communication between the content-script and the main addon script no longer work via port.emit()/port.on()
i've created a simple example to demonstrate the issue, when the addon button is clicked it opens the sidebar. inside the sidebar i have a couple of kedown events for testing, when i press "r" it emits a message back to the main addon script which prints 'im here' to the console ( this works perfectly ), when i press 't' it creates an iframe and adds it to the sidebar.html body. once this happens pressing "r" no longer prints 'im here' to the console
here is the main addon script:
var buttons = require('sdk/ui/button/action');
var sidebars = require("sdk/ui/sidebar");
var wrkrs = []; // holds workers
var button = buttons.ActionButton({
id: "tester",
label: "tester",
icon: {
"32": "./icons/icon-32.png",
"48": "./icons/icon-48.png",
"64": "./icons/icon-64.png",
"96": "./icons/icon-96.png"
},
onClick: function(state){
sidebar.show();
}
});
var sidebar = sidebars.Sidebar({
id: 'test',
title: 'test',
url: "./sidebar.html",
onReady: function(worker){
wrkrs.push(worker);
worker.port.on('talk',function(msg){
console.log('communication:', msg );
})
},
onDetach: function(worker) {
var index = wrkrs.indexOf(worker);
if(index != -1) wrkrs.splice(index, 1);
}
});
here is the sidebar.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1> this is the sidebar </h1>
<p>
hurray!!!!!!
</p>
<script src="sidebar.js"></script>
</body>
</html>
and here is the sidebar.js content-script
function test(){
var test = document.createElement('iframe');
document.body.appendChild( test );
}
document.body.addEventListener('keydown',function(e){
switch(e.key){
case "r" : addon.port.emit('talk','im here!'); break;
case "t" : test(); break;
}
});
UPDATE:
i've noticed that if i create a new variable and assign the global addon object to it like this:
var addon2 = addon;
then after inserting the iframe, this stops working (which is my problem):
addon.port.emit('talk','im here!');
but this seems to work fine!?!?!
addon2.port.emit('talk','im here!');
...which makes no sense to me. this might be a work-around for my problem, but it seems a bit kludgey and makes me nervous