当我尝试在 Firefox 的 webextension 插件设置页面上保存设置时，出现 "Promise resolved while context is inactive" 错误

Question

我正在尝试使用 https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Implement_a_settings_page 在我的插件中实现设置页面代码（从他们的示例中复制，一些小的改动）：

manifest.json

{
  "manifest_version": 2,
  "name": "Posture Promoter - with Emma Watson",
  "version": "1.0",
  "icons": { "128": "emma_icon.png" },
  "description": "Want better posture? Want to maintain a healthier back? Emma Watson will remind you every 30 minutes to sit straight!",
  "background": {
    "scripts": ["background.js"]
  },
  "options_ui": {
    "page": "settings.html"
  },
"permissions": ["tabs","storage"],
"browser_specific_settings": {
    "gecko": {
      "id": "addon@someaddon.com"
    }
  }
}

background.js

 var getting = browser.storage.local.get("interval").then(
 function(e){
   var time = 1000 * 60 * (e.interval || 30);
   window.setInterval(test, time);
 });

function test() {
  var popupURL = browser.extension.getURL("emma.html"); 
  var emmaWindow = browser.windows.create({
    url: popupURL,
    type: "popup",
    width: 680,
    height: 710
   });
}

emma.html

<html>
<body>
  <img src="emma.png" width=650/>
</body>
</html>

settings.html

 <!DOCTYPE html>
  <html>
  <head>
    <meta charset="utf-8">
  </head>
  <style>
  p{font-size: 20px;display: inline-block;}
  </style>
  <body>
      <form>
          <p>Remind me to fix posture in</p>
          <input type="number" id="posture"> 
          <p>minutes.</p>
          <button type="submit">Save</button>
      </form>
      <script src="options.js"></script>
  </body>
  </html>

options.js

function saveOptions(e) {
  e.preventDefault();
  browser.storage.local.set({
    interval: document.getElementById('posture').value
  }).then(function(e) {
    restoreOptions(); //just to check setting is saved
    browser.runtime.reload();
  });
}

function restoreOptions() {

  function setCurrentChoice(result) {
    document.getElementById('posture').value = result.interval || 30;
  }

  function onError(error) {
    console.log("Error:",error);
  }

  let getting = browser.storage.local.get("interval");
  getting.then(setCurrentChoice, onError);
}

document.addEventListener("DOMContentLoaded", restoreOptions);
document.querySelector("form").addEventListener("submit", saveOptions);

每次我点击 options.js 中第 3 行的保存按钮 I get Promise resolved while context is inactive 我知道没有设置的 background.js 可以工作，所以问题不存在。我在 Windows 10 1909 上使用 Firefox 83.0。我问这个问题的原因是其他类似的问题不适用于 Firefox 57 或更新版本。感谢任何帮助。

编辑：感谢您的帮助，已编辑代码。现在可以使用了。

Answer 1

您需要阻止表单同时执行回发：

function saveOptions(e) {
  e.preventDefault();

当我尝试在 Firefox 的 webextension 插件设置页面上保存设置时，出现 "Promise resolved while context is inactive" 错误

I'm getting a "Promise resolved while context is inactive" error when I try save a setting on a webextension addon settings page on Firefox

javascript

firefox

firefox-addon-webextensions