Делаю расширение под google chrome.
По нажатию на кнопку расширения встраиваю в содержимое текущей открытой страницы дополнительный код:
chrome.extension.onConnect.addListener(function(port) {
port.onMessage.addListener(function() {
if(!document.getElementById("yImgDropBox")) {
// jquery
var jqscript = document.createElement("script");
jqscript.setAttribute("type", "text/javascript");
jqscript.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js");
document.getElementsByTagName("head")[0].appendChild(jqscript);
// плагин
var dbscript = document.createElement("script");
dbscript.setAttribute("type", "text/javascript");
dbscript.setAttribute("src", chrome.extension.getURL("dropbox.js"));
document.getElementsByTagName("head")[0].appendChild(dbscript);
// стиль
var dbstyle = document.createElement("link");
dbstyle.setAttribute("type", "text/css");
dbstyle.setAttribute("rel", "stylesheet");
dbstyle.setAttribute("href", chrome.extension.getURL("dropbox.css"));
document.getElementsByTagName("head")[0].appendChild(dbstyle);
// Объект для работы плагина
var dbobj = document.createElement("div");
dbobj.setAttribute("id", "yImgDropBox");
dbobj.innerHTML = 'click twice';
document.getElementsByTagName("body")[0].appendChild(dbobj);
}
var newEvent = new CustomEvent('yImgDropBoxStart', {'detail': {'yImgToken': '111'}});
window.dispatchEvent(newEvent);
});
});
});
В файле плагина делаю инициализацию
$(window).on('yImgDropBoxStart', function(event) {
var receivedToken = event.detail.yImgToken ? event.detail.yImgToken : event.originalEvent.detail.yImgToken;
console.log('plugin inited');
});
Проблема в том, что после первого нажатия на кнопку расширения все, что нужно, корректно встраивается в содержимое открытой страницы. Но сообщение не отрабатывается. Если нажать на кнопку расширения еще раз - плагин получает сообщение и все работает дальше нормально.
Почему обработка сообщения не выполняется сразу после первого нажатия?