chrome.tabs.executeScriptのファイル実行に引数を渡す

はじめに

Chromeエクステンションの開発時、タブを指定してコードを実行したいときは
以下のようにしますが、これでは引数を与えることができません。

chrome.tabs.executeScript(tab.id, {
  file: "src/test.js"
})

解決策

chrome.tabs.executeScriptをネストして、最初のコードで渡したい値をゴニョゴニョします。
ゴニョゴニョした内容は次のfile: "src/test.js"内に引き継がれます。

chrome.tabs.executeScript(tab.id, {
    code: 'let config = 1;'
  }, () => {
    chrome.tabs.executeScript(tab.id, {
        file: "src/test.js"
    })
  })
})

// src/test.js
console.log(config) // => 1

引数がオブジェクト型のような複雑なものの場合はJSON.stringifyを使います。

let config = {foo: 'bar'}

chrome.tabs.executeScript(tab.id, {
    code: 'let config = ' + JSON.stringify(config)
  }, () => {
    chrome.tabs.executeScript(tab.id, {
        file: "src/test.js"
    })
  })
})

// src/test.js
console.log(config) // => {foo: 'bar'}