aboutsummaryrefslogtreecommitdiffstats
path: root/test/ng/directive/ngIncludeSpec.js
diff options
context:
space:
mode:
Diffstat (limited to 'test/ng/directive/ngIncludeSpec.js')
-rw-r--r--test/ng/directive/ngIncludeSpec.js113
1 files changed, 113 insertions, 0 deletions
diff --git a/test/ng/directive/ngIncludeSpec.js b/test/ng/directive/ngIncludeSpec.js
index dce803b5..191eaa05 100644
--- a/test/ng/directive/ngIncludeSpec.js
+++ b/test/ng/directive/ngIncludeSpec.js
@@ -280,3 +280,116 @@ describe('ngInclude', function() {
}));
});
});
+
+describe('ngInclude ngAnimate', function() {
+ var element, vendorPrefix, window;
+
+ beforeEach(module(function($animationProvider, $provide) {
+ $provide.value('$window', window = angular.mock.createMockWindow());
+ return function($sniffer) {
+ vendorPrefix = '-' + $sniffer.vendorPrefix + '-';
+ };
+ }));
+
+ afterEach(function(){
+ dealoc(element);
+ });
+
+ it('should fire off the enter animation + add and remove the css classes',
+ inject(function($compile, $rootScope, $templateCache, $sniffer) {
+
+ $templateCache.put('enter', [200, '<div>data</div>', {}]);
+ $rootScope.tpl = 'enter';
+ element = $compile(
+ '<div ' +
+ 'ng-include="tpl" ' +
+ 'ng-animate="{enter: \'custom-enter\'}">' +
+ '</div>'
+ )($rootScope);
+ $rootScope.$digest();
+
+ //if we add the custom css stuff here then it will get picked up before the animation takes place
+ var child = jqLite(element.children()[0]);
+ var cssProp = vendorPrefix + 'transition';
+ var cssValue = '1s linear all';
+ child.css(cssProp, cssValue);
+
+ if ($sniffer.supportsTransitions) {
+ expect(child.attr('class')).toContain('custom-enter-setup');
+ window.setTimeout.expect(1).process();
+
+ expect(child.attr('class')).toContain('custom-enter-start');
+ window.setTimeout.expect(1000).process();
+ } else {
+ expect(window.setTimeout.queue).toEqual([]);
+ }
+
+ expect(child.attr('class')).not.toContain('custom-enter-setup');
+ expect(child.attr('class')).not.toContain('custom-enter-start');
+ }));
+
+ it('should fire off the leave animation + add and remove the css classes',
+ inject(function($compile, $rootScope, $templateCache, $sniffer) {
+ $templateCache.put('enter', [200, '<div>data</div>', {}]);
+ $rootScope.tpl = 'enter';
+ element = $compile(
+ '<div ' +
+ 'ng-include="tpl" ' +
+ 'ng-animate="{leave: \'custom-leave\'}">' +
+ '</div>'
+ )($rootScope);
+ $rootScope.$digest();
+
+ //if we add the custom css stuff here then it will get picked up before the animation takes place
+ var child = jqLite(element.children()[0]);
+ var cssProp = vendorPrefix + 'transition';
+ var cssValue = '1s linear all';
+ child.css(cssProp, cssValue);
+
+ $rootScope.tpl = '';
+ $rootScope.$digest();
+
+ if ($sniffer.supportsTransitions) {
+ expect(child.attr('class')).toContain('custom-leave-setup');
+ window.setTimeout.expect(1).process();
+
+ expect(child.attr('class')).toContain('custom-leave-start');
+ window.setTimeout.expect(1000).process();
+ } else {
+ expect(window.setTimeout.queue).toEqual([]);
+ }
+
+ expect(child.attr('class')).not.toContain('custom-leave-setup');
+ expect(child.attr('class')).not.toContain('custom-leave-start');
+ }));
+
+ it('should catch and use the correct duration for animation',
+ inject(function($compile, $rootScope, $templateCache, $sniffer) {
+ $templateCache.put('enter', [200, '<div>data</div>', {}]);
+ $rootScope.tpl = 'enter';
+ element = $compile(
+ '<div ' +
+ 'ng-include="tpl" ' +
+ 'ng-animate="{enter: \'custom-enter\'}">' +
+ '</div>'
+ )($rootScope);
+ $rootScope.$digest();
+
+ //if we add the custom css stuff here then it will get picked up before the animation takes place
+ var child = jqLite(element.children()[0]);
+ var cssProp = vendorPrefix + 'transition';
+ var cssValue = '0.5s linear all';
+ child.css(cssProp, cssValue);
+
+ $rootScope.tpl = 'enter';
+ $rootScope.$digest();
+
+ if ($sniffer.supportsTransitions) {
+ window.setTimeout.expect(1).process();
+ window.setTimeout.expect(500).process();
+ } else {
+ expect(window.setTimeout.queue).toEqual([]);
+ }
+ }));
+
+});