Page Object with Spec example

[nasihere]

What's best practice to organize Test scripts and spec files?

[nasihere]

Folder Structure

 Server/e2e.test.conf.js
 Server/test/
 --------------->e2e
------------------------>myPage.page.js
------------------------->myPage.spec.js
------------------>util.js
`

util.js

` require('protractor-linkuisref-locator')(protractor);

var Util = function() {

this.sleep= function(){
    browser.sleep(3000);
}
this.get = function(url) {
    browser.get(url);
    this.sleep();

};
this.open = function(appName){
    var appLink = element(by.linkUiSref(appName));  
    appLink.click();
    this.sleep();
}
this.clickById = function(byId){
    var appLink = element(by.id(byId)); 
    appLink.click();
    this.sleep();
}
this.clickByCss = function(byCss){
    var appLink = element(by.Css(byCss));   
    appLink.click();
    this.sleep();
}
this.countRepeater = function(expression){
    return element.all(by.repeater(expression)).count();
}

}; module.exports = Util; `

myApp

var Util = require('./../util');
var myAppPage = function() {
    var util = new Util();

    this.get = function() {
        util.get('/');
    };

    this.openApps = function(){
        util.open('dashboard');
        util.open('reconoverview');
        this.menuOpen();  
        util.open('data');
        this.menuOpen();  
        util.open('book');
        this.menuOpen();  
        util.open('link');

    }
    this.menuOpen = function(){
        util.clickById('minify');
    }

};
module.exports = myAppPage ;
`

myApp.spec.js

var MyAppPage =  require('./../myApp/myApp.page')
describe('MyAppPage homepage', function() {
  var myAppPage = new MyAppPage ();

  it('should check all the links', function() {
    myAppPage.get();  
  });
   it('should check all the links', function() {
    myAppPage.openApps();
  });
});
`

easy to manage and organized the code

[nasihere]

it('should have some data in table', function() { expect(myPage.countTable()).not.toBeLessThan(0); });

This checks how manu ng-repeat has data in table instead checking by Id or css

[nasihere]

to open ui-sref links

#util.js this.open = function(appName){ var appLink = element(by.linkUiSref(appName));
appLink.click(); this.sleep(); }

Make sure npm install for protractor-linkuisref

`protractor-linkuisref-locator : 1.1.2 Description A protractor locator that finds anchor elements by their ui-sref attribute.

NPM
NPM install
npm install protractor-linkuisref-locator@1.1.2
package.json
"protractor-linkuisref-locator": "1.1.2"
Download
protractor-linkuisref-locator-1.1.2.tgz`

Examples element(by.uiSref('users.show({id: 42})')); element.all(by.uiSref('users.index')).then(function (elems) { // elems contains all the elements found that match the given ui-sref. }); // Get elements that match the given ui-sref and that are within the element with id='users'. element(by.css('#users')).element(by.uiSref('users.index'))