Protractor tests

Finally, we can always write a protractor test exercising the whole application.

import {browser, element, by} from 'protractor';

export class TalksAppPage {
  navigateTo() {
    return browser.get('/');
  }

  getTitleInput() {
    return element(by.css('input[formcontrolname=title]'));
  }

  getTalks() {
    return element.all(by.css('talk-cmp'));
  }

  getTalkText(index: number) {
    return this.getTalks().get(index).geText();
  }
}

describe('e2e tests', function() {
  let page: TalksAppPage;

  beforeEach(() => {
    page = new TalksAppPage();
  });

  it('should filter talks by title', () => {
    page.navigateTo();

    const title = page.getTitleInput();
    title.sendKeys("Are we there");

    expect(page.getTalks().count()).toEqual(1);
    expect(page.getTalkText(0)).toContain("Are we there yet?");
  });
});

First, we created a page object, which is a good practice for making tests more domain-centric, so they talk more about user stories and not the DOM...