1

I do have an angular login page build as a SPA: http://localhost:port/login which works fine. And I wrote an E2E integration test for that. It runs fine regarding checking the input-text for username and password and also the submit-button enabled/disabled based on if the input fields are empty or not.

Now I'am at the stage where I want to test a failed login process when the credentials (username and password) are not correct. But the test failed and I keep getting the following error:

1) user-app App should not login with wrong username and wrong password - Failed: Error while waiting for Protractor to sync with the page: true.

Here is the code for this specific login case:

it("should not login with wrong username and wrong password", () => {

     const userNameInput = element(by.name('username'));
     const userPassInput = element(by.name('password'));
     const submitButton = element( by.css(".login-btn") );

     userNameInput.sendKeys('johnfoo');
     userPassInput.sendKeys('3edF!4rfv');

     expect(submitButton.isEnabled()).toBe(true);

     submitButton
         .click()
         .then(() => {
             browser.waitForAngular();
             browser.sleep(1000);
             expect(page.validationMessage().isDisplayed()).toBe(true);
             expect(page.validationMessage().isDisplayed())
                                            .toMatch('Please check your username and/or password and try again!');
         });
});

Any idea or hint how to fix this? Habe been searching and found some old postings also in Stack Overflow, but they seem to be in a way different than the one I'am facing.

4
  • Fix what? Invalid login is rejected, which is correct response. Dec 27, 2017 at 15:41
  • I'am trying to check if the error message is being displayed in this case. Thus, the expected behavior should be to display the error message in the UI - which is in this case: Please check your username and/or password and try again!.
    – k.vincent
    Dec 27, 2017 at 15:56
  • Where is validationMessage() defined? And why it is a function instead of being an object? Dec 28, 2017 at 9:54
  • Where is the ng-app directive defined in the HTML ? Dec 28, 2017 at 10:08

1 Answer 1

1

Protractor waits for the Angular zone to stabilise in case of Angular apps. If the stabilisation is taking long time, then your tests will timeout since the async operations around Angular's zone.js are probably taking more time to complete and would block your tests from continuing.

The best workaround is to have your tests not wait for this synchronisation to complete.

So you can set browser.ignoreSynchronisation = true or browser.waitForAngularEnabled(false [I prefer the earlier one].

Edit : You can also try using useAllAngular2AppRoots: true in your config.js file , and see it that resolves the error.

8
  • unfortunately the hint didn't help. Keep throwing same message: ✗ should not login with wrong username and wrong password - Failed: Error while waiting for Protractor to sync with the page: true at runWaitForAngularScript.then(/Users/myUserName/projects/UserApp/19_12-t-04_16/user-app/node_modules/protractor/lib/browser.ts:653:19 ...
    – k.vincent
    Dec 27, 2017 at 17:14
  • @k.vincent see the Edit in my answer. Dec 27, 2017 at 17:28
  • Nope, keeps the same.
    – k.vincent
    Dec 27, 2017 at 17:43
  • Are you using $timeout anywhere in your Angular app code? Dec 28, 2017 at 7:47
  • No, I'am not using it. Actually that the test failed is i a way correct is correct, but the issue is how to get rid of the error-message: - Failed: Error while waiting for Protractor to sync with the page: true, or to prevent print in it out in the terminal.
    – k.vincent
    Dec 28, 2017 at 8:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.