The following code is used to test the drag and drop orientation of an angular-Gridster application using Protractor.
I'm new to some of these function calls below, would someone be kind enough to explain the significance of evaluate() --the API definition is too confusing, and dragAndDrop()? -- can't find this function anywhere
describe('DragAndDrop Test', function () {
require('jasmine-expect');
beforeAll(function () {
context = new Context();
context.get();
browser.waitForAngular();
browser.driver.manage().window().maximize();
});
it('should drag and drop a tile', function () {
//target is where we are dragging the box to. Box is the Box
var target = { x: 400, y: 400 };
var box = element(by.css('.ng-scope.gridster-item'));
//scope is going to hold the scope variables that tell us where the box is located
//see the documentation for angular gridster on github for info on scope variable
//get the standardItems Scope
box.evaluate('standardItems').then(function (scope) {
//make sure the box we are using is in column 0 and Row 0
expect(scope[0].col).toEqual(0);
expect(scope[0].row).toEqual(0);
});
//drag and drop the box somewhere else.
browser.actions().dragAndDrop(box, target).perform();
browser.waitForAngular();
//get the updated scope
box.evaluate('standardItems').then(function (scope) {
//test to see that the box was actually moved to column and row 2, better test
expect(scope[0].col).toEqual(2);
expect(scope[0].row).toEqual(2);
});
//this is to test the pixel location which is not the best
box.getLocation().then(function (location) {
expect(location.x).toEqual(476);
});
});
});
var Context = function () {
//load the website
this.get = function () {
browser.get('https://rawgit.com/ManifestWebDesign/angular-gridster/master/index.html#/main');
};
};
evaluate()
would evaluate expression in the scope of the element you call it on. Useful when you need to access a particular variable in the scope:
Evaluates the input as if it were on the scope of the current element.
dragAndDrop()
is a "browser action" and is inherited from the WebDriverJS
(remember, Protractor is built on top of WebDriverJS
):
Convenience function for performing a "drag and drop" manuever. The target element may be moved to the location of another element, or by an offset (in pixels).