Page object design pattern in Angular's e2e tests

Question

Can page object design pattern be implemented in angular e2e or does it follow some other design pattern ?

Answer 1

As far as I'm concerned there is this GitHub project called Astrolabe (by stuplum) which is an extension for protractor that adds page objects to your functional/e2e tests.

https://github.com/stuplum/astrolabe

However, at the time of writing this it has some bugs to fix and it seems to be a WIP project.

You can find here a question regarding Page Object pattern alternatives: Page Object pattern and alternatives

Answer 2

The protractor getting started page now has a section about it.

Note protractor is now the AngularJS team preferred way for e2e testing.

Regarding Astrolabe i don't believe that's the way to go, see for example this leaking abstraction while using sendKeys on their readme

signInPage.username.sendKeys('a username'); // will fill the username input with the text 'a username'

While the proper way would be more like

signInPage.setUserName('a username');

I prefer to create my own page objects without the need of any extension like Andres shows here