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?
Related
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>)
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.
Is there a way to run/execute a Chrome Extension in a new tab/window by loading the extension's code in that new tab or window?
Right now, the only way I know to get "free hosting" from Google for my Chrome extension, is to use the popup window as my main application window. That works fine, except for the fact that the popup window will close if you click on a different tab. So I think I need a different type of window as my main application window.
My only guess, is that you could set the window.location of the new tab to something like chrome://extensions/<my-extension-id> but that doesn't seem to work.
Can anyone alleviate my confusion? How to create a runtime for a Chrome app that isn't the popup, but isn't a native app, and isn't hosted by some web server other than Google's servers?
One thing I was thinking of was something like this:
https://gist.github.com/danharper/8364399
holy crap that was harder than it needed to be.
So you eventually end up at a url like this:
chrome-extension://<your-extension-id>/dist/index.html
to programmatically load a new tab or window, use this code in your background script:
chrome.tabs.create({url: chrome.extension.getURL('dist/index.html')});
in my case my app page, is located at dist/index.html, whereas my popup page will live at popup.html.
So the popup window looks something like this:
x Load extension in new window
x Load extension in new tab
the user selects one of those, and the background.js script can call the above code to load the page, which will load the html file from your extension codebase that you so desire.
Had a qq: is it possible to launch an extension (that is already installed) when someone clicks on a link ?
For example, let's say on my website I have a button that says "click here to launch the extension". After they install my chrome extension, when a user clicks on this button, could the extension launch? (e.g.- the popup to open).
The goal is this: I have an extension that acts like a search bar. I also have search on the website, but I wanted it to search using the extension instead of the website if a user chooses to.
Thanks for any info,
Y
If you are asking for a way to programmatically open the extension's popup, then you will be disappointed (as it cannot be done).
If it serves your purpose, you could do something like this:
Have your extension inject a content script into your webpage.
Have the content script bind to a button's click event.
When the button is clicked: Pass some parameters to the extension's background page, let the extension perform the search and send the results back to the webpage.
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.