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

Question

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!!

Answer 1

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);
});

Answer 2

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);
});