I am trying to make a chrome extension. My background script fires on a button press in the ui. It should send a message to my content script, which is going to send a response back to the background script. Can't quite figure out how this is supposed to work. The click listener is firing, but the messaging does not work. Here is what I got so far:
Background Script:
$(document).on('click', '#getGlobalFuncsBtn', function(){
chrome.extension.sendMessage({text:"getStuff"},function(reponse){
if(reponse.type == "test"){
console.log('test received');
}
});
console.log('click listener');
});
Content Script:
chrome.extension.onMessage.addListener(function(message,sender,sendResponse){
if(message.text == "getStuff"){
console.log('test sent');
sendResponse({type:"test"});
}
});
Popup HTML:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<button id="getGlobalFuncsBtn">Get Global Funcs</button>
<script src="jquery-2.0.2.min.js"></script>
<script src="background.js"></script>
</body>
</html>
manifest.json:
{
"manifest_version": 2,
"name": "Var Viewer",
"description": "This extension allows you to view and change all user defined js global vars.",
"version": "1.1",
"permissions": [
"storage"
],
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["jquery-2.0.2.min.js","content.js"]
}
],
"web_accessible_resources": [
"jquery-2.0.2.min.js"
],
"background": {
"scripts": ["background.js"],
"persistent": true
},
"browser_action": {
"default_icon": "icon.png",
"default_popup": "pop.html",
"default_title": "Var Viewer"
}
}