I want to trigger the popup/opening of a chrome extension programatically from a website. Metamask (browser wallet) is doing exactly this when you navigate to a website and press the button "connect to metamask". In fact it's not actually opening the extension like when pressing the extension icon, but it opens a new browser window with the same size loading the extension...
Any idea how to achieve this?
Here's the way I found meanwhile:
post a message from the website to itself via window.postMessage()
content script has an event listener and catches this message
content script sends another message to the service worker (aka background script)
background script has a message listener and creates a new window via chrome.windows.create(<url-to-extension-html>, <height-and-with-same-as-extension>)
Related
When I display a message from the Chrome extension in the console, I need to open the background page and see the console in it.
Is it possible to somehow make it more convenient - so that these messages are displayed in the console of the event page, without opening additional windows and consoles?
I'm trying to open a popup page from DOM event in content script js file.
I Tried to send message to background page and in the background listener to use:
chrome.browserAction.openPopup() but apparently it's not the way cause browserAction not defined in that context.
The extension is for audio streaming, so while browsing that the audio will keep playing in background.
I managed to make the audio playing work in the simple way: when clicking the extension icon => open's the popup => some event in the popup interact with the from the background and play's the music.
I want to make it work in the following way:
Content script will add button to the user web page(any page).
done
Clicking this button will open the popup, and from there, same logic.
The issue is that I don't know how to open the popup from the content script.
It's actually to trigger to extension icon click from code.
Any ideas?
I'm currently developing an extension that comes in different parts:
- background script (Chrome background.js
- content script (Chrome content-script.js)
- popup script (popup.js and loaded from the iFrame)
- iframe.html (iframe to be loaded when user activate the extension)
It works great except that I lose all the settings/context (used in the popup script to display info in the iframe) when the user change of page or reload the page in the tab.
Technically I want to isolate the extension per tab (each tab can have its own config) but when a user navigate in a same tab the context should be kept.
Question is: what is the best way to achieve that?
I'm thinking about persisting all the context in the content script and reload it when the event chrome.tabs.onUpdated is fired. Is it the right approach?
I recommend you to read about chrome.storage. You can store data there, both background and content script have access to it.
And probably you will need chrome.runtime.sendMessage and chrome.runtime.onMessage to have conversation between background and content. Each time content script runs in a tab it can request background whether this tab have some existing data or not.
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.
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.