AngularJS Protractor - How Do You Test an AJAX Login Call?

I have a button that once clicked sends out an AJAX call in Angular’s $promise format. When the login is successful, a $scope variable is changed and an element that looks like:

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

is displayed. I am currently testing the above with the following:

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

browser.sleep(2000) idles the browser for two seconds before Protractor checks to see if logged-in-section has been displayed. If I take out browser.sleep(2000), the test fails since there is a lag between hitting the login button and the response returned from the server.

What’s the syntax to chain the login button to the expect statement so that Protractor is only checking for #logged-in-section after the $promise is resolved?

[shankscript]

I hope you all would have figured out by now 😃 If not try: browser.waitForAngular

This Instructs webdriver to wait until Angular has finished rendering and has no outstanding $http or $timeout calls before continuing. Note that Protractor automatically applies this command before every WebDriver action.

Ref: https://angular.github.io/protractor/#/api?view=Protractor.prototype.waitForAngular

[juliemr]

This is obsolete now, thanks @shankscript for the good docs!