I'm trying to make an extension that will collect some data from currently opened tab on Google chrome.
I also use a popup in my extension to provide a control interface (buttons and stuff).
I need to be able to do the following:
1) Read source code of currently opened tab.
2) To be able to scroll down window content (using the code of course) .
If I could only get access to a javascript "window" object of currently opened tab , that would be enough.
But I'm open for another suggestions .
Can anyone help ?
You can simple use document in a content_script. Content scripts are defined in the manifest.json. In your case you should set "run_at": "document_end", so the dom is fully loaded when your script is called.
For more informations about content scripts and chrome extension development you find an easy to use guide from google - http://code.google.com/chrome/extensions/content_scripts.html
Code from popup won't be able to access directly to window objects from displayed tabs. You have to use a content script which will be able to send the source code of opened tab to the background page. This content script will also be able to scroll the window of opened tab.
Related
I am trying to migrate my extension which records screen/tab/window according to the chosen option from manifest V2 to V3. In manifest V2 I was able to use background script as persistent and reach html page objects such as mediaRecorder, navigator. However in manifest V3 background script works as a service worker. So, I have to start the screen record in content-scripts to be able to reach the html objects. When I start chrome.desktopCapture API from the background script, I have to start the screenRecord in one of the tabs (should give a tabid to chrome.desktopCapture.chooseDesktopMedia API call). I cannot start it on the background page and when the page was refreshed or changed to a new URL screen record stops. Is there any workaround for this?
I believe the best way to handle updates such as a URL change on a tab is to attach the onUpdated listener to the chrome tabs in the background script.
chrome.tabs.onUpdated.addListener(function(tabId, changes, tab) {
//Detect Type of Change and Handle Accordingly
});
There are quite a few other events that may be of use that are listed in the chrome documentation Chrome Tabs Events. It's also possible to inject inline JavaScript from the content script so you can access the pages window object directly and attach event listeners there to handle reloads or URL changes. Check this stack overflow post for more information Modify Window Object in Chrome Extension
When an extension is installed in chrome, a popup comes up which says [Extension_name] has been added to chrome.
This is the default popup having extension icon and some message. I want to modify this popup data. is there any api which we can use to modify it.
There is no such API, but you can use onInstalled event to open new tab with your own description.
In addition to Deliaz's answer, you can create either a browser action or a page action popup. You can change popup html dynamically to make it look completely different depending on the situation but you can't open it programmatically (desktop notifications could be used for alerts).
Here's another reference which might also help.
I am trying to develop a chrome extension which saves the url of webpages opened in all tabs and then load them whenever needed. Now I know content scripts, background scripts and popup.js. Content scripts mainly deal with the content of the loaded webpage and they have less chrome api interactions, background scripts are executed in an isolated environment and we can use all chrome api methods, popup.js is simply javascript that runs in context of popup.html.
Now here is my problem, I have a button in popup.html named "save" and on click of that button I want to save all the webpage urls opened in multiple tabs under one window. How can I do that?
Should I write a content or a background script?
Sorry for my noobish question. I am new to chrome api. Any help/suggestions?
Neither content script or background page is needed. You could do that just in popup.js, since popup page actually runs in the same context with extension.
In your popup.js, just call chrome.tabs.query to get tab info, including url (you would need to declare tabs permissions in manifest.json). If you want to specify window id, either use WINDOW_ID_CURRENT or retrieve it through other ways (depends on your logic)
chrome.tabs.query({ windowId: YOUR_WINDOW_ID }, (tabs) => {
tabs.forEach((tab) => console.log(tab.url));
});
I want to build app that would allow me to open website, select some data from this website and send them to my server. I imagine that it works in this way:
Application id displayed in browser sidebar sidebar
I open certain website
Select address (City) on opened website
Click "City" button on sidebar
"City" value is copied from website to sidebar
Select address (Zip code) in browser
Click "Zip code" button on side bar
"Zip code" value is copied from website to sidebar
... (and so on)
Finally I click "submit" button on sidebar and data is send to server.
What will be better option for such use case? Chrome app or chrome extension? I am not sure if there is way to display sidebar using chrome extension. I also haven't seen in reference option to open certain url in chrome app. Any advises will be appreciated.
I guess an extension would be more appropriate as it is just one click away from the website you want to select some data from. The user interaction could be done in various ways:
select text and use the context menu (right mouse click) to activate the extension logic
activate extension via toolbar and add UI as a part of the website being viewed or in a separate window
You can pop up a window, but it will disappear when you click back on the website. You can manually create a "sidebar" by having your extension open a new window whose url is inside the extension and subsequently manually placing it alongside the browser window.
Unfortunately there is no sidebar feature for chrome extensions. That would be cool if there were, though.
I am developing a chrome extension. I am able to pass a message from background page to popup extension when a context menu is clicked if i open the popup page with "Inspect pop-up" selection. Because it stays open in this way.
But if I click the context menu when the popup page is not opened, no message received by it.
Do you have any suggestions to open popup automatically, make it stay open or send message to it when even if it is not active.
There is no way to pragmatically open a popup window. Popup windows are only active when the popup is open which is why you cant send messages to it when it is closed.
You could either queue messages in the background page and have them retrieved the next time the popup window is opened. Or depending on the functionality you might look into using HTML5 desktop notifications instead.
Instead of sending stuff to the popup, the popup should request what it needs when it is opened.
Because the popup is just an HTML page, it doesn't exist until it has been opened.
Basically, like abraham mentioned, you would store any information in the background, using localStorage or chrome.storage. When the popup opens, it should then use the chrome.extension.getBackgroundPage() function to get a reference to the background, which can provide access to the stored information.
If you are using localStorage or chrome.storage, you may be able to access it directly, without using the background, as storage is shared across the whole extension.