From f23565d5db4fbb102cfec8311ce9dfaee52e9113 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Fri, 23 May 2014 18:47:18 -0700 Subject: [PATCH] feat(protractor): new API allowAnimations(bool) on protractor elements. --- lib/clientsidescripts.js | 12 +++++++++ lib/protractor.js | 8 +++++- spec/basic/elements_spec.js | 22 +++++++++++++--- testapp/alt_root_index.html | 2 ++ testapp/animation/animation.css | 24 ++++++++++++++++++ testapp/animation/animation.html | 10 ++++++++ testapp/animation/animation.js | 5 ++++ testapp/app.js | 3 ++- testapp/index.html | 5 ++++ .../lib/angular_v1.2.9/angular-animate.min.js | 25 +++++++++++++++++++ .../angular_v1.2.9/angular-animate.min.js.map | 8 ++++++ 11 files changed, 119 insertions(+), 5 deletions(-) create mode 100644 testapp/animation/animation.css create mode 100644 testapp/animation/animation.html create mode 100644 testapp/animation/animation.js create mode 100644 testapp/lib/angular_v1.2.9/angular-animate.min.js create mode 100644 testapp/lib/angular_v1.2.9/angular-animate.min.js.map diff --git a/lib/clientsidescripts.js b/lib/clientsidescripts.js index b47d7dc6d..bf328048b 100644 --- a/lib/clientsidescripts.js +++ b/lib/clientsidescripts.js @@ -475,6 +475,18 @@ functions.evaluate = function(element, expression) { return angular.element(element).scope().$eval(expression); }; +functions.allowAnimations = function(element, value) { + var ngElement = angular.element(element); + if (ngElement.allowAnimations) { + // AngularDart: $testability API. + return ngElement.allowAnimations(value); + } else { + // AngularJS + var enabledFn = ngElement.injector().get('$animate').enabled; + return (value == null) ? enabledFn() : enabledFn(value); + } +}; + /** * Return the current url using $location.absUrl(). * diff --git a/lib/protractor.js b/lib/protractor.js index dfe85eb65..d45b99c1e 100644 --- a/lib/protractor.js +++ b/lib/protractor.js @@ -106,7 +106,7 @@ var buildElementHelper = function(ptor, opt_usingChain) { var elementFinder = {}; var webElementFns = WEB_ELEMENT_FUNCTIONS.concat( - ['findElements', 'isElementPresent', 'evaluate']); + ['findElements', 'isElementPresent', 'evaluate', 'allowAnimations']); webElementFns.forEach(function(fnName) { elementFinder[fnName] = function() { var callerError = new Error(); @@ -780,6 +780,12 @@ Protractor.prototype.wrapWebElement = function(element) { element, expression); }; + element.allowAnimations = function(value) { + thisPtor.waitForAngular(); + return element.getDriver().executeScript(clientSideScripts.allowAnimations, + element, value); + }; + return element; }; diff --git a/spec/basic/elements_spec.js b/spec/basic/elements_spec.js index a408d580a..9238f2da8 100644 --- a/spec/basic/elements_spec.js +++ b/spec/basic/elements_spec.js @@ -158,7 +158,8 @@ describe('ElementFinder', function() { {index: 2, text: 'form'}, {index: 3, text: 'async'}, {index: 4, text: 'conflict'}, - {index: 5, text: 'polling'} + {index: 5, text: 'polling'}, + {index: 6, text: 'animation'} ]); }); @@ -186,7 +187,8 @@ describe('ElementFinder', function() { newExpected('form'), newExpected('async'), newExpected('conflict'), - newExpected('polling') + newExpected('polling'), + newExpected('animation') ]); }); @@ -197,7 +199,7 @@ describe('ElementFinder', function() { return i++; }); - expect(labels).toEqual([1, 2, 3, 4, 5, 6]); + expect(labels).toEqual([1, 2, 3, 4, 5, 6, 7]); }); it('should export an isPresent helper', function() { @@ -207,6 +209,20 @@ describe('ElementFinder', function() { expect(element(by.binding('nopenopenope')).isPresent()).toBe(false); }); + it('should export an allowAnimations helper', function() { + browser.get('index.html#/animation'); + var animationTop = element(by.id('animationTop')); + var toggledNode = element(by.id('toggledNode')); + + expect(animationTop.allowAnimations()).toBe(true); + animationTop.allowAnimations(false); + expect(animationTop.allowAnimations()).toBe(false); + + expect(toggledNode.isPresent()).toBe(true); + element(by.id('checkbox')).click(); + expect(toggledNode.isPresent()).toBe(false); + }); + it('should keep a reference to the original locator', function() { browser.get('index.html#/form'); diff --git a/testapp/alt_root_index.html b/testapp/alt_root_index.html index 42a86b8ed..79a796a41 100644 --- a/testapp/alt_root_index.html +++ b/testapp/alt_root_index.html @@ -28,6 +28,7 @@ + @@ -36,6 +37,7 @@ + diff --git a/testapp/animation/animation.css b/testapp/animation/animation.css new file mode 100644 index 000000000..6f286930e --- /dev/null +++ b/testapp/animation/animation.css @@ -0,0 +1,24 @@ +#animationTop .animate-if { + background:white; + border:1px solid black; + padding:10px; +} + +#animationTop .animate-if.ng-enter, +#animationTop .animate-if.ng-leave { + -webkit-transition:all linear 1s; + -moz-transition:all linear 1s; + -o-transition:all linear 1s; + transition:all linear 1s; + +} + +#animationTop .animate-if.ng-enter, +#animationTop .animate-if.ng-leave.ng-leave-active { + opacity:0; +} + +#animationTop .animate-if.ng-leave, +#animationTop .animate-if.ng-enter.ng-enter-active { + opacity:1; +} diff --git a/testapp/animation/animation.html b/testapp/animation/animation.html new file mode 100644 index 000000000..5731ebc1e --- /dev/null +++ b/testapp/animation/animation.html @@ -0,0 +1,10 @@ + +
+ +
+ I exist! +
+
diff --git a/testapp/animation/animation.js b/testapp/animation/animation.js new file mode 100644 index 000000000..bd7d4b7fd --- /dev/null +++ b/testapp/animation/animation.js @@ -0,0 +1,5 @@ +function AnimationCtrl($scope) { + $scope.checked = true; +}; + +AnimationCtrl.$inject = ['$scope']; diff --git a/testapp/app.js b/testapp/app.js index 00ad50944..8b76c0f68 100644 --- a/testapp/app.js +++ b/testapp/app.js @@ -2,7 +2,7 @@ // Declare app level module which depends on filters, and services -angular.module('myApp', ['ngRoute', 'myApp.appVersion']). +angular.module('myApp', ['ngAnimate', 'ngRoute', 'myApp.appVersion']). config(['$routeProvider', function($routeProvider) { $routeProvider.when('/repeater', {templateUrl: 'repeater/repeater.html', controller: RepeaterCtrl}); $routeProvider.when('/bindings', {templateUrl: 'bindings/bindings.html', controller: BindingsCtrl}); @@ -10,6 +10,7 @@ angular.module('myApp', ['ngRoute', 'myApp.appVersion']). $routeProvider.when('/async', {templateUrl: 'async/async.html', controller: AsyncCtrl}); $routeProvider.when('/conflict', {templateUrl: 'conflict/conflict.html', controller: ConflictCtrl}); $routeProvider.when('/polling', {templateUrl: 'polling/polling.html', controller: PollingCtrl}); + $routeProvider.when('/animation', {templateUrl: 'animation/animation.html', controller: AnimationCtrl}); $routeProvider.when('/slowloader', { templateUrl: 'polling/polling.html', controller: PollingCtrl, diff --git a/testapp/index.html b/testapp/index.html index ff503b33c..42ac718a3 100644 --- a/testapp/index.html +++ b/testapp/index.html @@ -4,6 +4,7 @@ My AngularJS App +
@@ -20,7 +22,9 @@
Angular seed app: v
+ + @@ -28,6 +32,7 @@ + diff --git a/testapp/lib/angular_v1.2.9/angular-animate.min.js b/testapp/lib/angular_v1.2.9/angular-animate.min.js new file mode 100644 index 000000000..4d909639f --- /dev/null +++ b/testapp/lib/angular_v1.2.9/angular-animate.min.js @@ -0,0 +1,25 @@ +/* + AngularJS v1.2.9 + (c) 2010-2014 Google, Inc. http://angularjs.org + License: MIT +*/ +(function(H,f,s){'use strict';f.module("ngAnimate",["ng"]).factory("$$animateReflow",["$window","$timeout",function(f,D){var c=f.requestAnimationFrame||f.webkitRequestAnimationFrame||function(c){return D(c,10,!1)},x=f.cancelAnimationFrame||f.webkitCancelAnimationFrame||function(c){return D.cancel(c)};return function(k){var f=c(k);return function(){x(f)}}}]).config(["$provide","$animateProvider",function(S,D){function c(c){for(var f=0;f=t&&d>=n&&y()}var m=a.data(q),h=c(a);if(-1!=h.className.indexOf(e)&&m){var k=m.timings,l=m.stagger,n=m.maxDuration,r=m.activeClassName,t=Math.max(k.transitionDelay,k.animationDelay)* +aa,w=Date.now(),v=U+" "+T,u=m.itemIndex,p="",s=[];if(0