AngularJS Protractor - How to check AJAX login?

Question

I have a button that, after clicking, sends an AJAX call in Angular format $promise. When the input is successfully completed, the variable $scopeand the element change , which looks like this:

<section id="logged-in-section" ng-if="auth.user !== null">
    // Section to display if logged in
</section> 

. I am currently testing the above:

loginButton.click();
browser.sleep(2000);
expect($("#logged-in-section").isDisplayed()).toBeTruthy();

browser.sleep(2000)the browser is idle for two seconds before Protractor checks to see if it is displayed logged-in-section. If I post browser.sleep(2000), the test will fail because there is a lag between pressing the login button and the response returned from the server.

What is the syntax to bind the operator login button expectso that Protractor only checks #logged-in-sectionafter returning $promise?

Answer 1

:

loginButton.click().then(function(){
   browser.waitForAngular().then(function (){ //this should wait for the angular digest process to finish
      expect($("#logged-in-section").isDisplayed()).toBeTruthy();
   })
});

:

loginButton.click().then(function(){
   browser.wait(element(by.id("logged-in-section")).isDisplayed);
   expect($("#logged-in-section").isDisplayed()).toBeTruthy();
});