title: How to wait for a click() event to load in phantomjs before continuing?
body: <p>Phantomjs has these two really handy callbacks <code>onLoadStarted</code> and <code>onLoadFinished</code> which allow you to essentially pause execution while the page is loading.  But I've been searching and I can't find an equivalent for if you <code>click()</code> a submit button or hyperlink.  A similar page load happens but <code>onLoadStarted</code> doesn't get called for this event I guess because there isn't an explicit <code>page.open()</code> that happens.  I'm trying to figure out a clean way to suspend execution while this load takes place.</p>
  
  <p>One solution is obviously nested setTimeout's but I'd like to avoid this scenario because it's hacky and relies on trial and error instead of something reliable and more robust like testing against something or waiting for an event.</p>
  
  <p>Is there a specific callback for this kind of page load that I missed?  Or maybe there's some kind of generic code pattern that can deal with this sort of thing?</p>
  
  <p>EDIT:</p>
  
  <p>I still haven't figured out how to get it to pause.  Here's the code that doesn't call the <code>onLoadStarted()</code> function when I call the <code>click()</code> command:</p>
  
  <pre><code>var loadInProgress = false;
  
  page.onLoadStarted = function() {
    loadInProgress = true;
    console.log("load started");
  };
  
  page.onLoadFinished = function() {
    loadInProgress = false;
    console.log("load finished");
  };
  
  page.open(loginPage.url, function (status) {
      if (status !== 'success') {
          console.log('Unable to access network');
          fs.write(filePath + errorState, 1, 'w');
          phantom.exit();
      } else {
          page.evaluate(function (loginPage, credentials) {
              console.log('inside loginPage evaluate function...\n')
              document.querySelector('input[id=' + loginPage.userId + ']').value = credentials.username;
              document.querySelector('input[id=' + loginPage.passId + ']').value = credentials.password;      
              document.querySelector('input[id=' + loginPage.submitId + ']').click();
              //var aTags = document.getElementsByTagName('a')
              //aTags[1].click();
          }, loginPage, credentials);
  
          page.render(renderPath + 'postLogin.png');
          console.log('rendered post-login');
  </code></pre>
  
  <p>I double checked that the id is correct.  The <code>page.render()</code> will show that the information is submitted, but only if I put it in a setTimeout(), otherwise it renders it immediately and I only see the credentials inputted, before the page redirect.  Maybe I'm missing something else?</p>