Dynamic context menu in Google Chrome. Runtime error?

The code below works fine for 2 selections, but fails on subsequent selections.

Content.js -

document.addEventListener('selectionchange', function(event){
            var selected = window.getSelection().toString().trim();
            chrome.extension.sendMessage({
                   'message': 'updateContextMenu', 
                   'selection': selected});
}, true);

      

        
        
        
      

    

BackgroundScript.js -

function SelectionType(str) {
  if (str.match("^[0-9]+$"))
      return "number";
  else if (str.match("^[a-z]+$"))
      return "string";
  else
      return "other";
}
var optionOne = {'enabled': true, 
        'title': "Some Title One '%s'", 
        "contexts": ["selection"],
        'onclick': functionOne
        };
var optionTwo = {'enabled': true, 
        'title': "Some Title Two '%s'", 
        "contexts": ["selection"],
        'onclick': functionTwo
        };
var cmid = null;
// a message listener that will modify the context menu
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.message == 'updateContextMenu') {
        if (request.selection !='') {
          var type = SelectionType(request.selection);
          if (type == "number") 
                if(cmid != null) {
                    chrome.contextMenus.update(cmid, optionOne); 
                }
                else {
                    cmid = chrome.contextMenus.create(optionOne);
                }
          else if (type == "string")
                if (cmid != null) {
                    chrome.contextMenus.update(cmid, optionTwo);
                }
                else {
                    cmid = chrome.contextMenus.create(optionTwo);   
                }
        } else if (cmid != null) {
            chrome.contextMenus.remove(cmid);
            cmid = null;
        }
    } else {
        sendResponse({});
    }
});
function functionOne(info, tab) {
    console.log("Function One");

    chrome.tabs.create({ 
        url: "some url" + info.selectionText,
    })
}

function functionTwo(info, tab) {
    console.log("Function Two");

    chrome.tabs.create({ 
        url: "some url" + info.selectionText,
    })  
}

      

        
        
        
      

    

Getting the following error while creating a context menu. I don't really understand why this is crashing.

Error in event handler for runtime.onMessage: Error: Invalid value for argument 1. Property 'generatedId': Unexpected property. on chrome-extension: // acpffpbkehpfofhgilcophibgbkhmmba / script.js: 46: 42handler @extensions :: uncaught_exception_handler: 8exports.handle @extensions :: uncaught_exception_handler: 100EventImpl.dispatch_ @extensions :: event_bindexsions: 38 ... (Anonymous function) @extensions :: SafeBuiltins: 19publicClass. (Anonymous function) @extensions :: utils: 94messageListener @extensions :: messaging: 188target. (Anonymous function) @extensions :: SafeBuiltins: 19EventImpl.dispatchToListener @extensions :: event_bindings: 395target. (anonymous function) @extensions :: SafeBuiltins: 19publicClass. (anonymous function) @extensions :: utils: 94EventImpl.dispatch_ @extensions :: event_bindings: 379EventImpl.dispatch @extensions :: event_bindings: 401target. (anonymous function) @extensions :: SafeBuiltins: 19publicClass. (anonymous function) @extensions :: utils: 94dispatchOnMessage @extensions :: messaging: 316