I'm working on devtools panel like described here: http://www.devdoc.net/web/developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools.html
I'm trying to send messages to and back from the page(contentScript)
my problem is when the contentScript send the message back to the background process, the background process doesn't know which port to use to forward the msg back to the panel.
I do have a list of all the ports, but I can find a way to associate a panelPort to a tab ID.
The previous document says:
"The background page can then maintain a mapping between tab IDs and runtime.Port objects, and use this to route messages between the two scopes."
Any idea how to acheve this mapping?
when my panel connects the background, I get the panelPort, but I can't pass any information about the tabId
when my panel send the tabId via message to the background, I can find what panelPort was used for this message.
Thanks for your help
Related
I'm a web developer, I just want to know how things work behind the scenes when a request is fired.
Suppose let's assume I've a static website, I requested about us page in one tab, contact us in other tab, both the requests are fired at the same time..
when the requests are fired at the same time, How browser displays the content in respective tabs correctly ?
Thanks in advance..
I think you are looking for process id,
In browser each tab have different process id ( you can see that is task manager )
This seperates the send and receiving of the data in each tab...
I want to log text on any webpage (using content-script to handle selection) into a database that is popup's resource in order to collect text in one place.
what i am trying
I create a database in popup page and try to manage it from content-script though popup is not active (not opened) by using chrome messaging but cannot make the popup receives any message from content-script.
I'm not sure about using messaging to solve this problem.
Is there any better solution?
A content script cannot send a message to an invisible popup, because the popup's context is inactive (closed) when it's hidden.
There are several solutions to your problem.
Option 1: No message passing, use storage events
If your "database" is in fact a simple key-value store, switch to the chrome.storage API. This API is available to the Content script and the popup, and comes with an event to notify you of value changes.
Example:
// Get notified of changes (in the popup?)
chrome.storage.onChanged.addListener(function(changes, areaName) {
// Do whatever you want with the changes.
});
// Initialization of the popup (print initial information?)
chrome.storage.local.get({keyName: 'defaultValue'}, function(items) {
// Do something with items.keyName
});
// Content script, storage (remember document title?)
chrome.storage.local.set({keyName: document.title});
Option 2: Pass messages to the background/event page
The popup and the background / event page share the same process. Any database tied to the popup is also available to the background page, and vice versa. A high-level overview of this method:
Content script sends a message to the background page.
The background page stores the value in the database
If the popup is open, update the popup's view.
If the popup is opened (so it was closed before), it should read the database (either directly, or by reading data from the background page using chrome.runtime.getBackgroundPage) and handle the results.
I've provided the code corresponding to this flow in this answer.
I am making an extension for chrome. It fetches data from webpages and emails it via local email client. I have a toolbar button which user has to click to invoke the script.
My script works for a few selected urls. I want my toolbar button to change icon based on whether the url is among our list or not. For example for site1 it should be redicon.png and for site2 it should be blueicon.png. I can change button icon using chrome.browserAction.setIcon. But the problem is that this API does not work in content script. It works fine in the background.js file but not in content.js. Kindly tell me how to achieve this.
I know using pageAction instead would do the trick but my client requirement is that the toolbar icon should change rather than appear and disappear.
What you need to read about is message passing. You are right, content scripts have limited chrome API. However, you can contact background page from content script and tell it to execute anything from chrome API for you. First, you need to create a listener on a background page that will be waiting for messages and then send a message from a content script.
I've read the message passing page repeatedly and tried multiple variations of it and I'm assuming I'm making a small mistake.
What I'm trying to do: I want to grab the background color of a page with a content script and then send that information to my popup (not a background page; I don't know if that matters) and then allow the popup to (simple example) write that variable in the popup.
Content scripts run in the same process as the webpage (the "tab" process). Popups run in the same process as the background page (the "extension" process).
It sounds like you want the popup to send a request to the content script using chrome.tabs.sendRequest. The content script should be listening for requests using chrome.extension.onRequest.
Or, you might do it the other way around: the content script sends the request to the extension using chrome.extension.sendRequest and the popup listens for requests using chrome.extension.onRequest. When you send a request from a tab to the extension, any page in the extension process (popups or background) can listen for that request.
See the message passing tutorial which includes examples that you can copy and paste.
Is it possible to catch the request of a page before it is sent out? I would like to check and modify the data sent out. For example if I have a text box on a page and the form was submitted I would like to get to the data of the text box using the extension modify it and then send it on it's way.
If any one can point me in the right direction that would be grate
Chrome has chrome.experimental.webRequest API module which allows to catch web requests before they are sent, but from the docs it doesn't look like you can modify them, just observe.
I think you would be better off injecting a content script to pages and listening to onbeforesubmit event on forms.