diff options
Diffstat (limited to 'test/ng/directive/ngRepeatSpec.js')
| -rw-r--r-- | test/ng/directive/ngRepeatSpec.js | 216 | 
1 files changed, 65 insertions, 151 deletions
| diff --git a/test/ng/directive/ngRepeatSpec.js b/test/ng/directive/ngRepeatSpec.js index 26562f4e..a85fd5ab 100644 --- a/test/ng/directive/ngRepeatSpec.js +++ b/test/ng/directive/ngRepeatSpec.js @@ -822,10 +822,30 @@ describe('ngRepeat', function() {        expect(newLis[2]).toEqual(lis[1]);      });    }); + +  it('should grow multi-node repeater', inject(function($compile, $rootScope) { +    $rootScope.show = false; +    $rootScope.books = [ +      {title:'T1', description: 'D1'}, +      {title:'T2', description: 'D2'} +    ]; +    element = $compile( +        '<div>' + +            '<dt ng-repeat-start="book in books">{{book.title}}:</dt>' + +            '<dd ng-repeat-end>{{book.description}};</dd>' + +        '</div>')($rootScope); + +    $rootScope.$digest(); +    expect(element.text()).toEqual('T1:D1;T2:D2;'); +    $rootScope.books.push({title:'T3', description: 'D3'}); +    $rootScope.$digest(); +    expect(element.text()).toEqual('T1:D1;T2:D2;T3:D3;'); +  })); + +  }); -describe('ngRepeat ngAnimate', function() { -  var vendorPrefix, window; +describe('ngRepeat animations', function() {    var body, element, $rootElement;    function html(html) { @@ -834,10 +854,7 @@ describe('ngRepeat ngAnimate', function() {      return element;    } -  function applyCSS(element, cssProp, cssValue) { -    element.css(cssProp, cssValue); -    element.css(vendorPrefix + cssProp, cssValue); -  } +  beforeEach(module('mock.animate'));    beforeEach(module(function() {      // we need to run animation on attached elements; @@ -853,21 +870,14 @@ describe('ngRepeat ngAnimate', function() {      dealoc(element);    }); -  beforeEach(module(function($animationProvider, $provide) { -    $provide.value('$window', window = angular.mock.createMockWindow()); -    return function($sniffer, $animator) { -      vendorPrefix = '-' + $sniffer.vendorPrefix + '-'; -      $animator.enabled(true); -    }; -  })); +  it('should fire off the enter animation', +    inject(function($compile, $rootScope, $animate) { -  it('should fire off the enter animation + add and remove the css classes', -    inject(function($compile, $rootScope, $sniffer) { +    var item;      element = $compile(html(        '<div><div ' + -        'ng-repeat="item in items" ' + -        'ng-animate="{enter: \'custom-enter\'}">' + +        'ng-repeat="item in items">' +          '{{ item }}' +        '</div></div>'      ))($rootScope); @@ -877,40 +887,24 @@ describe('ngRepeat ngAnimate', function() {      $rootScope.items = ['1','2','3'];      $rootScope.$digest(); -    //if we add the custom css stuff here then it will get picked up before the animation takes place -    var kids = element.children(); -    for(var i=0;i<kids.length;i++) { -      kids[i] = jqLite(kids[i]); -      applyCSS(kids[i], 'transition', '1s linear all'); -    } - -    if ($sniffer.transitions) { -      angular.forEach(kids, function(kid) { -        expect(kid.attr('class')).toContain('custom-enter'); -        window.setTimeout.expect(1).process(); -      }); +    item = $animate.process('enter').element; +    expect(item.text()).toBe('1'); -      angular.forEach(kids, function(kid) { -        expect(kid.attr('class')).toContain('custom-enter-active'); -        window.setTimeout.expect(1000).process(); -      }); -    } else { -      expect(window.setTimeout.queue).toEqual([]); -    } +    item = $animate.process('enter').element; +    expect(item.text()).toBe('2'); -    angular.forEach(kids, function(kid) { -      expect(kid.attr('class')).not.toContain('custom-enter'); -      expect(kid.attr('class')).not.toContain('custom-enter-active'); -    }); +    item = $animate.process('enter').element; +    expect(item.text()).toBe('3');    })); -  it('should fire off the leave animation + add and remove the css classes', -    inject(function($compile, $rootScope, $sniffer) { +  it('should fire off the leave animation', +    inject(function($compile, $rootScope, $animate) { + +    var item;      element = $compile(html(        '<div><div ' + -        'ng-repeat="item in items" ' + -        'ng-animate="{leave: \'custom-leave\'}">' + +        'ng-repeat="item in items">' +          '{{ item }}' +        '</div></div>'      ))($rootScope); @@ -918,36 +912,30 @@ describe('ngRepeat ngAnimate', function() {      $rootScope.items = ['1','2','3'];      $rootScope.$digest(); -    //if we add the custom css stuff here then it will get picked up before the animation takes place -    var kids = element.children(); -    for(var i=0;i<kids.length;i++) { -      kids[i] = jqLite(kids[i]); -      applyCSS(kids[i], 'transition', '1s linear all'); -    } +    item = $animate.process('enter').element; +    expect(item.text()).toBe('1'); + +    item = $animate.process('enter').element; +    expect(item.text()).toBe('2'); + +    item = $animate.process('enter').element; +    expect(item.text()).toBe('3');      $rootScope.items = ['1','3'];      $rootScope.$digest(); -    //the last element gets pushed down when it animates -    var kid = jqLite(element.children()[1]); -    if ($sniffer.transitions) { -      expect(kid.attr('class')).toContain('custom-leave'); -      window.setTimeout.expect(1).process(); -      expect(kid.attr('class')).toContain('custom-leave-active'); -      window.setTimeout.expect(1000).process(); -    } else { -      expect(window.setTimeout.queue).toEqual([]); -    } - -    expect(kid.attr('class')).not.toContain('custom-leave'); -    expect(kid.attr('class')).not.toContain('custom-leave-active'); +    item = $animate.process('leave').element; +    expect(item.text()).toBe('2');    })); -  it('should fire off the move animation + add and remove the css classes', -    inject(function($compile, $rootScope, $sniffer) { +  it('should fire off the move animation', +    inject(function($compile, $rootScope, $animate) { + +      var item; +        element = $compile(html(          '<div>' + -          '<div ng-repeat="item in items" ng-animate="{move: \'custom-move\'}">' + +          '<div ng-repeat="item in items">' +              '{{ item }}' +            '</div>' +          '</div>' @@ -956,97 +944,23 @@ describe('ngRepeat ngAnimate', function() {        $rootScope.items = ['1','2','3'];        $rootScope.$digest(); -      //if we add the custom css stuff here then it will get picked up before the animation takes place -      var kids = element.children(); -      for(var i=0;i<kids.length;i++) { -        kids[i] = jqLite(kids[i]); -        applyCSS(kids[i], 'transition', '1s linear all'); -      } +      item = $animate.process('enter').element; +      expect(item.text()).toBe('1'); -      $rootScope.items = ['2','3','1']; -      $rootScope.$digest(); - -      //the last element gets pushed down when it animates -      kids  = element.children(); -      var first = jqLite(kids[0]); -      var left  = jqLite(kids[1]); -      var right = jqLite(kids[2]); - -      if ($sniffer.transitions) { -        expect(first.attr('class')).toContain('custom-move'); -        window.setTimeout.expect(1).process(); -        expect(left.attr('class')).toContain('custom-move'); -        window.setTimeout.expect(1).process(); - -        expect(first.attr('class')).toContain('custom-move-active'); -        window.setTimeout.expect(1000).process(); -        expect(left.attr('class')).toContain('custom-move-active'); -        window.setTimeout.expect(1000).process(); -      } else { -        expect(window.setTimeout.queue).toEqual([]); -      } - -      expect(first.attr('class')).not.toContain('custom-move'); -      expect(first.attr('class')).not.toContain('custom-move-active'); -      expect(left.attr('class')).not.toContain('custom-move'); -      expect(left.attr('class')).not.toContain('custom-move-active'); -      expect(right.attr('class')).not.toContain('custom-move'); -      expect(right.attr('class')).not.toContain('custom-move-active'); -  })); +      item = $animate.process('enter').element; +      expect(item.text()).toBe('2'); -  it('should catch and use the correct duration for animation', -    inject(function($compile, $rootScope, $sniffer) { +      item = $animate.process('enter').element; +      expect(item.text()).toBe('3'); -      element = $compile(html( -        '<div><div ' + -          'ng-repeat="item in items" ' + -          'ng-animate="{enter: \'custom-enter\'}">' + -          '{{ item }}' + -        '</div></div>' -      ))($rootScope); - -      $rootScope.$digest(); // re-enable the animations; - -      $rootScope.items = ['a','b']; +      $rootScope.items = ['2','3','1'];        $rootScope.$digest(); -      //if we add the custom css stuff here then it will get picked up before the animation takes place -      var kids = element.children(); -      var first = jqLite(kids[0]); -      var second = jqLite(kids[1]); -      var cssProp = 'transition'; -      var cssValue = '0.5s linear all'; -      applyCSS(first, cssProp, cssValue); -      applyCSS(second, cssProp, cssValue); - -      if ($sniffer.transitions) { -        window.setTimeout.expect(1).process(); -        window.setTimeout.expect(1).process(); -        window.setTimeout.expect(500).process(); -        window.setTimeout.expect(500).process(); -      } else { -        expect(window.setTimeout.queue).toEqual([]); -      } -  })); +      item = $animate.process('move').element; +      expect(item.text()).toBe('2'); -  it('should grow multi-node repeater', inject(function($compile, $rootScope) { -    $rootScope.show = false; -    $rootScope.books = [ -      {title:'T1', description: 'D1'}, -      {title:'T2', description: 'D2'} -    ]; -    element = $compile( -        '<div>' + -            '<dt ng-repeat-start="book in books">{{book.title}}:</dt>' + -            '<dd ng-repeat-end>{{book.description}};</dd>' + -        '</div>')($rootScope); - -    $rootScope.$digest(); -    expect(element.text()).toEqual('T1:D1;T2:D2;'); -    $rootScope.books.push({title:'T3', description: 'D3'}); -    $rootScope.$digest(); -    expect(element.text()).toEqual('T1:D1;T2:D2;T3:D3;'); +      item = $animate.process('move').element; +      expect(item.text()).toBe('1');    })); -  }); | 
