Test HTML5 menuitems from within Greasemonkey

HTML5_menuitems.us.js

// ==UserScript==
// @name           Test menuitems in HTML5
// @namespace      http://esquifit.myopenid.com
// @description    Test menuitems in HTML5
// @include        *
// ==/UserScript==

// After a suggestion from Johan Sundström in the Greasemonkey Dev list:
// https://groups.google.com/d/msg/greasemonkey-dev/gLiizYy8VOo/q3_L5HejevsJ

var icon="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAXCAQAAACVbWY0AAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sCCgw7Ce0kW7AAAAACYktHRAAAqo0jMgAAAOVJREFUKJGdUMEKgkAQfc5ukZQoHoJAMaJL4LGP6Rbdo3N/0J/1A32Al055SKGUYtPGJEg2OzSPgdl5vLczQwAMCHRhoo8Bp8m1gEHclvzwEWL+Qsi1CUnM9jBzgp2KLuU1uuyUE2CGHqED37EOyTYbxziO4212SIY2fGKj0Sb1UqS4o+Tken3GqCKsZY6cm2/kqxwWgc0mCuqDUJ5Cp57qgaKBRzVVZVZokPRar9QgaqtWhU78UlRHyYzrJ5DVCgE9/iToC0H1518Voo2wpaH3JRtN3RPfphmlG5O8Lfa8aTOKxf4JITp52BrKXVUAAAAASUVORK5CYII=";


var menu =  
    <menu type="context" id="someMenu">
      <menuitem label="Shallow" onclick="alert('foo')"
              icon={icon}>
      </menuitem>

      <menu label="Deep">
              <!-- for some reason the menutiems must have a content to be correctly displayed -->
              <menuitem icon={icon} label="1stsubitem" onclick="alert('bar')">Dummy</menuitem>
              <menuitem icon={icon} label="2ndsubitem" id="second" >Dummy</menuitem>
      </menu>
    </menu>;

var menuDiv = document.createElement('div');
document.body.appendChild(menuDiv);
menuDiv.innerHTML = menu;
document.body.setAttribute('contextmenu', 'someMenu');
document.getElementById('second').addEventListener('click', function(){ alert('from Greasemonkey')}, false);