angularjs e2e - How to test slide-box in protractor -
i have slide-box described in 1 of protractor tests; can find box , can properties (i.e. 'how many') how cycle through boxes can test verify display, e.g.
profilepage.slides.next() expect(profilepage.slide.slidetitle = 'credentials' profilepage.slides.next() expect(profilepage.slide.slidetitle = "info" etc.
controller:
.controller('profilectrl', function ($scope, profileservice) { $scope.data = { numviewableslides: 0, slideindex: 0, initialinstruction: true, secondinstruction: false, slides: [ { 'template': 'templates/slidebox/credentials.html', 'viewable': true }, { 'template': 'templates/slidebox/contactinfo.html', 'viewable': true }, { 'template': 'templates/slidebox/employeeinfo.html', 'viewable': true }, { 'template': 'templates/slidebox/assignmentinfo.html', 'viewable': true } ] } . . .
template:
<ion-slide-box on-slide-changed="slidechanged(index)" show-pager="true"> <ion-slide ng-repeat="slide in data.slides | filter:{viewable : true}"> <div ng-include src="slide.template"></div> </ion-slide> </ion-slide-box>
page object:
profilepage.prototype = object.create({}, { backbutton: { get: function () { return element(by.css('ion-ios7-arrow-back')); } }, slides: { get: function () { return element.all(by.repeater('slide in data.slides')); } }, slidetitle: { get: function (id) { element.all(by.repeater('slide in data.slides')).then(function (slidelist) { var titleelement = slidelist[id].element(by.css('#slidename')); return titleelement.gettext(); }); } }, . . .
spec:
describe('profile', function () { var ppage = new profilepage(); beforeeach(function () { browser.ignoresynchronization = false; }); it('should have correct lastname , have 4 slides on profile page', function () { expect(browser.getcurrenturl()).toequal('http://localhost:8100/#/profile'); expect(ppage.lastname).tobe('smith,'); expect(ppage.slides.count()).toequal(4); browser.sleep(1000); }); it('should slide pages', function(){ expect(browser.getcurrenturl()).toequal('http://localhost:8100/#/profile'); // slide each page here <------------ browser.sleep(1000); })
the idea use ionic's $ionicslideboxdelegate within spec file. we'll need make accessible globally:
var addprotractorslidebox, nextslide; addprotractorslidebox = function() { return browser.addmockmodule("services", function() { return angular.module("services").run(function($ionicslideboxdelegate) { return window._$ionicslideboxdelegate = $ionicslideboxdelegate; }); }); }; nextslide = function() { return browser.executescript('_$ionicslideboxdelegate.next()'); }; ... beforeeach(function() { ... addprotractorslidebox(); ... }); it('...', function() { ... nextslide(); ... })
this pattern useful other ionic/angular services.
Comments
Post a Comment