ecomp-portal-FE/client/bower_components/lodash/vendor/backbone/test/view.js

   1 (function() {
   2
   3   var view;
   4
   5   QUnit.module('Backbone.View', {
   6
   7     beforeEach: function(assert) {
   8       $('#qunit-fixture').append(
   9         '<div id="testElement"><h1>Test</h1></div>'
  10       );
  11
  12       view = new Backbone.View({
  13         id: 'test-view',
  14         className: 'test-view',
  15         other: 'non-special-option'
  16       });
  17     },
  18
  19     afterEach: function() {
  20       $('#testElement').remove();
  21       $('#test-view').remove();
  22     }
  23
  24   });
  25
  26   QUnit.test('constructor', function(assert) {
  27     assert.expect(3);
  28     assert.equal(view.el.id, 'test-view');
  29     assert.equal(view.el.className, 'test-view');
  30     assert.equal(view.el.other, void 0);
  31   });
  32
  33   QUnit.test('$', function(assert) {
  34     assert.expect(2);
  35     var myView = new Backbone.View;
  36     myView.setElement('<p><a><b>test</b></a></p>');
  37     var result = myView.$('a b');
  38
  39     assert.strictEqual(result[0].innerHTML, 'test');
  40     assert.ok(result.length === +result.length);
  41   });
  42
  43   QUnit.test('$el', function(assert) {
  44     assert.expect(3);
  45     var myView = new Backbone.View;
  46     myView.setElement('<p><a><b>test</b></a></p>');
  47     assert.strictEqual(myView.el.nodeType, 1);
  48
  49     assert.ok(myView.$el instanceof Backbone.$);
  50     assert.strictEqual(myView.$el[0], myView.el);
  51   });
  52
  53   QUnit.test('initialize', function(assert) {
  54     assert.expect(1);
  55     var View = Backbone.View.extend({
  56       initialize: function() {
  57         this.one = 1;
  58       }
  59     });
  60
  61     assert.strictEqual(new View().one, 1);
  62   });
  63
  64   QUnit.test('render', function(assert) {
  65     assert.expect(1);
  66     var myView = new Backbone.View;
  67     assert.equal(myView.render(), myView, '#render returns the view instance');
  68   });
  69
  70   QUnit.test('delegateEvents', function(assert) {
  71     assert.expect(6);
  72     var counter1 = 0, counter2 = 0;
  73
  74     var myView = new Backbone.View({el: '#testElement'});
  75     myView.increment = function(){ counter1++; };
  76     myView.$el.on('click', function(){ counter2++; });
  77
  78     var events = {'click h1': 'increment'};
  79
  80     myView.delegateEvents(events);
  81     myView.$('h1').trigger('click');
  82     assert.equal(counter1, 1);
  83     assert.equal(counter2, 1);
  84
  85     myView.$('h1').trigger('click');
  86     assert.equal(counter1, 2);
  87     assert.equal(counter2, 2);
  88
  89     myView.delegateEvents(events);
  90     myView.$('h1').trigger('click');
  91     assert.equal(counter1, 3);
  92     assert.equal(counter2, 3);
  93   });
  94
  95   QUnit.test('delegate', function(assert) {
  96     assert.expect(3);
  97     var myView = new Backbone.View({el: '#testElement'});
  98     myView.delegate('click', 'h1', function() {
  99       assert.ok(true);
 100     });
 101     myView.delegate('click', function() {
 102       assert.ok(true);
 103     });
 104     myView.$('h1').trigger('click');
 105
 106     assert.equal(myView.delegate(), myView, '#delegate returns the view instance');
 107   });
 108
 109   QUnit.test('delegateEvents allows functions for callbacks', function(assert) {
 110     assert.expect(3);
 111     var myView = new Backbone.View({el: '<p></p>'});
 112     myView.counter = 0;
 113
 114     var events = {
 115       click: function() {
 116         this.counter++;
 117       }
 118     };
 119
 120     myView.delegateEvents(events);
 121     myView.$el.trigger('click');
 122     assert.equal(myView.counter, 1);
 123
 124     myView.$el.trigger('click');
 125     assert.equal(myView.counter, 2);
 126
 127     myView.delegateEvents(events);
 128     myView.$el.trigger('click');
 129     assert.equal(myView.counter, 3);
 130   });
 131
 132
 133   QUnit.test('delegateEvents ignore undefined methods', function(assert) {
 134     assert.expect(0);
 135     var myView = new Backbone.View({el: '<p></p>'});
 136     myView.delegateEvents({'click': 'undefinedMethod'});
 137     myView.$el.trigger('click');
 138   });
 139
 140   QUnit.test('undelegateEvents', function(assert) {
 141     assert.expect(7);
 142     var counter1 = 0, counter2 = 0;
 143
 144     var myView = new Backbone.View({el: '#testElement'});
 145     myView.increment = function(){ counter1++; };
 146     myView.$el.on('click', function(){ counter2++; });
 147
 148     var events = {'click h1': 'increment'};
 149
 150     myView.delegateEvents(events);
 151     myView.$('h1').trigger('click');
 152     assert.equal(counter1, 1);
 153     assert.equal(counter2, 1);
 154
 155     myView.undelegateEvents();
 156     myView.$('h1').trigger('click');
 157     assert.equal(counter1, 1);
 158     assert.equal(counter2, 2);
 159
 160     myView.delegateEvents(events);
 161     myView.$('h1').trigger('click');
 162     assert.equal(counter1, 2);
 163     assert.equal(counter2, 3);
 164
 165     assert.equal(myView.undelegateEvents(), myView, '#undelegateEvents returns the view instance');
 166   });
 167
 168   QUnit.test('undelegate', function(assert) {
 169     assert.expect(1);
 170     var myView = new Backbone.View({el: '#testElement'});
 171     myView.delegate('click', function() { assert.ok(false); });
 172     myView.delegate('click', 'h1', function() { assert.ok(false); });
 173
 174     myView.undelegate('click');
 175
 176     myView.$('h1').trigger('click');
 177     myView.$el.trigger('click');
 178
 179     assert.equal(myView.undelegate(), myView, '#undelegate returns the view instance');
 180   });
 181
 182   QUnit.test('undelegate with passed handler', function(assert) {
 183     assert.expect(1);
 184     var myView = new Backbone.View({el: '#testElement'});
 185     var listener = function() { assert.ok(false); };
 186     myView.delegate('click', listener);
 187     myView.delegate('click', function() { assert.ok(true); });
 188     myView.undelegate('click', listener);
 189     myView.$el.trigger('click');
 190   });
 191
 192   QUnit.test('undelegate with selector', function(assert) {
 193     assert.expect(2);
 194     var myView = new Backbone.View({el: '#testElement'});
 195     myView.delegate('click', function() { assert.ok(true); });
 196     myView.delegate('click', 'h1', function() { assert.ok(false); });
 197     myView.undelegate('click', 'h1');
 198     myView.$('h1').trigger('click');
 199     myView.$el.trigger('click');
 200   });
 201
 202   QUnit.test('undelegate with handler and selector', function(assert) {
 203     assert.expect(2);
 204     var myView = new Backbone.View({el: '#testElement'});
 205     myView.delegate('click', function() { assert.ok(true); });
 206     var handler = function(){ assert.ok(false); };
 207     myView.delegate('click', 'h1', handler);
 208     myView.undelegate('click', 'h1', handler);
 209     myView.$('h1').trigger('click');
 210     myView.$el.trigger('click');
 211   });
 212
 213   QUnit.test('tagName can be provided as a string', function(assert) {
 214     assert.expect(1);
 215     var View = Backbone.View.extend({
 216       tagName: 'span'
 217     });
 218
 219     assert.equal(new View().el.tagName, 'SPAN');
 220   });
 221
 222   QUnit.test('tagName can be provided as a function', function(assert) {
 223     assert.expect(1);
 224     var View = Backbone.View.extend({
 225       tagName: function() {
 226         return 'p';
 227       }
 228     });
 229
 230     assert.ok(new View().$el.is('p'));
 231   });
 232
 233   QUnit.test('_ensureElement with DOM node el', function(assert) {
 234     assert.expect(1);
 235     var View = Backbone.View.extend({
 236       el: document.body
 237     });
 238
 239     assert.equal(new View().el, document.body);
 240   });
 241
 242   QUnit.test('_ensureElement with string el', function(assert) {
 243     assert.expect(3);
 244     var View = Backbone.View.extend({
 245       el: 'body'
 246     });
 247     assert.strictEqual(new View().el, document.body);
 248
 249     View = Backbone.View.extend({
 250       el: '#testElement > h1'
 251     });
 252     assert.strictEqual(new View().el, $('#testElement > h1').get(0));
 253
 254     View = Backbone.View.extend({
 255       el: '#nonexistent'
 256     });
 257     assert.ok(!new View().el);
 258   });
 259
 260   QUnit.test('with className and id functions', function(assert) {
 261     assert.expect(2);
 262     var View = Backbone.View.extend({
 263       className: function() {
 264         return 'className';
 265       },
 266       id: function() {
 267         return 'id';
 268       }
 269     });
 270
 271     assert.strictEqual(new View().el.className, 'className');
 272     assert.strictEqual(new View().el.id, 'id');
 273   });
 274
 275   QUnit.test('with attributes', function(assert) {
 276     assert.expect(2);
 277     var View = Backbone.View.extend({
 278       attributes: {
 279         'id': 'id',
 280         'class': 'class'
 281       }
 282     });
 283
 284     assert.strictEqual(new View().el.className, 'class');
 285     assert.strictEqual(new View().el.id, 'id');
 286   });
 287
 288   QUnit.test('with attributes as a function', function(assert) {
 289     assert.expect(1);
 290     var View = Backbone.View.extend({
 291       attributes: function() {
 292         return {'class': 'dynamic'};
 293       }
 294     });
 295
 296     assert.strictEqual(new View().el.className, 'dynamic');
 297   });
 298
 299   QUnit.test('should default to className/id properties', function(assert) {
 300     assert.expect(4);
 301     var View = Backbone.View.extend({
 302       className: 'backboneClass',
 303       id: 'backboneId',
 304       attributes: {
 305         'class': 'attributeClass',
 306         'id': 'attributeId'
 307       }
 308     });
 309
 310     var myView = new View;
 311     assert.strictEqual(myView.el.className, 'backboneClass');
 312     assert.strictEqual(myView.el.id, 'backboneId');
 313     assert.strictEqual(myView.$el.attr('class'), 'backboneClass');
 314     assert.strictEqual(myView.$el.attr('id'), 'backboneId');
 315   });
 316
 317   QUnit.test('multiple views per element', function(assert) {
 318     assert.expect(3);
 319     var count = 0;
 320     var $el = $('<p></p>');
 321
 322     var View = Backbone.View.extend({
 323       el: $el,
 324       events: {
 325         click: function() {
 326           count++;
 327         }
 328       }
 329     });
 330
 331     var view1 = new View;
 332     $el.trigger('click');
 333     assert.equal(1, count);
 334
 335     var view2 = new View;
 336     $el.trigger('click');
 337     assert.equal(3, count);
 338
 339     view1.delegateEvents();
 340     $el.trigger('click');
 341     assert.equal(5, count);
 342   });
 343
 344   QUnit.test('custom events', function(assert) {
 345     assert.expect(2);
 346     var View = Backbone.View.extend({
 347       el: $('body'),
 348       events: {
 349         fake$event: function() { assert.ok(true); }
 350       }
 351     });
 352
 353     var myView = new View;
 354     $('body').trigger('fake$event').trigger('fake$event');
 355
 356     $('body').off('fake$event');
 357     $('body').trigger('fake$event');
 358   });
 359
 360   QUnit.test('#1048 - setElement uses provided object.', function(assert) {
 361     assert.expect(2);
 362     var $el = $('body');
 363
 364     var myView = new Backbone.View({el: $el});
 365     assert.ok(myView.$el === $el);
 366
 367     myView.setElement($el = $($el));
 368     assert.ok(myView.$el === $el);
 369   });
 370
 371   QUnit.test('#986 - Undelegate before changing element.', function(assert) {
 372     assert.expect(1);
 373     var button1 = $('<button></button>');
 374     var button2 = $('<button></button>');
 375
 376     var View = Backbone.View.extend({
 377       events: {
 378         click: function(e) {
 379           assert.ok(myView.el === e.target);
 380         }
 381       }
 382     });
 383
 384     var myView = new View({el: button1});
 385     myView.setElement(button2);
 386
 387     button1.trigger('click');
 388     button2.trigger('click');
 389   });
 390
 391   QUnit.test('#1172 - Clone attributes object', function(assert) {
 392     assert.expect(2);
 393     var View = Backbone.View.extend({
 394       attributes: {foo: 'bar'}
 395     });
 396
 397     var view1 = new View({id: 'foo'});
 398     assert.strictEqual(view1.el.id, 'foo');
 399
 400     var view2 = new View();
 401     assert.ok(!view2.el.id);
 402   });
 403
 404   QUnit.test('views stopListening', function(assert) {
 405     assert.expect(0);
 406     var View = Backbone.View.extend({
 407       initialize: function() {
 408         this.listenTo(this.model, 'all x', function(){ assert.ok(false); });
 409         this.listenTo(this.collection, 'all x', function(){ assert.ok(false); });
 410       }
 411     });
 412
 413     var myView = new View({
 414       model: new Backbone.Model,
 415       collection: new Backbone.Collection
 416     });
 417
 418     myView.stopListening();
 419     myView.model.trigger('x');
 420     myView.collection.trigger('x');
 421   });
 422
 423   QUnit.test('Provide function for el.', function(assert) {
 424     assert.expect(2);
 425     var View = Backbone.View.extend({
 426       el: function() {
 427         return '<p><a></a></p>';
 428       }
 429     });
 430
 431     var myView = new View;
 432     assert.ok(myView.$el.is('p'));
 433     assert.ok(myView.$el.has('a'));
 434   });
 435
 436   QUnit.test('events passed in options', function(assert) {
 437     assert.expect(1);
 438     var counter = 0;
 439
 440     var View = Backbone.View.extend({
 441       el: '#testElement',
 442       increment: function() {
 443         counter++;
 444       }
 445     });
 446
 447     var myView = new View({
 448       events: {
 449         'click h1': 'increment'
 450       }
 451     });
 452
 453     myView.$('h1').trigger('click').trigger('click');
 454     assert.equal(counter, 2);
 455   });
 456
 457   QUnit.test('remove', function(assert) {
 458     assert.expect(2);
 459     var myView = new Backbone.View;
 460     document.body.appendChild(view.el);
 461
 462     myView.delegate('click', function() { assert.ok(false); });
 463     myView.listenTo(myView, 'all x', function() { assert.ok(false); });
 464
 465     assert.equal(myView.remove(), myView, '#remove returns the view instance');
 466     myView.$el.trigger('click');
 467     myView.trigger('x');
 468
 469     // In IE8 and below, parentNode still exists but is not document.body.
 470     assert.notEqual(myView.el.parentNode, document.body);
 471   });
 472
 473   QUnit.test('setElement', function(assert) {
 474     assert.expect(3);
 475     var myView = new Backbone.View({
 476       events: {
 477         click: function() { assert.ok(false); }
 478       }
 479     });
 480     myView.events = {
 481       click: function() { assert.ok(true); }
 482     };
 483     var oldEl = myView.el;
 484     var $oldEl = myView.$el;
 485
 486     myView.setElement(document.createElement('div'));
 487
 488     $oldEl.click();
 489     myView.$el.click();
 490
 491     assert.notEqual(oldEl, myView.el);
 492     assert.notEqual($oldEl, myView.$el);
 493   });
 494
 495 })();