How can I programatically click the “compose” button in GMail with greasemonkey?

Question

I am creating a script for GMail, which requires me to duplicate various links on left side like inbox, all mail, spam and compose. I have all the links working except compose. I can't figure out what's going when I click on. You can find my code below. I'd appreciate any help

// ==UserScript==
// @name           GMC Test
// @namespace      com.pbg
// @description    test
// @include        http*://mail.google.com*
// ==/UserScript==

//loading function
function tryAgain(tries) {
    setTimeout(function() { init(tries++); }, 1000*tries);
}

//gets a node by XPath
function getNodeByXPath(expression, parent) {
   var r = parent.evaluate(expression, parent, null, XPathResult.ORDERED_NODE_ITERATOR_TYPE, null);
   return ((r != null) ? r.iterateNext() : null);
}

//initialize
function init(tries) {

   tries = tries || 0;
   if (tries > 3) return; // give up, too many tries
   // Locate the canvas_frame iframe
   var f = document.getElementById("canvas_frame");
   if (f == null) return tryAgain(tries);
   // Locate the document
   var doc = f.contentWindow.document;
   if (doc == null) return tryAgain(tries);
   // make sure all the links are loaded
   if (getNodeByXPath("//a[contains(@href,'#inbox')]", doc) == null) return tryAgain(tries);

   go();
}
function go() {

   function fireEvent(xPath,event)//https://developer.mozilla.org/en/DOM/element.dispatchEvent
   {
      var evt = document.createEvent("MouseEvents");
      evt.initMouseEvent(event, true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
      var cb = getNodeByXPath(xPath, doc);
      var canceled = !cb.dispatchEvent(evt);
      GM_log("event canceled = " + canceled);
   }
   var doc = document.getElementById("canvas_frame").contentWindow.document;

   //THE LINE BELOW WORKS
   //setTimeout(function(){GM_log("let's click starred!");fireEvent("//a[contains(@href,'#starred')]", "click")}, 5000); 

   //THIS DOENS'T WORK
   setTimeout(function(){GM_log("now let's click compose!");fireEvent("//div[@class='J-Zh-I J-J5-Ji L3')]", "click")}, 5000);
}

window.addEventListener('load', init, false );

Answer 1

If you are using the newer AJAX-y style GMail, you could just change the href of the page to the compose url as follows* and just let the page's event handlers trigger/handle the hashtag change as usual:

document.location.href = "#compose";

Alternatively, if you are using the basic HTML view, you can use xPath to find the compose mail anchor and alter the document.location.href to match whatever the link points to.

I'm sure a more elegant/resilient to change xPath can be written but a brief look just now indicates that it has an accesskey attribute set to c which is probably distinctive enough to hunt the correct link:

var nodesSnapshot = document.evaluate(
    '//*[@accesskey="c"]', 
     document,
     null,
     XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
     null
  );

document.location.href = nodesSnapshot.snapshotItem(0).href;

*nb: both have been tested and are working within the Firebug but might work differently in a Greasemonkey script due to the use of iFrames in the AJAX-y view / other factors etc