Protractor times out fetching text for an element

2
votes

Using cucumber in conjunction with Protractor, I'm running into an unusual case where the value of getText is never resolved with the text of the element in question, causing my step keeps timing out. 

Then the header should contain the content:
"""
Lorem Ipsum
"""

Using chai-(as-promised) as my assertion library, my step is defined as follows:

this.Then(/^the header should contain the content:$/, function(content, callback) {
    var text = element(by.css('.description'));
    this.expect(text.getText())
      .to.eventually.equal(content)
      .and.notify(callback);
  });

However, this gives me the following error when running my test:

function timed out after 10000 milliseconds

What's additionally strange is that if I explicitly assert whether the promise returned by getText() is resolved, my test passes:

this.expect(text.getText()).to.eventually.be.fulfilled
// true

...and if I just attach my own resolve handler to getText() I can view the content just fine, so there doesn't seem to be a problem selecting the element and pulling the inner text.

text.getText().then(function(content) {
  console.log(content)
  // Lorem Ipsum
})

I'm a bit unsure about what's going on here. The problem only seems to occur when attempting to resolve the promise with chai. What am I missing?

Here's my World, in case that helps. It's very basic:

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


function World() {
  this.expect = chai.expect;
  this.assert = chai.assert;
}

module.exports = function() {
  this.World = World;
};

UPDATE

And here are the package version I'm currently using:

protractor = 3.3.0
cucumberjs = 1.2.0
protractor-cucumber-framework = 0.6.0
chai = 3.5.0
chai-as-promised = 5.3.0

3
javascriptangularjscucumberprotractorchai
Is it only happening with this particular element, or with any "eventually" assertion? Please also post the versions of the packages you have at the moment. - alecxe
@alecxe it only seems to occur when using getText() on an element. I have another "eventually" assertion for the presence of an element which works fine: expect(element(by.id('foo')).isPresent()).to.eventually.be.true - Kyril

3 Answers

0
votes

I'm not sure I can help you with the why of this question (really does seem like what you're doing should work), but based on what is working I think you could put your assertion in a resolve handler to get the test passing.

text.getText().then(function(content) {
  this.expect(content)
    .to.equal(expectedContent)
    .and.notify(callback);
});
0
votes

The expected content is not defined in the .Then statement. Try to add "([^"]*)" :

this.Then(/^the header should contain the content: "([^"]*)"$/, function(content, callback) {
0
votes

Interesting. Looks fine to me to. Have you tried logging both the content passed in and the text returned from get text?

this.Then(/^the header should contain the content:$/, function(content, callback) {
  var elem = element(by.css('.description'));
  elem.getText().then(function(elemText) {
    console.log("Element text: " + elemText);
    console.log("Content text: " + content);
    callback();
  });
});

The only other suggestion I have is to pull in Chai in the steps file:

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

And then try without the this:

this.Then(/^the header should contain the content:$/, function(content, callback) {
  expect(element(by.css('.description')).getText()).to.eventually.equal(content).and.notify(callback);
});