function addCertField() {
    let elem = document.getElementById("certs");
    elem.insertAdjacentHTML("beforeend", `<li><input type="text"></li>`)
}

function saveOptions() {
    let certs = [];
    for (let child of document.getElementById("certs").children) {
        let cert = child.children[0].value;
        if (!cert)
            continue;
        certs.push(cert);
    }
    browser.storage.sync.set({
        certs: certs
    }).then(() => {
        restoreOptions(); // reload list
        alert("Saved");
    });
}

function restoreOptions() {
    let getting = browser.storage.sync.get("certs");
    getting.then(saved => {
        let certs = saved.certs || [];
        let elem = document.getElementById("certs");
        elem.innerHTML = "";
        for (let cert of certs) {
            let li = document.createElement("li");
            let input = document.createElement("input");
            input.type = "text";
            input.value = cert;
            li.appendChild(input);
            elem.appendChild(li);
        }
    }, console.error);
}

document.addEventListener("DOMContentLoaded", restoreOptions);
document.getElementById("save").addEventListener("click", saveOptions);
document.getElementById("addCert").addEventListener("click", addCertField)