我正在构建一个chrome扩展(JS),当用户单击弹出窗口中的按钮时,该扩展会更新chrome.storage.local以反映弹出窗口中的内容,以及(理论上)何时完成后,它将运行三个内容脚本。不幸的是,内容脚本似乎是在popup.js中设置信息之前启动的。
我尝试了超时和承诺,但是在执行“ chrome.storage.local.set”(在updateStorage()函数中)之前,它仍然运行下一个函数。是否有更好的方法/我缺少的东西?
popup.js
console.log("popup.js");
function doContent() {
console.log("content1");
//checkboxes = document.getElementsByTagName("input");
//checkCheckboxes(checkboxes);
chrome.tabs.executeScript(null, { file: "content_addNote.js" });
}
function checkCheckboxes(checkboxes, orderArray) {
//console.log("checkboxes");
//console.log(checkboxes);
console.log("orderArray");
console.log(orderArray);
console.log("for loop running");
var ii = 0;
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].type == "checkbox") {
if (checkboxes[i].checked === false) {
console.log(i, orderArray[i], "will be removed for the list");
//console.log(orderArray[i]);
orderArray.splice(ii, 1);
ii = ii - 1;
console.log(orderArray);
}
ii += 1;
//console.log(i, checkboxes[i].checked);
}
}
console.log("for loop ended");
console.log("Output from checkCheckboxes");
console.log(orderArray);
return orderArray;
}
function updateStorage() {
console.log("updateStorage");
var emailSelect = document.getElementById("SelEmailType");
var emailType = emailSelect.options[emailSelect.selectedIndex].id;
if (document.getElementById("itemInfo").innerHTML === "Placeholder") {
console.log("Error. Placeholder not found");
} else {
var storedLegal = chrome.storage.local.get("newStorage", function (items) {
var newArray = { ...items };
console.log(newArray);
var orderList = items.newStorage.src_items;
console.log("orderList", orderList);
//console.log("indexOf", orderList.indexOf("\n"));
var orderArray = orderList.split("\n");
var checkboxes = new Array();
checkboxes = document.getElementsByTagName("input");
updatedOrder = checkCheckboxes(checkboxes, orderArray);
console.log(updatedOrder);
arraString = updatedOrder.join("\n");
//console.log(arraString);
//alert(arraString);
newArray.newStorage.src_items = arraString;
newArray.newStorage.src_emailType = emailType;
console.log("start newArray");
console.log(newArray);
console.log("end newArray");
console.log(newArray.newStorage);
chrome.storage.local.clear();
chrome.storage.local.set({
newStorage: newArray.newStorage,
});
//chrome.runtime.sendMessage({ newStorage: newArray.newStorage });
console.log("stored");
//console.log(chrome.runtime.local.get({ newStorage }));
});
}
console.log("End storedLegal");
return;
}
function one_by_one(objects_array, iterator, callback) {
/* var x = 1;
var y = null; // To keep under proper scope
setTimeout(function () {
x = x * 3 + 2;
y = x / 2;
}, 500); */
var start_promise = objects_array.reduce(function (prom, object) {
return prom.then(function () {
//var y = null; // To keep under proper scope
/* setTimeout(function () {
x = x * 3 + 2;
y = x / 2;
}, 500);
x = 1;
y = null; */
return chrome.tabs.executeScript(null, { file: object }); //iterator(object);
});
}, Promise.resolve()); // initial
if (callback) {
start_promise.then(callback);
} else {
return start_promise;
}
}
/*
function processArray(arr, fn) {
return arr.reduce(
(p, v) => p.then((a) => fn(v).then((r) => a.concat([r]))),
Promise.resolve([])
);
} */
function doContent2() {
console.log("doContent2");
updateStorage();
fileFunctions = [
"content2.js",
"content_addShippingNote.js",
"content_addNote.js",
"disconnect.js",
];
var x = 1;
var y = null; // To keep under proper scope
console.log("fileFunctions ");
new Promise((resolve, reject) => {
// Promise #1
updateStorage();
console.log("Promise #1 ");
setTimeout(function () {
x = x * 3 + 2;
y = x / 2;
}, 1000);
resolve();
})
.then((result) => {
var storedLegal = chrome.storage.local.get("newStorage", function (
items
) {
if ((items = undefined)) {
console.log("item not found");
// To keep under proper scope
setTimeout(function () {
x = 1;
y = null;
x = x * 3 + 2;
y = x / 2;
}, 500);
}
//console.log(items);
});
// Promise #2
chrome.tabs.executeScript(null, { file: "content2.js" });
console.log("Promise #2 ");
return result;
})
.then((result) => {
// Promise #3
chrome.tabs.executeScript(null, { file: "content_addShippingNote.js" });
console.log("Promise #3 ");
return result;
})
.then((result) => {
// Promise #3
chrome.tabs.executeScript(null, { file: "content_addNote.js" });
console.log("Promise #4 ");
return result;
});
//processArray(fileFunctions, runScript).then(console.log);
//fileFunctions.forEach(runScript);
//one_by_one(fileFunctions, "", "");
/* var promised = new Promise(updateStorage).then((result, err) => {
console.log("YA");
fileFunctions.forEach(runScript);
}); */
document.getElementById("btnCreateEmail").addEventListener("click", null);
//fileFunctions.forEach(runScript);
/* chrome.tabs.executeScript(null, { file: "content2.js" }),
chrome.tabs.executeScript(null, { file: "content_addShippingNote.js" }),
chrome.tabs.executeScript(null, { file: "content_addNote.js" }),
chrome.tabs.executeScript(null, { file: "disconnect.js" }), */
}
function runScript(fileName, index) {
console.log(index, ": ", fileName);
chrome.tabs.executeScript(null, { file: fileName });
}
function clearStorage() {
chrome.tabs.executeScript(null, { file: "disconnect.js" });
alert("local cleared");
}
function orderToHTML(orderList) {
var orderArray = orderList.split("\n");
// Draw HTML table
var perrow = 2, // cells per row
html = "<table><tbody>";
// Loop through array and add table cells
for (var i = 0; i < orderArray.length; i++) {
html +=
"<tr><td><input type=" &
"checkbox" &
" " &
"id=" &
i &
"/></td><td>" &
orderArray[i] &
"</td></tr>";
var next = i + 1;
if (next % perrow == 0 && next != orderArray.length) {
html += "</tr><tr>";
}
}
html += "</tbody></table>";
// Attach HTML to container
return html;
}
function setWaitPeriod(time) {
var x = 1;
var y = null; // To keep under proper scope
setTimeout(function () {
x = x * 3 + 2;
y = x / 2;
}, time);
}
//window.onload = function () {
//console.log("window.onload");
chrome.runtime.sendMessage({ popupOpen: true });
var port = chrome.runtime.connect();
chrome.runtime.onMessage.addListener((msg, sender) => {
// First, validate the message's structure.
if (msg.from === "content" && msg.subject === "showPageAction") {
document.getElementById("container").innerHTML = msg.container;
document.getElementById("itemInfo").innerHTML = msg.itemInfo;
}
});
document.getElementById("btnCreateEmail").addEventListener("click", doContent2);
//document.getElementById("btnClear").addEventListener("click", clearStorage);
//});