Two identical Protractor tests in a row, second one fails - angularjs

Question

I use Protractor 4.0.14 on an Angular 1.6.3 website.
I execute two identical tests. The first one will succeed but not the second one. Any idea ?
it('Should return a toast error on inferior amount', function () {
$$('#purposeList input.amount').first().clear().sendKeys('4999');
$$('button[type="submit"]').get(0).click();
expect($('div.toast.toast-error').isPresent()).toBe(true);
element.all(by.model('purpose.amount')).first().clear();
$$('button.toast-close-button').each(function (item) {
item.click();
});
expect($('button.toast-close-button').isPresent()).toBe(false);
});
it('Should return a toast error on inferior amount BIS', function () {
$$('#purposeList input.amount').first().clear().sendKeys('4999');
$$('button[type="submit"]').get(0).click();
expect($('div.toast.toast-error').isPresent()).toBe(true);
element.all(by.model('purpose.amount')).first().clear();
$$('button.toast-close-button').each(function (item) {
item.click();
});
expect($('button.toast-close-button').isPresent()).toBe(false);
});
The field is provided with a wrong amount so it throws a toast-error when I submit. When I do it manually, I get the toast-error. When doing it with protractor, only the first of the identical tests will pass. On the other, it looks like the toast is never launch or closed really quickly.
I tried sleeps, ignoreSynchronisation with browser wait. I tried to replace the $timeout by $interval in the service dealing with error toasts (although other $timeout could be present). It didn't change anything.
It is actually the first expect of the second it that is failing and there is no actual help from the error, it's just an expect at false instead of true :
Message:
Expected false to be true.
Edit :
So #LostJon, by handling every promises, do you mean like this :
it('Should return a toast error on inferior than authorized purpose amount on step 1 BIS', function () {
$$('#purposeList input.amount').first().clear().then(function() {
$$('#purposeList input.amount').first().sendKeys('4999').then(function () {
$$('button[type="submit"]').get(0).click().then(function () {
expect($('div.toast.toast-error').isPresent()).toBe(true);
element.all(by.model('purpose.amount')).first().clear().then(function () {
$$('button.toast-close-button').each(function (item) {
item.click();
}).then(function () {
expect($('button.toast-close-button').isPresent()).toBe(false);
});
});
});
});
});
});
I tried it, same result.
Edit :
Apparently it was an ignoreSynchronization = true that was inside the wait instead of before. I didn't figure it out before because I also set browser.manage().timeouts().implicitlyWait(2000), so without synchronization, we were still waiting for the elements but it was not accurate.

Answer 1

so, the below line returns a promise.
$$('button[type="submit"]').get(0).click();
Your code is running synchronously, when you should be handling the promise resolve from click(). In fact, your line that calls clear() also returns a promise, so that needs to be handled as well.

Answer 2

It was an ignoreSynchronization = true that was inside the wait instead of before. I didn't figure it out before because I also set browser.manage().timeouts().implicitlyWait(2000), so without synchronization, we were still waiting for the elements but it was not accurate.