Message listener only begins firing after browserAction has been clicked - google-chrome-extension

Question

It appears that a message from content to background only begins firing after backgroundAction has been run at least once.
In the below code example, a click on browserAction turns the page red, and a click on the page body turns the page blue (via a message sent by the content script).
If I click the page body first, nothing happens. It only begins working after I've clicked browserAction once.
Why is this happening and how can I make it so the message listener fires without having browserAction run first?
Any help would be greatly appreciated!
content.js
$(function(){
$('body').on('click', function() {
// Send a message to background.js
chrome.runtime.sendMessage(true, function(response){
console.log(response);
});
});
});
background.js
// Make background red when browserAction is cliked
chrome.browserAction.onClicked.addListener(function(){
chrome.tabs.executeScript( {
code: 'document.body.style.backgroundColor="red"'
});
});
// Make background blue when any message is received
chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse){
chrome.tabs.executeScript( {
code: 'document.body.style.backgroundColor="blue"'
});
return true;
})

Answer 1

As always in such cases use the debugger. The error I'm seeing here in the extension's background page console which can be opened on chrome://extensions page:
Unchecked runtime.lastError while running tabs.executeScript: Cannot access contents of url "...". Extension manifest must request permission to access this host.
When runtime.onMessage is executed after a message from the content script Chrome doesn't know that executeScript was initiated by a user action so the code is blocked.
As for browserAction.onClicked, it is always invoked on user's interaction so "permissions": ["activeTab"] is sufficient for the code executed in the eventjob context of the issued click. And it creates temporary permission to modify the active tab, see the documentation:
The following user gestures enable activeTab:
Executing a browser action
Executing a page action
Executing a context menu item
Executing a keyboard shortcut from the commands API
Accepting a suggestion from the omnibox API
Solution #1 (the best) would be to avoid injecting any code from the background script and do everything in the content script based on messages from the background script.
Solution #2 would be to add the required permission to manifest.json:
"permissions": ["activeTab", "<all_urls>"]