0

In the title, what I mean by default_popup js file is the javascript file linked with the html popup page when the extension icon is clicked. Below, in the manifest.json file, default_popup js file would be linked to the random.html file, which would show up if the icon is clicked.

"browser_action": {
"default_icon": "icon.png",
"default_title": "example extension"
"default_popup": "random.html"
}

For my upcoming project, I am trying to create a google chrome extension that allows the user to click the extension icon to show the default_pop html file, enter some data, and calculate some result based on the elements on the current webpage (or active tab).

My concern is that I don't understand how the default_popup js file can access the contents of the active tab. For example, using document.getElementById() would look through random.html instead of the actual active tab. I was wondering if there was anyway for the the default_popup js file could some how read/extract data from the active tab to then perform some calculations on.

halfer
  • 18,701
  • 13
  • 79
  • 158
Daniel Choi
  • 19
  • 6

1 Answers1

0

Access the webpage DOM:

  • Declare content script in manifest.json and use messaging

    chrome.tabs.sendMessage(integer tabId, any message, object options, function responseCallback)

Sends a single message to the content script(s) in the specified tab, with an optional callback to run when a response is sent back. The runtime.onMessage event is fired in each content script running in the specified tab for the current extension.

Source: https://developer.chrome.com/extensions/tabs#method-sendMessage

  • Tabs API to inject a content script

    chrome.tabs.executeScript(integer tabId, object details, function callback)

Injects JavaScript code into a page. For details, see the programmatic injection section of the content scripts doc.

Source: https://developer.chrome.com/extensions/tabs#method-sendMessage

Umbro
  • 1,271
  • 3
  • 19
  • 63