Not able to send Message from popup.js to event.js

Question

I am trying to send rate entered by user in popup.html to event.js via popup.js but I dont know why it is not working I tried to add alert in event.js to see if rate is coming from popup.js and alert is working correctly but still I am not able to do the desired work

 event.js
 var item={
"id":"selected text",
"title":"Speak",
"contexts":["selection"]
   };
var rate; chrome.runtime.onMessage.addListener(function(request,sender,sendResponse){
    if(request.todo=="changerate")
    {
        rate=request.rate;
    }
});
 chrome.contextMenus.create(item);
chrome.contextMenus.onClicked.addListener(function(clickData){


alert(rate);
if(clickData.menuItemId=='selected text' && 
    clickData.selectionText){
    chrome.tts.speak(clickData.selectionText,{'lang':'en- 
    US','rate':parseInt(rate)});
}
   })
 /////////////////////////////////////////
popup.js
$('#submit').click(function(){
var rate=$('#rate').val();
chrome.runtime.sendMessage({todo:"changerate",rate:rate});
});

I am just trying to change rate of speaken voice according to user but it is not working showing errors like Unchecked runtime.lastError: The message port closed before a response was received.