Javascript Firefox web扩展内容脚本未在新创建的选项卡中执行

在我的Firefox web扩展中，我在浏览器工具栏上添加了一个新按钮，打开一个小弹出窗口。在这个弹出窗口中会显示一个按钮，该按钮将创建一个新的浏览器窗口，在新选项卡中打开几个URL，最后在这些页面上执行不同的内容脚本

我的代码如下所示

manifest.json

{
  "manifest_version": 2,
  "name": "Auto URL Opener",
  "version": "0.0.1",

  "description": "Auto URL Opener",
  "icons": { "48": "icon48.png" },

  "permissions": [ "tabs", "<all_urls>" ],

  "browser_action": {
    "default_icon": { "48": "icon48.png" },
    "default_title": "Auto URL Opener",
    "default_popup": "popup.html"
  }
}

{
  "manifest_version": 2,
  "name": "Auto URL Opener",
  "version": "0.0.1",

  "description": "Auto URL Opener",
  "icons": { "48": "icon48.png" },

  "permissions": [ "tabs", "<all_urls>" ],

  "background": {
    "scripts": ["background.js"]
  },

  "browser_action": {
    "default_icon": { "48": "icon48.png" },
    "default_title": "Auto URL Opener",
    "default_popup": "popup.html"
  }
}

我想要的行为是

• 将打开一个新的浏览器窗口
• 在新浏览器窗口中，打开三个选项卡
  • 一个带有“关于：空白”页面
  • 一个是xkcd网站
  • 一个是谷歌网站
• 执行xkcd网站选项卡中的内容脚本
• 执行google网站选项卡中的内容脚本
• 浏览器控制台显示6条日志消息

  • ###创建新窗口并打开选项卡

  • ###窗口已创建

  • ###选项卡1已创建

  • ###在tab1中执行内容脚本

  • ###选项卡2已创建

  • ###在tab2中执行内容脚本

实际行为是

• 将打开一个新的浏览器窗口
• 在新浏览器窗口中，打开三个选项卡
  • 一个带有“关于：空白”页面
  • 一个是xkcd网站
  • 一个是谷歌网站
• 不执行内容脚本
• 浏览器控制台显示6条日志消息中的2条

  • ###创建新窗口并打开选项卡

  • ###窗口已创建

当打开新的浏览器窗口并且web扩展弹出窗口自动关闭时，感觉代码的执行被中断

当我按照以下方式重新分解代码时

manifest.json

{
  "manifest_version": 2,
  "name": "Auto URL Opener",
  "version": "0.0.1",

  "description": "Auto URL Opener",
  "icons": { "48": "icon48.png" },

  "permissions": [ "tabs", "<all_urls>" ],

  "browser_action": {
    "default_icon": { "48": "icon48.png" },
    "default_title": "Auto URL Opener",
    "default_popup": "popup.html"
  }
}

{
  "manifest_version": 2,
  "name": "Auto URL Opener",
  "version": "0.0.1",

  "description": "Auto URL Opener",
  "icons": { "48": "icon48.png" },

  "permissions": [ "tabs", "<all_urls>" ],

  "background": {
    "scripts": ["background.js"]
  },

  "browser_action": {
    "default_icon": { "48": "icon48.png" },
    "default_title": "Auto URL Opener",
    "default_popup": "popup.html"
  }
}

background.js

function openUrls() {
    console.log('### create new window and open tabs');

    browser.windows.create({
        incognito: false,
        url: 'about:blank'
    }).then((window) => {
        console.log('### window created', window.id);

        browser.tabs.create({
            url: 'http://www.xkcd.com/',
            windowId: window.id
        }).then((tab) => {
            console.log('### tab1 created', tab.id);

            browser.tabs.executeScript(tab.id, {
                code: 'document.body.style.border = "5px solid green"'
            }).then(() => {
                console.log('### executed content script in tab1');  
            });
        });

        browser.tabs.create({
            url: 'http://www.google.com/',
            windowId: window.id
        }).then((tab) => {
            console.log('### tab2 created', tab.id);

            browser.tabs.executeScript(tab.id, {
                code: 'document.body.style.border = "5px solid blue"'
            });
        }).then(() => {
            console.log('### executed content script in tab2');  
        });
    });
}

browser.runtime.onMessage.addListener(openUrls);

我获得了所需的行为，但我不确定这是否是一个好的解决方案。

脚本1不起作用，因为代码放在popup.js文件中，其生存时间取决于web扩展弹出窗口打开和激活的时间。

脚本2之所以能够工作，是因为代码放在background.js文件中，它的生存时间取决于扩展打开和激活的时间

---

脚本2方法是解决问题的正确方法

请将问题放在主题上：包括重复问题的方法。对于Chrome扩展或Firefox WebExtensions，这几乎总是意味着包括manifest.json和一些背景、内容和/或弹出脚本/HTML。寻求调试帮助的问题（“为什么这段代码没有按我想要的方式工作？”）必须包括：（1）所需的行为，（2）特定的问题或错误，（3）在问题本身中重现它所需的最短代码。另请参见：、和。当您尝试安装和使用扩展时，（在OSX上的Ctrl-Shift-J或Cmd-Shift-J）中到底显示了什么？@Makyen感谢您的反馈。我已经用完整的工作代码、更详细的描述和期望/实际的行为更新了我的问题。@StigP.：我提供了解决方案，如果它解决了您的问题，请接受answer@Sudarshan在国际海事组织，在发布答复后不到一分钟要求接受是不合适的。一般来说，老年退休金计划在接受答复之前等待一段时间，看看是否会公布其他可能更好的答复，这是合理的。一旦一个答案被接受，另一个答案被发布的可能性就小得多。在这种情况下，OP对问题进行的编辑有效地添加了完整的代码，使其成为一个全新的问题（现在可以回答）。

document.getElementById('openUrlsButton').addEventListener("click", function(e) {
    browser.runtime.sendMessage({
        task: "open urls"
    });
}

function openUrls() {
    console.log('### create new window and open tabs');

    browser.windows.create({
        incognito: false,
        url: 'about:blank'
    }).then((window) => {
        console.log('### window created', window.id);

        browser.tabs.create({
            url: 'http://www.xkcd.com/',
            windowId: window.id
        }).then((tab) => {
            console.log('### tab1 created', tab.id);

            browser.tabs.executeScript(tab.id, {
                code: 'document.body.style.border = "5px solid green"'
            }).then(() => {
                console.log('### executed content script in tab1');  
            });
        });

        browser.tabs.create({
            url: 'http://www.google.com/',
            windowId: window.id
        }).then((tab) => {
            console.log('### tab2 created', tab.id);

            browser.tabs.executeScript(tab.id, {
                code: 'document.body.style.border = "5px solid blue"'
            });
        }).then(() => {
            console.log('### executed content script in tab2');  
        });
    });
}

browser.runtime.onMessage.addListener(openUrls);