Protractor doesn't wait for page to load before moving to next it block in firefox

Question

I'm facing a problem working with protractor along with firefox.

In my test i first direct the browser to a login page and after entering user and password i do another browser.get action that refers me to a different page.

Both the login page and the second page are non-angular pages. The issue i'm facing is that firefox doesn't wait for the initial page to load and right away tries to do the redirect action.

I tried firefox versions: 27.0.1, 28.0, 42.0, 45.0.1 and 46.0.1 (all 32bit versions) all versions shows the same behavior. The webdriver-manager version is 10.0.4, selenium webdriver version is 2.53, os win8.1 64 bit and protractor version is 3.1.1.

When running the same test on chrome browser the test run as it should, it waits for the login to finish and only then it goes to the next it block that performs the browser.get action.

My conf file:

    var HtmlScreenshotReporter = require('protractor-jasmine2-screenshot-reporter');
    var path = require('path');

    exports.config = {
      framework: 'jasmine2',
      seleniumAddress: 'http://localhost:4444/wd/hub',
      specs: ['multiTestRun.js'],
      getPageTimeout: 60000,
      rootElement: '[ng-app]',
      jasmineNodeOpts: {
      showColors: true,
      defaultTimeoutInterval: 10000000,
      isVerbose: true,
      includeStackTrace: true
      },
      params: {
        test: 'Regression',
        resources: 3,
        locations: 4,
        skills: 2,
        services: 0,
        useNameSpace: 0
      },
      capabilities: {
        'browserName': 'firefox'
      },
      onPrepare: function(){
    var dest = path.normalize('./Results');
    browser.manage().timeouts().setScriptTimeout(120000);
    jasmine.getEnv().addReporter(
        new HtmlScreenshotReporter({
            dest: dest,
            filename: 'my-report.html',
            showQuickLinks: true,
            reportOnlyFailedSpecs: false,
            captureOnlyFailedSpecs: true,
            restartBrowserBetweenTests: true
        })
    );

     global.isAngularSite = function(flag){
        browser.ignoreSynchronization = !flag;
     };
     browser.driver.manage().window().maximize();
    }
  };

My code file:

describe('test', function () {

beforeEach(function(){
    isAngularSite(false);
}, 60000);

it('it1', function () {
    browser.get('https://example.com/');
    element(By.id('username')).clear();
    element(By.id('username')).sendKeys('sanu@field.com');
    element(By.id('password')).clear();
    element(By.id('password')).sendKeys('1234.org'); 
    element(By.id('Login')).click();
});

it('it2', function () {
    browser.get('https://example.com/SecondPage');
    browser.get('https://example.com/SecondPage');

    browser.executeScript('return RemoteActions;')
    .then(function(remoteAction) {
        console.log('remoteAction.doAction');
        console.log(remoteAction.doAction);
        browser.executeAsyncScript(function(remoteAction) {
            var callback = arguments[arguments.length - 1];
            Visualforce.remoting.Manager.invokeAction(remoteAction.doAction, function (res, ev) {
                callback(res);
            }, { buffer: false, escape: false, timeout: 10000 });
        },remoteAction).then(function(res) {
            console.log(res);
        });
    }); 
});

any advice ?

Answer 1

Since these are not angular pages, and you are turning off synchronization, you will have to tell webdriver how to wait for something to happen after clicking the login button before performing the next action.

In this example, you can wait for the login button to no longer be present, so that you know it is ready to navigate to the next page.

element(By.id('Login')).click();
browser.wait(function() {
    element(By.id('Login')).isDisplayed().then(function(loginButtonIsDisplayed) {
        // break out of the loop by returning 'true' when the login button is not displayed
        return !loginButtonIsDisplayed; 
), browser.getPageTimeout, 'after clicking the login button, the next page did not load within ' + browser.getPageTimeout + 's'};
browser.get('https://example.com/SecondPage');

browser.getPageTimeout is a protractor timeout that is set to 10 seconds by default