title: Testing an event while an ajax call is in progress using Protractor + Angular
body: <p>I am using protractor 1.7.0 and angular 1.2.</p>
  
  <p>I have a functionality that when i click a button say 'Load Results' an ajax request is fired, meanwhile  the results are coming back I see a button say 'Cancel Request' (to cancel the ongoing ajax request, this button gets hidden when ajax response is received).</p>
  
  <p>Now to test it in protractor I am wirting something like this</p>
  
  <pre><code>//to load the results
  element(by.css('#load-results')).click();
  
  //to cancel ongoing ajax request to load results    
  element(by.css('.search-cancelled')).then(function(){
    element(by.css('.search-cancelled')).click();
  });
  </code></pre>
  
  <p>it gives me an error saying that element is not visible.</p>
  
  <p>As far as i know protractor waits for angular to resolve its promises before executing the next statement. So till the time it reaches this code</p>
  
  <pre><code>element(by.css('.search-cancelled')).then(function(){
        element(by.css('.search-cancelled')).click();
      }); 
  </code></pre>
  
  <p>the ajax call has returned and thats why the element gets hidden.</p>
  
  <p>Is there a way i can make protractor not wait for the angular promise and execute my code when the ajax request is going on?</p>