Protractor, when should I use then() after a click()

Question

I'm running an Angular app and when testing on protractor a click(), I don't know when should I resolve the promise with a then().

I found this on Protractor API:

A promise that will be resolved when the click command has completed.

So, should I use click().then() in every click?

Answer 1

So, should I use click().then() in every click?

Definitely not.

It's not needed because Protractor/WebDriverJS has this mechanism called "Control Flow" which is basically a queue of promises that need to be resolved:

WebDriverJS maintains a queue of pending promises, called the control flow, to keep execution organized.

and Protractor waits for Angular naturally and out-of-the-box:

You no longer need to add waits and sleeps to your test. Protractor can automatically execute the next step in your test the moment the webpage finishes pending tasks, so you don’t have to worry about waiting for your test and webpage to sync.

Which leads to a quite straight-forward testing code:

var elementToBePresent = element(by.css(".anotherelementclass")).isPresent();

expect(elementToBePresent.isPresent()).toBe(false);
element(by.css("#mybutton")).click();
expect(elementToBePresent.isPresent()).toBe(true);

---

Sometimes though, if you experience synchronization/timing issues, or your app under test is non-Angular, you may solve it by resolving the click() explicitly with then() and continue inside the click callback:

expect(elementToBePresent.isPresent()).toBe(false);
element(by.css("#mybutton")).click().then(function () {
    expect(elementToBePresent.isPresent()).toBe(true);
});

There are also Explicit Waits to the rescue in these cases, but it's not relevant here.