Chrome tab.create and tab.getSelected - google-chrome

Question

I have some problems to pass message from background page to my content_script.js. I hope someone can point out where i am wrong.
background.html
//in a function
function myFunction() {
chrome.tabs.create({"url":"myurl","selected":true},function(tab){
updateTab(tab.id);
});
}
//update Created new tab
function updateTab(tabId){
chrome.tabs.getSelected(null, function(tab) {
makeRequest(tab.id);
});}
//make request
function makeRequest(tabId) {
chrome.tabs.sendRequest(tabId, {greeting: "hello"}, function(response) {
console.log(response.farewell);
});
}
content_script.js
chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
console.log(sender.tab ?
"from a content script:" + sender.tab.url :
"from the extension");
if (request.greeting == "hello")
sendResponse({farewell: "goodbye"});
else
sendResponse({}); // snub them.
});
manifest.json
"permissions": [
"tabs","notifications","http://*/*"
],
"content_scripts": [
{
"matches": ["http://*/*","https://*/*"],
"js": ["content_script.js"]
}],
My problem is the request from background.html has never been passed to the content_script.js. I think there must be some problems about the sequence of creating new tab and selecting that tab, but i do not know how to fix this.
Thanks.
EDIT:
There is what i have done so far.
background.html
chrome.browserAction.onClicked.addListener(function(tab) {
var tabId = tab.id;
chrome.tabs.getSelected(null, function(tab) {
validate(tab.url,tabId);
});
});
function validate(url,tabId) {
var filter = support(url);
if(filter!=null) {
getHTML(tabId,url,filter);
}
else{
var notification = webkitNotifications.createHTMLNotification(
'notification.html' // html url - can be relative
);
notification.show();
setTimeout(function(){
notification.cancel();
}, 10000); //10 sec
}
}
function getHTML(tabId,url,filter) {
console.log("request");
chrome.tabs.sendRequest(tabId, {action:"getHTML"}, function(response) {
var html = response.html;
console.log(html);
var taburl = ("some thing on server");
chrome.tabs.create({"url":taburl,"selected":true}, function(tab){
var tabId = tab.id;
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo){
if(changeInfo.status == "loading"){
console.log("loading");
}
if(changeInfo.status == "complete"){
chrome.tabs.onUpdated. removeListene(arguments.callee);
updateTab(tabId,url,filter,html);
}
});
});
});
}
function updateTab(tabId,url,filter,html) {
chrome.tabs.sendRequest(tabId, {action:"updateTab"}, function(response) {
//submit form
chrome.tabs.executeScript(tabId, {code: 'document.getElementById(\"hiddenbutton\").click();'});
});
}
content_script.js
chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
var action = request.action;
console.log(action);
if(action == "getHTML") {
var html = document.body.innerHTML;
console.log(html);
sendResponse({html:document.body.innerHTML});
}
else{
//do update on page from server
sendResponse({});
}
});
It works as i expected, but there are still some points that i do not understand, espically removing listener chrome.tabs.onUpdated.removeListene(arguments.callee);. I hope if someone can have a chance to have a look and correct me if any thing is wrong. Thanks.

Answer 1

The background.html can be simplified to:
//in a function
function myFunction() {
chrome.tabs.create({"url":"myurl","selected":true}, function(tab){
makeRequest(tab.id);
});
}
//make request
function makeRequest(tabId) {
chrome.tabs.sendRequest(tabId, {greeting: "hello"}, function(response) {
console.log(response.farewell);
});
}
If it still doesn't work correctly then it might be because the tab hasn't finished loading (log tab.status in the chrome.tabs.create callback to check if this is true). There are two solutions for this, or you add an listener to chrome.tabs.onUpdated while filtering for this tab id or you make the tab send the request instead of background.html.