I'm building my first basic chrome extension that when clicked, it takes the url of the current tab, opens a new page at a different address (always the same url) and sends the copied url to it.
I have this working, but for 1 issue. Every time the user clicks the extension, it injects the script. So if they click the extension a second time for the same tab, it will open 2 tabs new tabs, then 3 tabs on the third click, and so on.
I thought I had solved it using this solution but now what happens is when a user clicks the extension for a given tab, it will only open it once, even after 2, 3, 4 clicks (which is good), but if a user switches to a different tab and clicks the extension, nothing happens.
I can kind of see why this is happening, I guess it's now setting a flag for all tabs so once the script is injected in a tab, regardless of which tab, the flag is set and any future injection attempts are blocked. I'm trying to figure out how to set a flag just for the tab that was clicked, and not for all tabs?
Ultimately, I just want the user to be able to click the extension and it will open 1 tab per click.
This is my code
background.js
// Do this when the browser extension icon is clicked
chrome.browserAction.onClicked.addListener(tab => {
// inject content.js into activeTab
if (window.qqq !== true) {
window.qqq = true;
chrome.tabs.executeScript(tab.id, {
file: "content.js"
});
}
// Message the active tab to say the extension button has been clicked
chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
let activeTab = tabs[0];
chrome.tabs.sendMessage(activeTab.id, {
message: "add_url_clicked",
});
});
});
// Listen for a URL and when received, open the app and append the requested
// URL using HTTP GET
chrome.runtime.onMessage.addListener(request => {
if (request.message === "open_links_app_with_new_url") {
chrome.tabs.create({
url: request.app + "/?url=" + request.destination
});
}
});
content.js
// Listen for a browser click and when received, open a new tab with the url created below
chrome.runtime.onMessage.addListener(request => {
if (request.message === "add_url_clicked") {
// Get URL to send to app
let destination = window.location.href;
localStorage.setItem('url', destination);
chrome.runtime.sendMessage({
message: "open_links_app_with_new_url",
app: "https://destination_url",
destination: destination
});
}
});
and if it helps, manifest.json
{
"name": "Links",
"manifest_version": 2,
"version": "0.2",
"description": "etc",
"browser_action": {
"default_icon": {
....
}
},
"permissions": ["activeTab"],
"background": {
"scripts": ["background.js"]
},
"icons": {
....
}
}