Created tab always open the url in the same tab - google-chrome

Question

I have the following sample.js for Google Chrome extension and I would like to know if there is a way that make it able to open url in the same tab every time:
function getword(info,tab) {
chrome.tabs.create({
url: "http://translate.google.com/#en/ar/" + info.selectionText,
})
}
chrome.contextMenus.create({
title: "Translate: %s",
contexts:["selection"],
onclick: getword,
});
The extension send the selected text on the page to be translated on Google translate and I want every time the user uses it to open in the same Window's tab.

Answer 1

Us a variable to track if you have created a tab and once you have use chrome.tabs.update to update it instead of opening a new one. I think users will find this experience confusing though since sometimes a new tab is opened and sometimes there isn't. You will also have to handle the error situation if the users has closed the tab you are trying to update.
var tabId = false;
if (tabId === false) {
chrome.tabs.create({
url: "http://translate.google.com/#en/ar/" + info.selectionText,
}, function(tab) {
tabId = tab.id;
});
} else {
chrome.tabs.update(tabId, {
url: "http://translate.google.com/#en/ar/" + info.selectionText,
});
}

Answer 2

I had a similar requirement to avoid opening multiple tabs for the same URL. I also employed tabs.query to check if a tab with the URL property matching the new tab was already open. If so then I inform the user via a msg box with a 'yes' or 'no' button asking if he wants to open a new tab or over-write the current matching tab. If 'yes' then I tabs.update the already open tab with the url of the newly created tab and close the new tab. It is a bit cluggy but seems to work. I initially found the tabs.query function confusing but eventually have grown to like it.
In the code below I am doing something slightly different. I want to know if the browser has open a tab with the title of 'Agent Home'. If yes then I update that tab after retrieving its tab.id with the tab.url of the newly created tab. In a different scenario, I check if a tab containing "PAMM v4.0" in its title is open. If so I pop a message box then either close the newly created tab. I am in the process of opening the new tab but making it tabs.inactive.
chrome.tabs.onCreated.addListener(function funcName (tabs) {
var tabID = 0;
var tabURL = "";
var tabTitle = "";
var length = 0;
var HomeOrV4 = "";
chrome.tabs.query({}, function(T){
length = T.length;
if(length >0){
for(var i = 0; i<T.length; i++){
tabTitle = T[i].title;
tabID = T[i].id;
tabURL = T[i].url;
if(tabTitle == "PAMM - Agent Home"){
HomeOrV4 = "Home";
return;
}
if(tabTitle == "PAMM v4.0"){
HomeOrV4 = "V4";
return;
}
}
}
});
});
chrome.tabs.onUpdated.addListener(function(id, status){
var V4tabID = 0;
var V4TabURL = "";
var AHPtabID = 0;
if(status.status == "complete"){
console.log("Tab loaded ");
chrome.tabs.query({title:"PAMM - Agent Home Page"}, function(Tabs){
if(Tabs.length>1){
Tabs.remove(Tabs[0].id);
}
if(Tabs.length = 1){
AHPtabID = Tabs[0].id;
//chrome.tabs.remove(V4tabID );
}
});
chrome.tabs.query({title:"PAMM v4.0"}, function(Tabs){
if(Tabs.length > 1){
var r = confirm("You need to complete the open Guest Card. Press OK to continue ...")
if(r==true){
chrome.tabs.update(Tabs[Tabs.length-1].id,{active:false});
//chrome.tabs.remove(Tabs[Tabs.length-1].id);
chrome.tabs.update(Tabs[0].id,{selected:true});
}
}
if(Tabs.length == 1){
tabID = Tabs[0].id;
if (AHPtabID >0){
chrome.tabs.remove(AHPtabID);
}
V4TabURL = Tabs[0].url; }
});
}
else{
console.log("Tab loading");
}
});

Answer 3

In addition to above answers, you need to add permission to access tabs in the manifest file, in case you want to access url, title, or favIconUrl properties of tabs.
"permissions": ["contextMenus", "tabs"],