My background page saves data about the current active tab to chrome.storage.local. For arguments sake lets say it's the page title. Multiple page titles will be in there if the user has multiple tabs open.
When the browser action button is clicked I want to open a new tab with my internal extension page showthedata.html (not an external URL) which will show the data saved for the active tab.
Ideally I'd want to open showthedata.html?tabID=123 which would then pull the corresponding data
I must be missing something basic, but how can showthedata.html show the data relating to the active tab?
If you use your extension's URI as the URL of your new tab, it will allow you to use the API's messaging and storage systems from your new tab.
Create a New Tab
chrome.tabs.create({url: "chrome-extension://<your_extension_id>/path/to/file.html"})
Once you get that set up, you can pass variables to or request variables from your new tab via the Chrome API messaging system or storage system (provided you've built the proper functionality into your extension's various parts).
Note: The chrome.tabs namespace is not accessible from within a Chrome tab. It must be called from either your background script(s) or popup.
Related
Chrome DevTools has a handy inspector for Local Storage and Session Storage, but is there nothing to inspect chrome.storage.sync?
chrome://sync-internals/ doesn't seem to display the actual contents of the synchronized storage per extension.
Storage Area Explorer extension provides a UI for viewing, editing, clearing, importing and exporting of chrome.storage.local, chrome.storage.sync, localStorage and sessionStorage.
In the future this feature may be implemented natively: https://crbug.com/848752.
Warning for ManifestV3: since devtools for service worker doesn't show storage, you'll have to open any visible page of your extension like the popup or options, right-click the page, then click "inspect", then go to Storage Explorer. If your extension doesn't have any visible pages, you can open chrome-extension://ID/manifest.json where ID is the id of the extension as shown in chrome://extensions page. Another method is to right-click any script from your extension in devtools (when you inspect the content script or service worker), then click "Open in a new tab". You can add a bookmark for this tab to open it quickly next time.
Visit chrome://sync-internals/
Click Sync Node Browser tab and wait for it to load (may give a blank screen or in progress cursor)
Click expansion triangle in the sidebar for Extension settings
Click on individual settings in the sidebar to see their values and other metadata
A poor workaround is to call get and obtain all the stored values. Of course, this doesn't let you conveniently edit them:
chrome.storage.sync.get(null, function callback(items) { console.log(items) });
Chrome DevTools has a handy inspector for Local Storage and Session Storage, but is there nothing to inspect chrome.storage.sync?
chrome://sync-internals/ doesn't seem to display the actual contents of the synchronized storage per extension.
Storage Area Explorer extension provides a UI for viewing, editing, clearing, importing and exporting of chrome.storage.local, chrome.storage.sync, localStorage and sessionStorage.
In the future this feature may be implemented natively: https://crbug.com/848752.
Warning for ManifestV3: since devtools for service worker doesn't show storage, you'll have to open any visible page of your extension like the popup or options, right-click the page, then click "inspect", then go to Storage Explorer. If your extension doesn't have any visible pages, you can open chrome-extension://ID/manifest.json where ID is the id of the extension as shown in chrome://extensions page. Another method is to right-click any script from your extension in devtools (when you inspect the content script or service worker), then click "Open in a new tab". You can add a bookmark for this tab to open it quickly next time.
Visit chrome://sync-internals/
Click Sync Node Browser tab and wait for it to load (may give a blank screen or in progress cursor)
Click expansion triangle in the sidebar for Extension settings
Click on individual settings in the sidebar to see their values and other metadata
A poor workaround is to call get and obtain all the stored values. Of course, this doesn't let you conveniently edit them:
chrome.storage.sync.get(null, function callback(items) { console.log(items) });
simple question about the ability of chrome extensions.
Is it possible to for example hit an extension button and write the url (or other content of a page) to an endpoint of a open tab. For example, tab 1 is a web application that gathers bookmarks (so not locally stored) and if I hit a button in tab 3 I want to make a POST call to tab 1. Or can something like this be achieved by storing information in the Chrome storage which can then be read by the application in tab 1?
So quite simply:
tab 1 (:web application) - gets POST request -> tab 3 (:just a web page) through the click of a button of an active extension. I know if this would exist it could lead to some security issues, hence the question.
I’ve been placing a page action on the options page of my Chrome extension. options.js calls chrome.runtime.connect({"name":"someName"}), and background.js has
chrome.runtime.onConnect.addListener(function(port) {
chrome.pageAction.show(port.sender.tab.id);
});
Unfortunately, in the new options_ui with the recommended default (and someday mandatory) "open_in_tab":false, the Sender's tab won't be set. Is there a way to get the tab id in order to show the page action?
I could use tabs.query to get the chrome://extensions/ tab, but that requires the tabs permission, which I currently don’t need. Active tab seems like it would work, but it doesn’t provide the tab id and isn’t enabled by opening an option dialog (source).
(Why do I want the page action on my options page? The extension works with a website that is only available ~7-10 weeks per year. I’d like my users to be able to interact with the extension the rest of the time, so that they can get used to the process. But I don’t want to adjust the displayed extension permissions just to do so. I can accomplish this by having the options page pretend to be the website in question.)
I have a chrome extension which allows the user to perform actions and build up data. How can I get my chrome extension to open a new tab to allow my user to interact with the data they've accumulated? I could build a separate web app service where I pass the users data to. I currently persist the users data in local storage but I want a way for them to view/edit that data.
Not sure what exactly to google to get a chrome extensions to launch a new page under it's url...
Edit:
Ideally I'd like for my user to press a button from the popup.html popup to open up the new tab, if possible.
I got it to work, basically from the popup.html page I can make this javascript call,
chrome.tabs.create({url: chrome.extension.getURL('dashboard.html')})
where 'dashboard.html' is file belonging to my chrome extension.