Asyc Error on IE protractor - node.js

Question

I'm currently trying to test the following pice of code:
<footer class="footer">
<div class="container">
<div class="row">
<form subscribe-directive="" ng-controller="SubscribeController" class="form col-xs-12 col-sm-8 col-md-6 col-lg-4 ng-scope ng-dirty ng-valid ng-valid-email">
<h3 class="footer__title text-uppercase margin-bottom-25">Sign up!</h3>
<div class="row">
<div class="col-sm-8 col-xs-7">
<input type="email" class="form-control ng-touched ng-dirty ng-valid ng-valid-email" ng-disabled="working || subscription.done" placeholder="Email Address" ng-model="subscription.email"> </div>
<div class="col-sm-4 col-xs-5">
<button ng-click="submit(subscription.email)" ng-disabled="working || !subscription.email || subscription.done" ng-class="{'working': working}" class="btn btn--inverse btn-red form-control" type="submit" disabled="disabled"> <span ng-bind-html="submitBtn" class="ng-binding">SUBSCRIBE</span> </button>
</div>
</div>
<p ng-show="callback_message" class="msg ng-binding ng-hide" ng-bind-html="callback_message"></p>
</form>
<nav class="col-xs-12 col-md-6 col-lg-offset-2">
<ul class="nav navbar-nav navbar-right margin-bottom-25">
<li>Press
</li>
<li>News
</li>
<li>Contact Us
</li>
<li><a target="_blank" href="//test.com/en">Test Project</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="footer__social-icon"> <a target="_blank" href="https://www.facebook.com/"><i class="fa fa-facebook"></i></a> </li>
<li class="footer__social-icon"> <a target="_blank" href="https://twitter.com/"><i class="fa fa-twitter"></i></a> </li>
<li class="footer__social-icon"> <a target="_blank" href="https://www.youtube.com/user/"><i class="fa fa-youtube"></i></a> </li>
</ul>
</nav>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 copy"> Privacy Policy
<br> Copyright © Test-inc. All Rights Reserved. </div>
<div class="col-xs-12 col-sm-6 text-right copy">
<br> Microsoft Ventures. Supported by Microsoft Ventures London Accelerator </div>
</div>
</div>
</footer>
But when I do the following actions:
it('User should see a message that he has already been added to the campaing when entering the same email twice', function () {
browser.executeScript("window.scrollBy(0,10000)");
basePage.email.sendKeys('bruno#test.com');
basePage.subscribe.click().then(function () {
browser.sleep(7000);
basePage.confirmMessage('Contact already added to target campaign');
});
On my basePage I've:
//this.email = element(by.model('subscription.email'));
this.email = element(by.xpath('/html/body/footer/div/div[1]/form/div/div[1]/input'));
this.waitlistBtn = element.all(by.binding('submitBtn'));
this.subscribe = element(by.buttonText('SUBSCRIBE'));
I keep getting the follwing error (I'm running it against BrowserStack):
Failures:
1) New Landing page module verification --> User should be correctly added to the update list
Message:
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
Stack:
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
at Timer.listOnTimeout (timers.js:110:15)
Here's my part of my configuration:
{
name: testName,
browserName: 'IE',
browser_version: '11.0',
os: 'Windows',
os_version: '8.1',
resolution: '2048x1536',
'browserstack.user': browserstackUser,
'browserstack.key': browserstackKey,
'browserstack.debug': 'true',
'browserstack.selenium_version': '2.45.0',
'browserstack.ie.driver': '2.44',
ignoreProtectedModeSettings: true
}
onPrepare: function () {
jasmine.getEnv().addReporter(reporter);
browser.driver.manage().window().maximize();
global.dvr = browser.driver; //variable to call selenium directly
global.isAngularSite = function (flag) {
browser.ignoreSynchronization = !flag; //This setup is to configure when testing non-angular pages
};
//browser.manage().timeouts().pageLoadTimeout(90000);
browser.manage().timeouts().implicitlyWait(100000);
}
I must clarify that it does not happen with other test for IE, it just happens with this part that's located at the footer of the page.
Can you please help? do you have any suggestion? or what can you see that I'm doing wrong?
Thanks.-

Answer 1

Since I had many problems to avoid the ASync, I've decided that for this particular scenario to avoid IE! I've done the following:
it('User should see a message that he has already been added to the campaing when entering the same email twice', function () {
browser.getCapabilities().then(function (capabilities) {
browser = capabilities.caps_.browserName;
platform = capabilities.caps_.platform;
}).then(function () {
console.log('Browser:', browser, 'on platform', platform);
if (browser == 'internet explorer') {
console.log('IE Was avoided for this test.');
} else {
basePage.email.sendKeys('bruno#test.com');
console.log('Mande el mail');
basePage.subscribe.click().then(function () {
basePage.confirmMessage('Contact already added to target campaign');
});
}
});
});
Please, if anyone reading this comes up with a better solution, please post.