test/spec.core.js

   1 // Go tests, go
   2 describe('Deck JS', function() {
   3         describe('standard html structure', function() {
   4                 beforeEach(function() {
   5                         loadFixtures('standard.html');
   6                         if (Modernizr.history) {
   7                                 history.replaceState({}, "", "#")
   8                         }
   9                         else {
  10                                 window.location.hash = '#';
  11                         }
  12                 });
  13
  14                 describe('init(selector)', function() {
  15                         it('should create slides', function() {
  16                                 $.deck('.slide');
  17                                 expect($.deck('getSlides').length).toEqual($('.slide').length);
  18                         });
  19                 });
  20
  21                 describe('init([selectors])', function() {
  22                         it('should create slides', function() {
  23                                 $.deck([
  24                                         '.slide1',
  25                                         '.slide2',
  26                                         '.slide3',
  27                                         '.slide4',
  28                                         '.slide5'
  29                                 ]);
  30                                 expect($.deck('getSlides').length).toEqual($('.slide').length);
  31                         });
  32                 });
  33
  34                 describe('navigation functions', function() {
  35                         beforeEach(function() {
  36                                 $.deck('.slide');
  37                         });
  38
  39                         describe('go(i)', function() {
  40                                 it('should go to the i slide (0 based index)', function() {
  41                                         $.deck('go', 3);
  42                                         expect($.deck('getSlide')).toHaveClass('slide4');
  43                                 });
  44
  45                                 it('should go nowhere if i is NaN', function() {
  46                                         $.deck('go', 'foobar');
  47                                         expect($.deck('getSlide')).toHaveClass('slide1');
  48                                 });
  49
  50                                 it('should go nowhere if i is out of bounds', function() {
  51                                         $.deck('go', 5);
  52                                         expect($.deck('getSlide')).toHaveClass('slide1');
  53                                 });
  54                         });
  55
  56                         describe('next()', function() {
  57                                 it('should go to the next slide', function() {
  58                                         $.deck('next');
  59                                         expect($.deck('getSlide')).toHaveClass('slide2');
  60                                 });
  61
  62                                 it('should go nowhere if on the last slide', function() {
  63                                         $.deck('go', 4);
  64                                         $.deck('next');
  65                                         expect($.deck('getSlide')).toHaveClass('slide5');
  66                                 });
  67                         });
  68
  69                         describe('prev()', function() {
  70                                 it('should go to the previous slide', function() {
  71                                         $.deck('go', 2);
  72                                         $.deck('prev');
  73                                         expect($.deck('getSlide')).toHaveClass('slide2');
  74                                 });
  75
  76                                 it('should go nowhere if on the first slide', function() {
  77                                         $.deck('prev');
  78                                         expect($.deck('getSlide')).toHaveClass('slide1');
  79                                 });
  80                         });
  81                 });
  82
  83                 describe('getters', function() {
  84                         beforeEach(function() {
  85                                 $.deck('.slide');
  86                         });
  87
  88                         describe('getSlide()', function() {
  89                                 it('should get the current slide', function() {
  90                                         expect($.deck('getSlide')).toHaveClass('slide1');
  91                                         $.deck('go', 2);
  92                                         expect($.deck('getSlide')).toHaveClass('slide3');
  93                                 });
  94                         });
  95
  96                         describe('getSlide(i)', function() {
  97                                 it('should get slide number i (0 based index)', function() {
  98                                         expect($.deck('getSlide', 1)).toHaveClass('slide2');
  99                                         expect($.deck('getSlide', 3)).toHaveClass('slide4');
 100                                 });
 101
 102                                 it('should return null if i is NaN', function() {
 103                                         expect($.deck('getSlide', 'barfoo')).toBeNull();
 104                                 });
 105
 106                                 it('should return null if i is out of bounds', function() {
 107                                         expect($.deck('getSlide', 6)).toBeNull();
 108                                 });
 109                         });
 110
 111                         describe('getSlides()', function() {
 112                                 it('should return an array of jQuery objects for each slide', function() {
 113                                         var expectation = [],
 114                                         slides = $.deck('getSlides');
 115                                         $('.slide').each(function() {
 116                                                 expectation.push($(this));
 117                                         });
 118                                         expect(slides).toEqual(expectation);
 119                                 });
 120                         });
 121
 122                         describe('getContainer()', function() {
 123                                 it('should return a jQuery object with the container element(s)', function() {
 124                                         expect($.deck('getContainer')).toBe(defaults.selectors.container);
 125                                 });
 126                         });
 127
 128                         describe('getOptions()', function() {
 129                                 it('should return the current options object', function() {
 130                                         expect($.deck('getOptions')).toEqual(defaults);
 131                                 });
 132                         });
 133                 });
 134
 135                 describe('container states', function() {
 136                         beforeEach(function() {
 137                                 $.deck('.slide');
 138                         });
 139
 140                         it('should start at state 0', function() {
 141                                 expect($(defaults.selectors.container)).toHaveClass(defaults.classes.onPrefix + '0');
 142                         });
 143
 144                         it('should change states with the slide number', function() {
 145                                 $.deck('next');
 146                                 expect($(defaults.selectors.container)).toHaveClass(defaults.classes.onPrefix + '1');
 147                                 $.deck('go', 3);
 148                                 expect($(defaults.selectors.container)).toHaveClass(defaults.classes.onPrefix + '3');
 149                                 $.deck('prev');
 150                                 expect($(defaults.selectors.container)).toHaveClass(defaults.classes.onPrefix + '2');
 151                         });
 152                 });
 153
 154                 describe('options object', function() {
 155                         var $d = $(document);
 156
 157                         beforeEach(function() {
 158                                 $.deck('.alt-slide', {
 159                                         classes: {
 160                                                 after: 'alt-after',
 161                                                 before: 'alt-before',
 162                                                 current: 'alt-current',
 163                                                 onPrefix: 'alt-on-',
 164                                                 next: 'alt-next',
 165                                                 previous: 'alt-prev'
 166                                         },
 167
 168                                         selectors: {
 169                                                 container: '.alt-container'
 170                                         },
 171
 172                                         keys: {
 173                                                 next: 87,
 174                                                 previous: 69
 175                                         }
 176                                 });
 177                         });
 178
 179                         describe('classes', function() {
 180                                 it('should use the specified after class', function() {
 181                                         expect($('.alt-slide3, .alt-slide4, .alt-slide5')).toHaveClass('alt-after');
 182                                 });
 183
 184                                 it('should use the specified before class', function() {
 185                                         $.deck('go', 4);
 186                                         expect($('.alt-slide1, .alt-slide2, .alt-slide3')).toHaveClass('alt-before');
 187                                 });
 188
 189                                 it('should use the specified container class', function() {
 190                                         $.deck('go', 2);
 191                                         expect($('.alt-container')).toHaveClass('alt-on-2');
 192                                 });
 193
 194                                 it('should use the specified current class', function() {
 195                                         expect($.deck('getSlide')).toHaveClass('alt-current');
 196                                 });
 197
 198                                 it('should use the specified next class', function() {
 199                                         expect($('.alt-slide2')).toHaveClass('alt-next');
 200                                 });
 201
 202                                 it('should use the specified previous class', function() {
 203                                         $.deck('next');
 204                                         expect($('.alt-slide1')).toHaveClass('alt-prev');
 205                                 });
 206                         });
 207
 208                         describe('key bindings', function() {
 209                                 var e;
 210
 211                                 beforeEach(function() {
 212                                         e = jQuery.Event('keydown.deck');
 213                                 });
 214
 215                                 it('should go to the next slide using the specified key', function() {
 216                                         e.which = 87; // 'w'
 217                                         $d.trigger(e);
 218                                         expect($.deck('getSlide')).toHaveClass('alt-slide2');
 219                                 });
 220
 221                                 it('should go to the previous slide using the specified key', function() {
 222                                         $.deck('next');
 223                                         e.which = 69; // 'e'
 224                                         $d.trigger(e);
 225                                         expect($.deck('getSlide')).toHaveClass('alt-slide1');
 226                                 });
 227                         });
 228                 });
 229
 230                 describe('events', function() {
 231                         var $d = $(document);
 232
 233                         beforeEach(function() {
 234                                 $.deck('.slide');
 235                                 $.deck('go', 1);
 236                                 spyOnEvent($d, 'deck.change');
 237                         });
 238
 239                         describe('deck.change', function() {
 240                                 it('should fire on go(i)', function() {
 241                                         $.deck('go', 3);
 242                                         expect('deck.change').toHaveBeenTriggeredOn($d);
 243                                 });
 244
 245                                 it('should fire on next()', function() {
 246                                         $.deck('next');
 247                                         expect('deck.change').toHaveBeenTriggeredOn($d);
 248                                 });
 249
 250                                 it('should fire on prev()', function() {
 251                                         $.deck('prev');
 252                                         expect('deck.change').toHaveBeenTriggeredOn($d);
 253                                 });
 254
 255                                 it('should pass parameters with from and to indices', function() {
 256                                         var f = function(e, from, to) {
 257                                                 expect(from).toEqual(1);
 258                                                 expect(to).toEqual(3);
 259                                         };
 260
 261                                         $d.bind('deck.change', f);
 262                                         $.deck('go', 3);
 263                                         $d.unbind('deck.change', f);
 264                                 });
 265                         });
 266                 });
 267         });
 268
 269         describe('complex html structure', function() {
 270                 beforeEach(function() {
 271                         loadFixtures('complex.html');
 272                         if (Modernizr.history) {
 273                                 history.replaceState({}, "", "#")
 274                         }
 275                         $.deck([
 276                                 '.slide1',
 277                                 '.slide2',
 278                                 '.slide3',
 279                                 '.slide4',
 280                                 '.slide5',
 281                                 '.slide6',
 282                                 '.slide7',
 283                                 '.slide8',
 284                                 '.slide9',
 285                                 '.slide10',
 286                         ]);
 287                         $.deck('go', 2);
 288                 });
 289
 290                 describe('compound state classes', function() {
 291                         it('should apply current class', function() {
 292                                 $('.slide3').each(function(i, el) {
 293                                         expect($(el)).toHaveClass(defaults.classes.current);
 294                                 });
 295                         });
 296
 297                         it('should apply previous class', function() {
 298                                 $('.slide2').each(function(i, el) {
 299                                         expect($(el)).toHaveClass(defaults.classes.previous);
 300                                 });
 301                         });
 302
 303                         it('should apply next class', function() {
 304                                 $('.slide4').each(function(i, el) {
 305                                         expect($(el)).toHaveClass(defaults.classes.next);
 306                                 });
 307                         });
 308
 309                         it('should apply before class', function() {
 310                                 $('.slide1').each(function(i, el) {
 311                                         expect($(el)).toHaveClass(defaults.classes.before);
 312                                 });
 313                         });
 314
 315                         it('should apply after class', function() {
 316                                 $('.slide5, .slide6, .slide7, .slide8, .slide9, .slide10').each(function(i, el) {
 317                                         expect($(el)).toHaveClass(defaults.classes.after);
 318                                 });
 319                         });
 320
 321                         it('should apply child-current class', function() {
 322                                 expect($('.slide2').not('.slide10')).toHaveClass(defaults.classes.childCurrent);
 323                         });
 324                 });
 325
 326                 it('should remove old state classes', function() {
 327                         $.deck('go', 4);
 328                         expect($('.slide3').not('.slide5')).not.toHaveClass(defaults.classes.current);
 329                         expect($('.slide2').not('.slide4')).not.toHaveClass(defaults.classes.previous);
 330                         expect($('.slide4').not('.slide6')).not.toHaveClass(defaults.classes.next);
 331                 });
 332         });
 333 });