Home » Angularjs » How to expect dynamic count of elements in e2e tests using Protractor

How to expect dynamic count of elements in e2e tests using Protractor

Posted by: admin November 29, 2017 Leave a comment

Questions:

I’m currently writing some e2e tests for my humble Angular app with Protractor.

My app works fine, unit tests passes all, e2e used too… until this one:

appE2ESpec.js

describe('adding an item', function() {
  var items,
      addItemButton,
      startCount;

  beforeEach(function() {
    items = element.all(by.css('li.item'));
    addItemButton = element(by.id('addItemButton'));
    startCount = items.count();
  });

  it('should display a new item in list', function() {
    addItemButton.click();

    expect(items.count()).toEqual(startCount+1);
  });
});

This is how I would have written my test but,

The problem is: that items.count() returns a promise, I know that, but I can’t manage to force Protractor to resolve it. So I get this:

Failures:

1) myApp adding an item should display a new item in list
  Message:
    Expected 6 to equal '[object Object]1'.

What I’ve tried:

items.count().then(function(count) {
  startCount = count;
  //console.log(startCount) --> "6" Perfect!
});

But got the same result at the end… I can’t put the expect into the then, I thought about that too.

  • I searched into Protractor GitHub repository issues, StackOverflow and Google AngularJs group.

Appendix:

console.log(startCount) outputs this :

{ then: [Function: then],
  cancel: [Function: cancel],
  isPending: [Function: isPending] }

I could have written .toEqual(6) but I don’t want to rewrite my test each time I need to change my app startup state.

Any idea? Thanks in advance!!

Answers:

You need to resolve the promise and then do the assertion.

Protractor will resolve the promise that you pass to expect(), but it cannot add a number to a promise. You need to resolve the value of the promise first:

beforeEach(function() {
  ...
  items.count().then(function(originalCount) {
    startCount = originalCount;
  });
});

it('should display a new item in list', function() {
  ...
  expect(items.count()).toEqual(startCount+1);
});

Questions:
Answers:

While using chai for assertions there is chai-as-promised that allows to cope with promises in more readable way. To have it work you need first to declare:

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

and then in the code:

// here is modified remaind of the code from the original question:
it('should display a new item in list', function() {
  addItemButton.click();

  expect(items.count()).should.eventually.equal(startCount+1);
});