javascriptangularprotractorcucumberangularjs-e2e

browser.getTitle() is returning TypeError: Converting circular structure to JSON - Protractor project


I am working in an E2E test on protractor and I am trying to assert that a page is loaded.

So that I'm incluging

        expect(browser.getTitle()).equals('Title');

The assertion fails returning

     AssertionError: expected { Object (flow_, stack_, ...) } to equal 'AAA'
     at LoginPage.pageIsLoaded (/Users/marianojover/IdeaProjects/AutomationTest-PRO/features/pages/login_page.js:28:40)
     at MyWorld.<anonymous> (/Users/marianojover/IdeaProjects/AutomationTest-PRO/features/steps/login_steps.js:42:19)
     at process._tickCallback (internal/process/next_tick.js:61:11)

Debuging the execution of the line returns

TypeError: Converting circular structure to JSON
at JSON.stringify (<anonymous>)
at eval (eval at LoginPage.get (/Users/marianojover/IdeaProjects/AutomationTest-PRO/features/pages/login_page.js:10:9), <anonymous>:1:6)
at LoginPage.get (/Users/marianojover/IdeaProjects/AutomationTest-PRO/features/pages/login_page.js:10:9)
at MyWorld.<anonymous> (/Users/marianojover/IdeaProjects/AutomationTest-PRO/features/steps/login_steps.js:22:19)
at process._tickCallback (internal/process/next_tick.js:61:11)

I have a feature file that is hooked to the login_steps.js file. The scenario validate that after login the home page is displayed properly.

login_steps.js

var LoginSteps = function() {

var LoginSteps = require("../pages/login_page.js");
browser.ignoreSynchronization = true;

this.World = function MyWorld() {
    this.page = new LoginSteps();
};

this.Given(/^the AAA page is open$/, function (callback) {
    this.page.get();
    callback();
});

this.Given(/^email is set with value (.+)$/, function (email, callback) {
    this.page.setEmail(email);
    callback();
});

this.Given(/^password is set with value (.+)$/, function (password, callback) {
    this.page.setPassword(password);
    callback();
});

this.When(/^the user click on login button$/, function (callback) {
    this.page.clickAccede();
    callback();
});

this.Then(/^shipment page is displayed$/, function (callback) {
    this.page.pageIsLoaded();
    callback();
});
};

module.exports = LoginSteps;

login_page.js

var chai = require('chai').use(require('chai-as-promised'));
var expect = chai.expect;

var LoginPage = function() {

this.get = function() {
    browser.get('https://AAA/login');
};

    this.setEmail = function(value) {
        element(by.id('login-email')).sendKeys(value);
    };

    this.setPassword = function(value) {
        element(by.id('login-password')).sendKeys(value);
    };

    this.clickAccede = function() {
        element(by.id('login-submit')).click()
    };

    this.pageIsLoaded = function() {
        browser.getCurrentUrl();
        browser.ignoreSynchronization = false;
        expect(browser.getTitle()).equals('AAA');
    };

};

module.exports = LoginPage;

Solution

  • The method that works for me is

    browser.waitForAngularEnabled(true); browser.wait(protractor.ExpectedConditions.titleIs('my title'), wait);

    It takes some experimenting to find the right time for wait,but for me it also shows if the page loading was compromised (so tests failing show a real issue)