third_party/polymer/components/core-ajax/test/core-ajax.html

   1 <!doctype html>
   2 <!--
   3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
   4 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
   5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
   6 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
   7 Code distributed by Google as part of the polymer project is also
   8 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
   9 -->
  10 <html>
  11 <head>
  12   <title>core-ajax</title>
  13
  14   <script src="../../webcomponentsjs/webcomponents.js"></script>
  15   <script src="../../web-component-tester/browser.js"></script>
  16
  17   <link rel="import" href="../core-ajax.html">
  18
  19 </head>
  20 <body>
  21   <core-ajax></core-ajax>
  22
  23   <script>
  24   suite('core-ajax', function() {
  25     var xhr, requests, ajax;
  26     suiteSetup(function() {
  27       xhr = sinon.useFakeXMLHttpRequest();
  28       ajax = document.querySelector("core-ajax");
  29       xhr.onCreate = function (xhr) {
  30         requests.push(xhr);
  31       };
  32       // Reset the core-ajax element before each test.
  33       ajax.auto = false;
  34       ajax.url = '';
  35       ajax.params = '';
  36       ajax.handleAs = 'text';
  37       ajax.body = '';
  38     });
  39     setup(function() {
  40       requests = [];
  41     });
  42     suite('handleAs', function() {
  43       suite('text', function(){
  44         var headers = {
  45           "Content-Type": "text/plain"
  46         };
  47         setup(function(done){
  48           async.series([
  49             function(cb){
  50               ajax.handleAs = 'text';
  51               ajax.url = "http://example.com/text"
  52               ajax.auto = true;
  53               cb();
  54             },
  55             animationFrameFlush,
  56             function(cb){
  57               requests[0].respond(200, headers, "test text");
  58               cb();
  59             }
  60             ], done);
  61         });
  62         test('Raw text should pass through', function(){
  63           assert.equal(ajax.response, "test text")
  64         });
  65       });
  66       suite('xml', function(){
  67         var headers = {
  68           "Content-Type": "text/xml"
  69         };
  70         setup(function(done){
  71           async.series([
  72             function(cb){
  73               ajax.handleAs = 'xml';
  74               ajax.url = "http://example.com/xml"
  75               ajax.auto = true;
  76               cb();
  77             },
  78             animationFrameFlush,
  79             function(cb){
  80               requests[0].respond(200, headers,
  81                           "<note>" +
  82                           "<to>AJ</to>" +
  83                           "<from>Dog</from>" +
  84                           "<subject>Reminder</subject>" +
  85                           "<body><q>Feed me!</q></body>" +
  86                           "</note>");
  87               cb();
  88             }
  89             ], done);
  90         });
  91         test('XML should be returned with queryable structure', function(){
  92           var q = ajax.response.querySelector("note body q");
  93           assert.equal(q.childNodes[0].textContent, "Feed me!");
  94           var to = ajax.response.querySelector("to");
  95           assert.equal(to.childNodes[0].textContent, "AJ");
  96         })});
  97       suite('json', function(){
  98         var headers = {
  99           "Content-Type": "text/json"
 100         };
 101         setup(function(done){
 102           async.series([
 103             function(cb){
 104               ajax.handleAs = 'json';
 105               ajax.url = "http://example.com/json"
 106               ajax.auto = true;
 107               cb();
 108             },
 109             animationFrameFlush,
 110             function(cb){
 111               requests[0].respond(200, headers,
 112                           '{"object" : {"list" : [2, 3, {"key": "value"}]}}');
 113               cb();
 114             }
 115             ], done);
 116         });
 117         test('JSON should be returned as an Object', function(){
 118           var r = ajax.response;
 119           assert.equal(r.object.list[1], 3);
 120           assert.equal(r.object.list[2].key, "value");
 121         });
 122       });
 123       suite('arraybuffer', function(){
 124         var headers = {
 125           "Content-Type": "text/plain"
 126         };
 127         setup(function(done){
 128           async.series([
 129             function(cb){
 130               ajax.handleAs = 'arraybuffer';
 131               ajax.url = "http://example.com/data"
 132               ajax.auto = true;
 133               cb();
 134             },
 135             animationFrameFlush,
 136             function(cb){
 137               var buf = new ArrayBuffer(8*4);
 138               var resp = new Int32Array(buf);
 139               resp[3] = 12;
 140               resp[6] = 21;
 141               requests[0].response = buf;
 142               requests[0].respond(200, headers, 'blahblahblah');
 143               cb();
 144             }
 145             ], done);
 146         });
 147         test('arraybuffer response should be passed through', function(){
 148           var r = ajax.response;
 149           var ints = new Int32Array(r);
 150           assert.equal(ints[3], 12);
 151           assert.equal(ints[6], 21);
 152         });
 153       });
 154       suite('blob', function(){});
 155       suite('document', function(){});
 156     });
 157     suite('auto', function() {
 158       suiteSetup(function(){
 159         ajax.url = "http://example.com/"
 160         ajax.auto = true;
 161       });
 162       test('url change should trigger request', function(done){
 163         async.series([
 164           function(cb){
 165             ajax.url = "http://example.com/auto";
 166             cb();
 167           },
 168           animationFrameFlush,
 169           function(cb){
 170             assert.equal(requests.length, 1);
 171             cb();
 172           }
 173           ], done);
 174       });
 175       test('params change should trigger request', function(done){
 176         async.series([
 177           function(cb){
 178             ajax.params = {param: "value"};
 179             cb();
 180           },
 181           animationFrameFlush,
 182           function(cb){
 183             assert.equal(requests.length, 1);
 184             cb();
 185           }
 186           ], done);
 187       });
 188       test('body change should trigger request', function(done){
 189         async.series([
 190           function(cb){
 191             ajax.method = "POST";
 192             ajax.body = "bodystuff";
 193             cb();
 194           },
 195           animationFrameFlush,
 196           function(cb){
 197             assert.equal(requests.length, 1);
 198             cb();
 199           }
 200           ], done);
 201       });
 202     });
 203     suite('events', function(){
 204       var headers = {
 205         "Content-Type": "text/plain"
 206       };
 207       var body = "somebodytext";
 208       var responded;
 209       setup(function(done){
 210         async.series([
 211           function(cb){
 212             ajax.auto = false;
 213             cb();
 214           },
 215           animationFrameFlush,
 216           function(cb){;
 217             ajax.handleAs = 'text';
 218             ajax.url = "http://example.com/text"
 219             ajax.auto = true;
 220             cb();
 221           },
 222           animationFrameFlush,
 223           ], done);
 224         responded = false;
 225       });
 226       suite('core-response', function(){
 227         test('core-response should be fired on success', function(done){
 228           window.addEventListener('core-response', function(response, xhr){
 229             responded = true;
 230           });
 231           requests[0].respond(200, headers, body);
 232           assert.isTrue(responded);
 233           done();
 234         });
 235         test('core-response should not be fired on failure', function(done){
 236           window.addEventListener('core-response', function(response, xhr){
 237             responded = true;
 238           });
 239           requests[0].respond(404, headers, body);
 240           assert.isFalse(responded);
 241           done();
 242         });
 243       });
 244       suite('core-error', function(){
 245         test('core-error should be fired on failure', function(done){
 246           window.addEventListener('core-error', function(response, xhr){
 247             responded = true;
 248           });
 249           requests[0].respond(404, headers, body);
 250           assert.isTrue(responded);
 251           done();
 252         });
 253         test('core-error should not be fired on success', function(done){
 254           var responded = false;
 255           window.addEventListener('core-error', function(response, xhr){
 256             responded = true;
 257           });
 258           requests[0].respond(200, headers, body);
 259           assert.isFalse(responded);
 260           done();
 261         });
 262       });
 263       suite('core-complete', function(){
 264         test('core-complete should be fired on success', function(done){
 265           window.addEventListener('core-complete', function(response, xhr){
 266             responded = true;
 267           });
 268           requests[0].respond(200, headers, body);
 269           assert.isTrue(responded);
 270           done();
 271         });
 272         test('core-complete should be fired on failure', function(done){
 273           var responded = false;
 274           window.addEventListener('core-complete', function(response, xhr){
 275             responded = true;
 276           });
 277           requests[0].respond(404, headers, body);
 278           assert.isTrue(responded);
 279           done();
 280         });
 281       });
 282     });
 283   });
 284   </script>
 285
 286 </body>
 287 </html>