I’m trying to port my working Chrome extension to FF, but fail on something - don’t know even on what.
The workflow of Chrome extension is:
- Just after new installation a popup is opening (background.js + welcome.html + options.html in the iframe + options.js) and user fills an API key into a form. On submit the form input is saving and popup closes.
The content of background.js is
chrome.runtime.onInstalled.addListener(function (object) {
if (chrome.runtime.OnInstalledReason.INSTALL === object.reason) {
chrome.tabs.create({url:chrome.extension.getURL("welcome.html")}, function (tab) {
console.log("New tab launched with instructions to use the extension");
});
}
});
The content of options.js is
function save_options() {
var api = document.getElementById('wptk').value;
chrome.storage.sync.set({
savedApi: api,
}, function() {
// Update status to let user know options were saved.
var status = document.getElementById('status');
status.textContent = 'Success! API key saved!';
setTimeout(function() {
status.textContent = '';
}, 15000);
});
}
document.getElementById('save').addEventListener('click', save_options);
function restore_options() {
chrome.storage.sync.get({"savedApi": ''}, function(items) {
document.getElementById('wptk').value = items.savedApi;
});
}
document.addEventListener('DOMContentLoaded', restore_options);
- If user loads any page in browser tab and clicks on extension button a new tab is opening with an url like
https://example.com${encodeURIComponent(tab.url)}&k=${savedApi}
According content of background.js is
chrome.browserAction.onClicked.addListener(tab => {
if (!tab.url) return;
chrome.storage.sync.get('savedApi', ({savedApi}) => {
chrome.tabs.create({
url: `https://example.com${encodeURIComponent(tab.url)}&k=${savedApi}`,
index: tab.index + 1,
openerTabId: tab.id,
});
});
});
Related content of manifest.json is
"background": {"scripts": ["background.js"],"persistent": false},
"browser_action": {
"default_icon": "icon-128.png",
"default_title": "ext"
},
"options_page": "options.html",
"options_ui": {
"page": "options.html",
"chrome_style": true,
"open_in_tab": false
},
"name": "ext",
"icons": {
"16": "icon-16.png",
"48": "icon-48.png",
"128": "icon-128.png" },
"web_accessible_resources":[
"welcome.html"
],
"permissions": [
"tabs",
"http://*/*",
"https://*/*",
"storage"
],
The problem: on installing welcome.html isn’t opening and no url is opening on extension button click. I’m pretty newbie with FF extension - don’t know even how to debug this