Merge pull request #5711 from electron/extension-code-cleanup

Implement partial chrome.* API for devtools extension

lib/browser/api/web-contents.js

@@ -71,12 +71,15 @@ let wrapWebContents = function (webContents) {
   webContents.setMaxListeners(0)
 
   // WebContents::send(channel, args..)
-  webContents.send = function (channel, ...args) {
+  // WebContents::sendToAll(channel, args..)
+  const sendWrapper = (allFrames, channel, ...args) => {
     if (channel == null) {
       throw new Error('Missing required channel argument')
     }
-    return this._send(channel, args)
+    return webContents._send(allFrames, channel, args)
   }
+  webContents.send = sendWrapper.bind(null, false)
+  webContents.sendToAll = sendWrapper.bind(null, true)
 
   // The navigation controller.
   controller = new NavigationController(webContents)
@@ -218,9 +221,12 @@ binding._setWrapWebContents(wrapWebContents)
 debuggerBinding._setWrapDebugger(wrapDebugger)
 sessionBinding._setWrapSession(wrapSession)
 
-module.exports.create = function (options) {
-  if (options == null) {
-    options = {}
+module.exports = {
+  create (options = {}) {
+    return binding.create(options)
+  },
+
+  fromId (id) {
+    return binding.fromId(id)
   }
-  return binding.create(options)
 }

lib/browser/chrome-extension.js

@@ -1,56 +1,224 @@
-const {app, protocol, BrowserWindow} = require('electron')
+const {app, ipcMain, protocol, webContents, BrowserWindow} = require('electron')
+const renderProcessPreferences = process.atomBinding('render_process_preferences').forAllBrowserWindow()
+
 const fs = require('fs')
 const path = require('path')
 const url = require('url')
 
-// Mapping between hostname and file path.
-var hostPathMap = {}
-var hostPathMapNextKey = 0
-
-var getHostForPath = function (path) {
-  var key
-  key = 'extension-' + (++hostPathMapNextKey)
-  hostPathMap[key] = path
-  return key
+// TODO(zcbenz): Remove this when we have Object.values().
+const objectValues = function (object) {
+  return Object.keys(object).map(function (key) { return object[key] })
 }
 
-var getPathForHost = function (host) {
-  return hostPathMap[host]
+// Mapping between extensionId(hostname) and manifest.
+const manifestMap = {}  // extensionId => manifest
+const manifestNameMap = {}  // name => manifest
+
+const generateExtensionIdFromName = function (name) {
+  return name.replace(/[\W_]+/g, '-').toLowerCase()
 }
 
-// Cache extensionInfo.
-var extensionInfoMap = {}
-
-var getExtensionInfoFromPath = function (srcDirectory) {
-  var manifest, page
-  manifest = JSON.parse(fs.readFileSync(path.join(srcDirectory, 'manifest.json')))
-  if (extensionInfoMap[manifest.name] == null) {
-    // We can not use 'file://' directly because all resources in the extension
-    // will be treated as relative to the root in Chrome.
-    page = url.format({
-      protocol: 'chrome-extension',
-      slashes: true,
-      hostname: getHostForPath(srcDirectory),
-      pathname: manifest.devtools_page
-    })
-    extensionInfoMap[manifest.name] = {
-      startPage: page,
-      name: manifest.name,
+// Create or get manifest object from |srcDirectory|.
+const getManifestFromPath = function (srcDirectory) {
+  const manifest = JSON.parse(fs.readFileSync(path.join(srcDirectory, 'manifest.json')))
+  if (!manifestNameMap[manifest.name]) {
+    const extensionId = generateExtensionIdFromName(manifest.name)
+    console.log(extensionId)
+    manifestMap[extensionId] = manifestNameMap[manifest.name] = manifest
+    Object.assign(manifest, {
       srcDirectory: srcDirectory,
-      exposeExperimentalAPIs: true
-    }
-    return extensionInfoMap[manifest.name]
+      extensionId: extensionId,
+      // We can not use 'file://' directly because all resources in the extension
+      // will be treated as relative to the root in Chrome.
+      startPage: url.format({
+        protocol: 'chrome-extension',
+        slashes: true,
+        hostname: extensionId,
+        pathname: manifest.devtools_page
+      })
+    })
+    return manifest
   }
 }
 
-// The loaded extensions cache and its persistent path.
-var loadedExtensions = null
-var loadedExtensionsPath = null
+// Manage the background pages.
+const backgroundPages = {}
+
+const startBackgroundPages = function (manifest) {
+  if (backgroundPages[manifest.extensionId] || !manifest.background) return
+
+  const scripts = manifest.background.scripts.map((name) => {
+    return `<script src="${name}"></script>`
+  }).join('')
+  const html = new Buffer(`<html><body>${scripts}</body></html>`)
+
+  const contents = webContents.create({
+    commandLineSwitches: ['--background-page']
+  })
+  backgroundPages[manifest.extensionId] = { html: html, webContents: contents }
+  contents.loadURL(url.format({
+    protocol: 'chrome-extension',
+    slashes: true,
+    hostname: manifest.extensionId,
+    pathname: '_generated_background_page.html'
+  }))
+}
+
+const removeBackgroundPages = function (manifest) {
+  if (!backgroundPages[manifest.extensionId]) return
+
+  backgroundPages[manifest.extensionId].webContents.destroy()
+  delete backgroundPages[manifest.extensionId]
+}
+
+// Dispatch tabs events.
+const hookWindowForTabEvents = function (win) {
+  const tabId = win.webContents.id
+  for (const page of objectValues(backgroundPages)) {
+    page.webContents.sendToAll('CHROME_TABS_ONCREATED', tabId)
+  }
+
+  win.once('closed', () => {
+    for (const page of objectValues(backgroundPages)) {
+      page.webContents.sendToAll('CHROME_TABS_ONREMOVED', tabId)
+    }
+  })
+}
+
+// Handle the chrome.* API messages.
+let nextId = 0
+
+ipcMain.on('CHROME_RUNTIME_CONNECT', function (event, extensionId, connectInfo) {
+  const page = backgroundPages[extensionId]
+  if (!page) {
+    console.error(`Connect to unkown extension ${extensionId}`)
+    return
+  }
+
+  const portId = ++nextId
+  event.returnValue = {tabId: page.webContents.id, portId: portId}
+
+  event.sender.once('render-view-deleted', () => {
+    if (page.webContents.isDestroyed()) return
+    page.webContents.sendToAll(`CHROME_PORT_DISCONNECT_${portId}`)
+  })
+  page.webContents.sendToAll(`CHROME_RUNTIME_ONCONNECT_${extensionId}`, event.sender.id, portId, connectInfo)
+})
+
+ipcMain.on('CHROME_RUNTIME_SENDMESSAGE', function (event, extensionId, message) {
+  const page = backgroundPages[extensionId]
+  if (!page) {
+    console.error(`Connect to unkown extension ${extensionId}`)
+    return
+  }
+
+  page.webContents.sendToAll(`CHROME_RUNTIME_ONMESSAGE_${extensionId}`, event.sender.id, message)
+})
+
+ipcMain.on('CHROME_TABS_SEND_MESSAGE', function (event, tabId, extensionId, isBackgroundPage, message) {
+  const contents = webContents.fromId(tabId)
+  if (!contents) {
+    console.error(`Sending message to unkown tab ${tabId}`)
+    return
+  }
+
+  const senderTabId = isBackgroundPage ? null : event.sender.id
+
+  contents.sendToAll(`CHROME_RUNTIME_ONMESSAGE_${extensionId}`, senderTabId, message)
+})
+
+ipcMain.on('CHROME_TABS_EXECUTESCRIPT', function (event, requestId, tabId, extensionId, details) {
+  const contents = webContents.fromId(tabId)
+  if (!contents) {
+    console.error(`Sending message to unkown tab ${tabId}`)
+    return
+  }
+
+  let code, url
+  if (details.file) {
+    const manifest = manifestMap[extensionId]
+    code = String(fs.readFileSync(path.join(manifest.srcDirectory, details.file)))
+    url = `chrome-extension://${extensionId}${details.file}`
+  } else {
+    code = details.code
+    url = `chrome-extension://${extensionId}/${String(Math.random()).substr(2, 8)}.js`
+  }
+
+  contents.send('CHROME_TABS_EXECUTESCRIPT', event.sender.id, requestId, extensionId, url, code)
+})
+
+// Transfer the content scripts to renderer.
+const contentScripts = {}
+
+const injectContentScripts = function (manifest) {
+  if (contentScripts[manifest.name] || !manifest.content_scripts) return
+
+  const readArrayOfFiles = function (relativePath) {
+    return {
+      url: `chrome-extension://${manifest.extensionId}/${relativePath}`,
+      code: String(fs.readFileSync(path.join(manifest.srcDirectory, relativePath)))
+    }
+  }
+
+  const contentScriptToEntry = function (script) {
+    return {
+      matches: script.matches,
+      js: script.js.map(readArrayOfFiles),
+      runAt: script.run_at || 'document_idle'
+    }
+  }
+
+  try {
+    const entry = {
+      extensionId: manifest.extensionId,
+      contentScripts: manifest.content_scripts.map(contentScriptToEntry)
+    }
+    contentScripts[manifest.name] = renderProcessPreferences.addEntry(entry)
+  } catch (e) {
+    console.error('Failed to read content scripts', e)
+  }
+}
+
+const removeContentScripts = function (manifest) {
+  if (!contentScripts[manifest.name]) return
+
+  renderProcessPreferences.removeEntry(contentScripts[manifest.name])
+  delete contentScripts[manifest.name]
+}
+
+// Transfer the |manifest| to a format that can be recognized by the
+// |DevToolsAPI.addExtensions|.
+const manifestToExtensionInfo = function (manifest) {
+  return {
+    startPage: manifest.startPage,
+    srcDirectory: manifest.srcDirectory,
+    name: manifest.name,
+    exposeExperimentalAPIs: true
+  }
+}
+
+// Load the extensions for the window.
+const loadExtension = function (manifest) {
+  startBackgroundPages(manifest)
+  injectContentScripts(manifest)
+}
+
+const loadDevToolsExtensions = function (win, manifests) {
+  if (!win.devToolsWebContents) return
+
+  manifests.forEach(loadExtension)
+
+  const extensionInfoArray = manifests.map(manifestToExtensionInfo)
+  win.devToolsWebContents.executeJavaScript(`DevToolsAPI.addExtensions(${JSON.stringify(extensionInfoArray)})`)
+}
+
+// The persistent path of "DevTools Extensions" preference file.
+let loadedExtensionsPath = null
 
 app.on('will-quit', function () {
   try {
-    loadedExtensions = Object.keys(extensionInfoMap).map(function (key) {
-      return extensionInfoMap[key].srcDirectory
+    const loadedExtensions = objectValues(manifestMap).map(function (manifest) {
+      return manifest.srcDirectory
     })
     if (loadedExtensions.length > 0) {
       try {
@@ -69,74 +237,78 @@ app.on('will-quit', function () {
 
 // We can not use protocol or BrowserWindow until app is ready.
 app.once('ready', function () {
-  var chromeExtensionHandler, i, init, len, srcDirectory
+  // The chrome-extension: can map a extension URL request to real file path.
+  const chromeExtensionHandler = function (request, callback) {
+    const parsed = url.parse(request.url)
+    if (!parsed.hostname || !parsed.path) return callback()
+
+    const manifest = manifestMap[parsed.hostname]
+    if (!manifest) return callback()
+
+    if (parsed.path === '/_generated_background_page.html' &&
+        backgroundPages[parsed.hostname]) {
+      return callback({
+        mimeType: 'text/html',
+        data: backgroundPages[parsed.hostname].html
+      })
+    }
+
+    fs.readFile(path.join(manifest.srcDirectory, parsed.path), function (err, content) {
+      if (err) {
+        return callback(-6)  // FILE_NOT_FOUND
+      } else {
+        return callback(content)
+      }
+    })
+  }
+  protocol.registerBufferProtocol('chrome-extension', chromeExtensionHandler, function (error) {
+    if (error) {
+      console.error(`Unable to register chrome-extension protocol: ${error}`)
+    }
+  })
 
   // Load persisted extensions.
   loadedExtensionsPath = path.join(app.getPath('userData'), 'DevTools Extensions')
   try {
-    loadedExtensions = JSON.parse(fs.readFileSync(loadedExtensionsPath))
-    if (!Array.isArray(loadedExtensions)) {
-      loadedExtensions = []
-    }
-
-    // Preheat the extensionInfo cache.
-    for (i = 0, len = loadedExtensions.length; i < len; i++) {
-      srcDirectory = loadedExtensions[i]
-      getExtensionInfoFromPath(srcDirectory)
+    const loadedExtensions = JSON.parse(fs.readFileSync(loadedExtensionsPath))
+    if (Array.isArray(loadedExtensions)) {
+      for (const srcDirectory of loadedExtensions) {
+        // Start background pages and set content scripts.
+        const manifest = getManifestFromPath(srcDirectory)
+        loadExtension(manifest)
+      }
     }
   } catch (error) {
     // Ignore error
   }
 
-  // The chrome-extension: can map a extension URL request to real file path.
-  chromeExtensionHandler = function (request, callback) {
-    var directory, parsed
-    parsed = url.parse(request.url)
-    if (!(parsed.hostname && (parsed.path != null))) {
-      return callback()
-    }
-    if (!/extension-\d+/.test(parsed.hostname)) {
-      return callback()
-    }
-    directory = getPathForHost(parsed.hostname)
-    if (directory == null) {
-      return callback()
-    }
-    return callback(path.join(directory, parsed.path))
-  }
-  protocol.registerFileProtocol('chrome-extension', chromeExtensionHandler, function (error) {
-    if (error) {
-      return console.error('Unable to register chrome-extension protocol')
-    }
-  })
-  BrowserWindow.prototype._loadDevToolsExtensions = function (extensionInfoArray) {
-    var ref
-    return (ref = this.devToolsWebContents) != null ? ref.executeJavaScript('DevToolsAPI.addExtensions(' + (JSON.stringify(extensionInfoArray)) + ');') : void 0
-  }
+  // The public API to add/remove extensions.
   BrowserWindow.addDevToolsExtension = function (srcDirectory) {
-    var extensionInfo, j, len1, ref, window
-    extensionInfo = getExtensionInfoFromPath(srcDirectory)
-    if (extensionInfo) {
-      ref = BrowserWindow.getAllWindows()
-      for (j = 0, len1 = ref.length; j < len1; j++) {
-        window = ref[j]
-        window._loadDevToolsExtensions([extensionInfo])
+    const manifest = getManifestFromPath(srcDirectory)
+    if (manifest) {
+      for (const win of BrowserWindow.getAllWindows()) {
+        loadDevToolsExtensions(win, [manifest])
       }
-      return extensionInfo.name
+      return manifest.name
     }
   }
   BrowserWindow.removeDevToolsExtension = function (name) {
-    return delete extensionInfoMap[name]
+    const manifest = manifestNameMap[name]
+    if (!manifest) return
+
+    removeBackgroundPages(manifest)
+    removeContentScripts(manifest)
+    delete manifestMap[manifest.extensionId]
+    delete manifestNameMap[name]
   }
 
-  // Load persisted extensions when devtools is opened.
-  init = BrowserWindow.prototype._init
+  // Load extensions automatically when devtools is opened.
+  const init = BrowserWindow.prototype._init
   BrowserWindow.prototype._init = function () {
     init.call(this)
-    return this.webContents.on('devtools-opened', () => {
-      return this._loadDevToolsExtensions(Object.keys(extensionInfoMap).map(function (key) {
-        return extensionInfoMap[key]
-      }))
+    hookWindowForTabEvents(this)
+    this.webContents.on('devtools-opened', () => {
+      loadDevToolsExtensions(this, objectValues(manifestMap))
     })
   }
 })

lib/browser/rpc-server.js

@@ -2,7 +2,7 @@
 
 const electron = require('electron')
 const v8Util = process.atomBinding('v8_util')
-const {ipcMain, isPromise} = electron
+const {ipcMain, isPromise, webContents} = electron
 
 const objectsRegistry = require('./objects-registry')
 
@@ -353,3 +353,17 @@ ipcMain.on('ELECTRON_BROWSER_ASYNC_CALL_TO_GUEST_VIEW', function (event, request
     event.returnValue = exceptionToMeta(error)
   }
 })
+
+ipcMain.on('ELECTRON_BROWSER_SEND_TO', function (event, sendToAll, webContentsId, channel, ...args) {
+  let contents = webContents.fromId(webContentsId)
+  if (!contents) {
+    console.error(`Sending message to WebContents with unknown ID ${webContentsId}`)
+    return
+  }
+
+  if (sendToAll) {
+    contents.sendToAll(channel, ...args)
+  } else {
+    contents.send(channel, ...args)
+  }
+})

lib/renderer/api/ipc-renderer.js

@@ -18,4 +18,20 @@ ipcRenderer.sendToHost = function (...args) {
   return binding.send('ipc-message-host', args)
 }
 
+ipcRenderer.sendTo = function (webContentsId, channel, ...args) {
+  if (typeof webContentsId !== 'number') {
+    throw new TypeError('First argument has to be webContentsId')
+  }
+
+  ipcRenderer.send('ELECTRON_BROWSER_SEND_TO', false, webContentsId, channel, ...args)
+}
+
+ipcRenderer.sendToAll = function (webContentsId, channel, ...args) {
+  if (typeof webContentsId !== 'number') {
+    throw new TypeError('First argument has to be webContentsId')
+  }
+
+  ipcRenderer.send('ELECTRON_BROWSER_SEND_TO', true, webContentsId, channel, ...args)
+}
+
 module.exports = ipcRenderer

lib/renderer/chrome-api.js

@@ -1,13 +1,200 @@
+const {ipcRenderer} = require('electron')
 const url = require('url')
-const chrome = window.chrome = window.chrome || {}
 
-chrome.extension = {
-  getURL: function (path) {
-    return url.format({
-      protocol: window.location.protocol,
-      slashes: true,
-      hostname: window.location.hostname,
-      pathname: path
-    })
+let nextId = 0
+
+class Event {
+  constructor () {
+    this.listeners = []
+  }
+
+  addListener (callback) {
+    this.listeners.push(callback)
+  }
+
+  removeListener (callback) {
+    const index = this.listeners.indexOf(callback)
+    if (index !== -1) {
+      this.listeners.splice(index, 1)
+    }
+  }
+
+  emit (...args) {
+    for (const listener of this.listeners) {
+      listener(...args)
+    }
+  }
+}
+
+class Tab {
+  constructor (tabId) {
+    this.id = tabId
+  }
+}
+
+class MessageSender {
+  constructor (tabId, extensionId) {
+    this.tab = tabId ? new Tab(tabId) : null
+    this.id = extensionId
+    this.url = `chrome-extension://${extensionId}`
+  }
+}
+
+class Port {
+  constructor (tabId, portId, extensionId, name) {
+    this.tabId = tabId
+    this.portId = portId
+    this.disconnected = false
+
+    this.name = name
+    this.onDisconnect = new Event()
+    this.onMessage = new Event()
+    this.sender = new MessageSender(tabId, extensionId)
+
+    ipcRenderer.once(`CHROME_PORT_DISCONNECT_${portId}`, () => {
+      this._onDisconnect()
+    })
+    ipcRenderer.on(`CHROME_PORT_POSTMESSAGE_${portId}`, (event, message) => {
+      const sendResponse = function () { console.error('sendResponse is not implemented') }
+      this.onMessage.emit(message, this.sender, sendResponse)
+    })
+  }
+
+  disconnect () {
+    if (this.disconnected) return
+
+    ipcRenderer.sendToAll(this.tabId, `CHROME_PORT_DISCONNECT_${this.portId}`)
+    this._onDisconnect()
+  }
+
+  postMessage (message) {
+    ipcRenderer.sendToAll(this.tabId, `CHROME_PORT_POSTMESSAGE_${this.portId}`, message)
+  }
+
+  _onDisconnect () {
+    this.disconnected = true
+    ipcRenderer.removeAllListeners(`CHROME_PORT_POSTMESSAGE_${this.portId}`)
+    this.onDisconnect.emit()
+  }
+}
+
+// Inject chrome API to the |context|
+exports.injectTo = function (extensionId, isBackgroundPage, context) {
+  const chrome = context.chrome = context.chrome || {}
+
+  ipcRenderer.on(`CHROME_RUNTIME_ONCONNECT_${extensionId}`, (event, tabId, portId, connectInfo) => {
+    chrome.runtime.onConnect.emit(new Port(tabId, portId, extensionId, connectInfo.name))
+  })
+
+  ipcRenderer.on(`CHROME_RUNTIME_ONMESSAGE_${extensionId}`, (event, tabId, message) => {
+    chrome.runtime.onMessage.emit(message, new MessageSender(tabId, extensionId))
+  })
+
+  ipcRenderer.on('CHROME_TABS_ONCREATED', (event, tabId) => {
+    chrome.tabs.onCreated.emit(new Tab(tabId))
+  })
+
+  ipcRenderer.on('CHROME_TABS_ONREMOVED', (event, tabId) => {
+    chrome.tabs.onRemoved.emit(tabId)
+  })
+
+  chrome.runtime = {
+    getURL: function (path) {
+      return url.format({
+        protocol: 'chrome-extension',
+        slashes: true,
+        hostname: extensionId,
+        pathname: path
+      })
+    },
+
+    connect (...args) {
+      if (isBackgroundPage) {
+        console.error('chrome.runtime.connect is not supported in background page')
+        return
+      }
+
+      // Parse the optional args.
+      let targetExtensionId = extensionId
+      let connectInfo = {name: ''}
+      if (args.length === 1) {
+        connectInfo = args[0]
+      } else if (args.length === 2) {
+        [targetExtensionId, connectInfo] = args
+      }
+
+      const {tabId, portId} = ipcRenderer.sendSync('CHROME_RUNTIME_CONNECT', targetExtensionId, connectInfo)
+      return new Port(tabId, portId, extensionId, connectInfo.name)
+    },
+
+    sendMessage (...args) {
+      if (isBackgroundPage) {
+        console.error('chrome.runtime.sendMessage is not supported in background page')
+        return
+      }
+
+      // Parse the optional args.
+      let targetExtensionId = extensionId
+      let message
+      if (args.length === 1) {
+        message = args[0]
+      } else if (args.length === 2) {
+        [targetExtensionId, message] = args
+      } else {
+        console.error('options and responseCallback are not supported')
+      }
+
+      ipcRenderer.send('CHROME_RUNTIME_SENDMESSAGE', targetExtensionId, message)
+    },
+
+    onConnect: new Event(),
+    onMessage: new Event(),
+    onInstalled: new Event()
+  }
+
+  chrome.tabs = {
+    executeScript (tabId, details, callback) {
+      const requestId = ++nextId
+      ipcRenderer.once(`CHROME_TABS_EXECUTESCRIPT_RESULT_${requestId}`, (event, result) => {
+        callback([event.result])
+      })
+      ipcRenderer.send('CHROME_TABS_EXECUTESCRIPT', requestId, tabId, extensionId, details)
+    },
+
+    sendMessage (tabId, message, options, responseCallback) {
+      if (responseCallback) {
+        console.error('responseCallback is not supported')
+      }
+      ipcRenderer.send('CHROME_TABS_SEND_MESSAGE', tabId, extensionId, isBackgroundPage, message)
+    },
+
+    onUpdated: new Event(),
+    onCreated: new Event(),
+    onRemoved: new Event()
+  }
+
+  chrome.extension = {
+    getURL: chrome.runtime.getURL,
+    connect: chrome.runtime.connect,
+    onConnect: chrome.runtime.onConnect,
+    sendMessage: chrome.runtime.sendMessage,
+    onMessage: chrome.runtime.onMessage
+  }
+
+  chrome.storage = {
+    sync: {
+      get () {},
+      set () {}
+    }
+  }
+
+  chrome.pageAction = {
+    show () {},
+    hide () {},
+    setTitle () {},
+    getTitle () {},
+    setIcon () {},
+    setPopup () {},
+    getPopup () {}
   }
 }

lib/renderer/content-scripts-injector.js

@@ -0,0 +1,61 @@
+const {ipcRenderer} = require('electron')
+const {runInThisContext} = require('vm')
+
+// Check whether pattern matches.
+// https://developer.chrome.com/extensions/match_patterns
+const matchesPattern = function (pattern) {
+  if (pattern === '<all_urls>') return true
+
+  const regexp = new RegExp('^' + pattern.replace(/\*/g, '.*') + '$')
+  return location.href.match(regexp)
+}
+
+// Run the code with chrome API integrated.
+const runContentScript = function (extensionId, url, code) {
+  const context = {}
+  require('./chrome-api').injectTo(extensionId, false, context)
+  const wrapper = `(function (chrome) {\n  ${code}\n  })`
+  const compiledWrapper = runInThisContext(wrapper, {
+    filename: url,
+    lineOffset: 1,
+    displayErrors: true
+  })
+  return compiledWrapper.call(this, context.chrome)
+}
+
+// Run injected scripts.
+// https://developer.chrome.com/extensions/content_scripts
+const injectContentScript = function (extensionId, script) {
+  for (const match of script.matches) {
+    if (!matchesPattern(match)) return
+  }
+
+  for (const {url, code} of script.js) {
+    const fire = runContentScript.bind(window, extensionId, url, code)
+    if (script.runAt === 'document_start') {
+      process.once('document-start', fire)
+    } else if (script.runAt === 'document_end') {
+      process.once('document-end', fire)
+    } else if (script.runAt === 'document_idle') {
+      document.addEventListener('DOMContentLoaded', fire)
+    }
+  }
+}
+
+// Handle the request of chrome.tabs.executeJavaScript.
+ipcRenderer.on('CHROME_TABS_EXECUTESCRIPT', function (event, senderWebContentsId, requestId, extensionId, url, code) {
+  const result = runContentScript.call(window, extensionId, url, code)
+  ipcRenderer.sendToAll(senderWebContentsId, `CHROME_TABS_EXECUTESCRIPT_RESULT_${requestId}`, result)
+})
+
+// Read the renderer process preferences.
+const preferences = process.getRenderProcessPreferences()
+if (preferences) {
+  for (const pref of preferences) {
+    if (pref.contentScripts) {
+      for (const script of pref.contentScripts) {
+        injectContentScript(pref.extensionId, script)
+      }
+    }
+  }
+}

lib/renderer/init.js

@@ -41,8 +41,9 @@ electron.ipcRenderer.on('ELECTRON_INTERNAL_RENDERER_ASYNC_WEB_FRAME_METHOD', (ev
 })
 
 // Process command line arguments.
-var nodeIntegration = 'false'
-var preloadScript = null
+let nodeIntegration = 'false'
+let preloadScript = null
+let isBackgroundPage = false
 for (let arg of process.argv) {
   if (arg.indexOf('--guest-instance-id=') === 0) {
     // This is a guest web view.
@@ -54,6 +55,8 @@ for (let arg of process.argv) {
     nodeIntegration = arg.substr(arg.indexOf('=') + 1)
   } else if (arg.indexOf('--preload=') === 0) {
     preloadScript = arg.substr(arg.indexOf('=') + 1)
+  } else if (arg === '--background-page') {
+    isBackgroundPage = true
   }
 }
 
@@ -63,12 +66,15 @@ if (window.location.protocol === 'chrome-devtools:') {
   nodeIntegration = 'true'
 } else if (window.location.protocol === 'chrome-extension:') {
   // Add implementations of chrome API.
-  require('./chrome-api')
-  nodeIntegration = 'true'
+  require('./chrome-api').injectTo(window.location.hostname, isBackgroundPage, window)
+  nodeIntegration = 'false'
 } else {
   // Override default web functions.
   require('./override')
 
+  // Inject content scripts.
+  require('./content-scripts-injector')
+
   // Load webview tag implementation.
   if (nodeIntegration === 'true' && process.guestInstanceId == null) {
     require('./web-view/web-view')

lib/renderer/inspector.js

@@ -1,7 +1,4 @@
 window.onload = function () {
-  // Make sure |window.chrome| is defined for devtools extensions.
-  hijackSetInjectedScript(window.InspectorFrontendHost)
-
   // Use menu API to show context menu.
   window.InspectorFrontendHost.showContextMenuAtPoint = createMenu
 
@@ -9,18 +6,6 @@ window.onload = function () {
   window.WebInspector.createFileSelectorElement = createFileSelectorElement
 }
 
-const hijackSetInjectedScript = function (InspectorFrontendHost) {
-  const {setInjectedScriptForOrigin} = InspectorFrontendHost
-  InspectorFrontendHost.setInjectedScriptForOrigin = function (origin, source) {
-    const wrapped = `(function (...args) {
-      window.chrome = {}
-      const original = ${source}
-      original(...args)
-    })`
-    setInjectedScriptForOrigin(origin, wrapped)
-  }
-}
-
 var convertToMenuTemplate = function (items) {
   var fn, i, item, len, template
   template = []