Specs/Request/Request.HTML.js

   1 /*
   2 ---
   3 name: Request.HTML
   4 requires: ~
   5 provides: ~
   6 ...
   7 */
   8
   9 describe('Request.HTML', function(){
  10
  11         beforeEach(function(){
  12                 this.spy = jasmine.createSpy();
  13                 this.xhr = sinon.useFakeXMLHttpRequest();
  14                 var requests = this.requests = [];
  15                 this.xhr.onCreate = function(xhr){
  16                         requests.push(xhr);
  17                 };
  18         });
  19
  20         afterEach(function(){
  21                 this.xhr.restore();
  22         });
  23
  24         it('should create an ajax request and pass the right arguments to the onComplete event', function(){
  25
  26                 var response = '<body><img><div><span>res&amp;ponsé</span></div><script>___SPEC___=5;</script></body>';
  27
  28                 this.spy.identity = 'Request.HTML onComplete';
  29                 var request = new Request.HTML({
  30                         url: '../Helpers/request.php',
  31                         onComplete: this.spy
  32                 }).send();
  33
  34                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
  35
  36                 expect(this.spy.wasCalled).toBe(true);
  37
  38                 // checks arguments order
  39                 expect(this.spy).toHaveBeenCalledWith(request.response.tree, request.response.elements, request.response.html, request.response.javascript);
  40                 var onCompleteArgs = this.spy.argsForCall[0];
  41                 expect(onCompleteArgs[0][0].nodeName).toEqual('IMG');
  42                 expect(onCompleteArgs[0][1].nodeName).toEqual('DIV');
  43                 expect(onCompleteArgs[1][2].nodeName).toEqual('SPAN');
  44                 expect(onCompleteArgs[2]).toEqual('<img><div><span>res&amp;ponsé</span></div>');
  45                 expect(onCompleteArgs[3].trim()).toEqual('___SPEC___=5;');
  46                 expect(___SPEC___).toEqual(5);
  47
  48         });
  49
  50         xit('(async) should create an ajax request and correctly generate the tree response from a tr', function(){
  51
  52                 runs(function(){
  53                         this.request = new Request.HTML({
  54                                 url: '../Helpers/request.php',
  55                                 onComplete: this.spy
  56                         }).send({data: {
  57                                 '__response': '<tr><td>text</td></tr>', '__type': 'html'
  58                         }});
  59                 });
  60
  61                 waitsFor(800, function(){
  62                         return this.spy.wasCalled;
  63                 });
  64
  65                 runs(function(){
  66                         var onCompleteArgs = this.spy.argsForCall[0];
  67
  68                         expect(onCompleteArgs[0][0].nodeName).toEqual('TR');
  69                         expect(onCompleteArgs[1][1].nodeName).toEqual('TD');
  70                         expect(onCompleteArgs[2]).toEqual('<tr><td>text</td></tr>');
  71                 });
  72
  73         });
  74
  75         xit('(async) should create an ajax request and correctly generate the tree response from options', function(){
  76
  77                 runs(function(){
  78                         this.request = new Request.HTML({
  79                                 url: '../Helpers/request.php',
  80                                 onComplete: this.spy
  81                         }).send({data: {
  82                                 '__response': '<option>1</option><option>2</option><option>3</option>', '__type': 'html'
  83                         }});
  84                 });
  85
  86                 waitsFor(800, function(){
  87                         return this.spy.wasCalled;
  88                 });
  89
  90                 runs(function(){
  91                         var onCompleteArgs = this.spy.argsForCall[0];
  92
  93                         expect(onCompleteArgs[0].length).toEqual(3);
  94                         expect(onCompleteArgs[1].length).toEqual(3);
  95                         expect(onCompleteArgs[2]).toEqual('<option>1</option><option>2</option><option>3</option>');
  96                         expect(onCompleteArgs[3]).toBeFalsy();
  97
  98                         var firstOption = onCompleteArgs[0][0];
  99                         expect(firstOption.tagName).toEqual('OPTION');
 100                         expect(firstOption.innerHTML).toEqual('1');
 101                 });
 102
 103         });
 104
 105         it('should create an ajax request and correctly update an element with the response', function(){
 106
 107                 var response = '<span>text</span>';
 108
 109                 this.spy.identity = 'Request.HTML onComplete update element';
 110                 new Element('div', {'id': 'update', 'html': '<div>some</div>'}).inject(document.body);
 111                 this.request = new Request.HTML({
 112                         url: '../Helpers/request.php',
 113                         onComplete: this.spy,
 114                         update: 'update'
 115                 }).send();
 116
 117                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 118
 119                 expect(this.spy.wasCalled).toBe(true);
 120
 121                 var update = $('update');
 122                 expect(update.getChildren().length).toEqual(1);
 123                 expect(update.getFirst().get('tag')).toEqual('span');
 124                 expect(update.getFirst().get('text')).toEqual('text');
 125                 update.dispose();
 126         });
 127
 128         it('should create an ajax request and correctly append the response to an element', function(){
 129
 130                 var response = '<div><span>text</span><p>paragraph</p></div>';
 131
 132                 new Element('div', {'id': 'update', 'html': '<div>some</div>'}).inject(document.body);
 133                 this.spy.identity = 'Request.HTML onComplete ajax append';
 134                 this.request = new Request.HTML({
 135                         url: '../Helpers/request.php',
 136                         onComplete: this.spy,
 137                         append: 'update'
 138                 }).send();
 139
 140                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 141
 142                 expect(this.spy.wasCalled).toBe(true);
 143
 144                 var update = $('update');
 145                 expect(update.getChildren().length).toEqual(2);
 146                 expect(update.getFirst().get('tag')).toEqual('div');
 147                 expect(update.getFirst().get('text')).toEqual('some');
 148                 var div = update.getFirst().getNext();
 149                 expect(div.get('tag')).toEqual('div');
 150                 expect(div.getFirst().get('tag')).toEqual('span');
 151                 expect(div.getFirst().get('text')).toEqual('text');
 152                 expect(div.getLast().get('tag')).toEqual('p');
 153                 expect(div.getLast().get('text')).toEqual('paragraph');
 154                 update.dispose();
 155
 156         });
 157
 158         it('should create an ajax request and correctly filter it by the passed selector', function(){
 159
 160                 var response = '<span>text</span><a>aaa</a>';
 161
 162                 this.spy.identity = 'Request.HTML onComplete filter';
 163                 var request = new Request.HTML({
 164                         url: '../Helpers/request.php',
 165                         onComplete: this.spy,
 166                         filter: 'a'
 167                 }).send();
 168
 169                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 170                 expect(this.spy.wasCalled).toBe(true);
 171
 172                 var onCompleteArgs = this.spy.argsForCall[0];
 173                 expect(onCompleteArgs[0].length).toEqual(1);
 174                 expect(onCompleteArgs[0][0].get('tag')).toEqual('a');
 175                 expect(onCompleteArgs[0][0].get('text')).toEqual('aaa');
 176
 177         });
 178
 179         it('should create an ajax request that filters the response and updates the target', function(){
 180
 181                 var response = '<div>text<p><a>a link</a></p></div>';
 182
 183                 this.spy.identity = 'Request.HTML onComplete update and filter';
 184                 new Element('div', {'id': 'update', 'html': '<div>some</div>'}).inject(document.body);
 185                 this.request = new Request.HTML({
 186                         url: '../Helpers/request.php',
 187                         onComplete: this.spy,
 188                         update: 'update',
 189                         filter: 'a'
 190                 }).send();
 191
 192                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 193                 expect(this.spy.wasCalled).toBe(true);
 194
 195                 var update = $('update');
 196                 expect(update.getChildren().length).toEqual(1);
 197                 expect(update.getFirst().get('tag')).toEqual('a');
 198                 expect(update.getFirst().get('text')).toEqual('a link');
 199                 update.dispose();
 200
 201         });
 202
 203         it('should create an ajax request that filters the response and appends to the target', function(){
 204
 205                 var response = '<div>text<p><a>a link</a></p></div>';
 206
 207                 new Element('div', {'id': 'update', 'html': '<div>some</div>'}).inject(document.body);
 208                 this.spy.identity = 'Request.HTML onComplete append and filter';
 209                 this.request = new Request.HTML({
 210                         url: '../Helpers/request.php',
 211                         onComplete: this.spy,
 212                         append: 'update',
 213                         filter: 'a'
 214                 }).send();
 215
 216                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 217                 expect(this.spy.wasCalled).toBe(true);
 218
 219                 var update = $('update');
 220                 expect(update.getChildren().length).toEqual(2);
 221                 expect(update.get('html').toLowerCase()).toEqual('<div>some</div><a>a link</a>');
 222                 update.dispose();
 223
 224         });
 225
 226         it('should create an ajax request through Element.load', function(){
 227
 228                 var element = new Element('div');
 229
 230                 var response = 'hello world!';
 231
 232                 this.spy.identity = 'Request.HTML onComplete load';
 233                 var request = element.set('load', {
 234                         url: '../Helpers/request.php',
 235                         onComplete: this.spy
 236                 }).get('load');
 237
 238                 expect(instanceOf(request, Request.HTML)).toBeTruthy();
 239
 240                 element.load({
 241                         '__response': response, '__type': 'html'
 242                 });
 243
 244                 this.requests[0].respond(200, {'Content-Type': 'text/html'}, response);
 245                 expect(this.spy.wasCalled).toBe(true);
 246
 247                 runs(function(){
 248                         var onCompleteArgs = this.spy.argsForCall[0];
 249                         expect(element.get('text')).toEqual('hello world!');
 250                 });
 251
 252         });
 253
 254 });