OLD | NEW |
(Empty) | |
| 1 <!doctype html> |
| 2 <!-- |
| 3 @license |
| 4 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
| 5 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 6 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 7 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 8 Code distributed by Google as part of the polymer project is also |
| 9 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 10 --> |
| 11 <html> |
| 12 <head> |
| 13 <title>iron-ajax</title> |
| 14 |
| 15 <script src="../../webcomponentsjs/webcomponents.js"></script> |
| 16 <script src="../../web-component-tester/browser.js"></script> |
| 17 |
| 18 <link rel="import" href="../../polymer/polymer.html"> |
| 19 <link rel="import" href="../../promise-polyfill/promise-polyfill.html"> |
| 20 <link rel="import" href="../iron-ajax.html"> |
| 21 </head> |
| 22 <body> |
| 23 <test-fixture id="TrivialGet"> |
| 24 <template> |
| 25 <iron-ajax url="/responds_to_get_with_json"></iron-ajax> |
| 26 </template> |
| 27 </test-fixture> |
| 28 <test-fixture id="ParamsGet"> |
| 29 <template> |
| 30 <iron-ajax url="/responds_to_get_with_json" |
| 31 params='{"a": "a"}'></iron-ajax> |
| 32 </template> |
| 33 </test-fixture> |
| 34 <test-fixture id="AutoGet"> |
| 35 <template> |
| 36 <iron-ajax auto url="/responds_to_get_with_json"></iron-ajax> |
| 37 </template> |
| 38 </test-fixture> |
| 39 <test-fixture id="GetEcho"> |
| 40 <template> |
| 41 <iron-ajax handle-as="json" url="/echoes_request_url"></iron-ajax> |
| 42 </template> |
| 43 </test-fixture> |
| 44 <test-fixture id="TrivialPost"> |
| 45 <template> |
| 46 <iron-ajax method="POST" |
| 47 url="/responds_to_post_with_json"></iron-ajax> |
| 48 </template> |
| 49 </test-fixture> |
| 50 <test-fixture id="DebouncedGet"> |
| 51 <template> |
| 52 <iron-ajax auto |
| 53 url="/responds_to_debounced_get_with_json" |
| 54 debounce-duration="150"></iron-ajax> |
| 55 </template> |
| 56 </test-fixture> |
| 57 <test-fixture id='BlankUrl'> |
| 58 <template> |
| 59 <iron-ajax auto handle-as='text'></iron-ajax> |
| 60 </template> |
| 61 </test-fixture> |
| 62 <test-fixture id="RealPost"> |
| 63 <template> |
| 64 <iron-ajax method="POST" url="/httpbin/post"></iron-ajax> |
| 65 </template> |
| 66 </test-fixture> |
| 67 <test-fixture id="Delay"> |
| 68 <template> |
| 69 <iron-ajax url="/httpbin/delay/1"></iron-ajax> |
| 70 </template> |
| 71 </test-fixture> |
| 72 <test-fixture id="Bubbles"> |
| 73 <template> |
| 74 <iron-ajax url="/httpbin/post" method="POST" bubbles></iron-ajax> |
| 75 <iron-ajax url="/responds_to_get_with_502_error_json" bubbles></iron-ajax> |
| 76 </template> |
| 77 </test-fixture> |
| 78 <script> |
| 79 'use strict'; |
| 80 suite('<iron-ajax>', function () { |
| 81 var responseHeaders = { |
| 82 json: { 'Content-Type': 'application/json' }, |
| 83 plain: { 'Content-Type': 'text/plain' } |
| 84 }; |
| 85 var ajax; |
| 86 var request; |
| 87 var server; |
| 88 |
| 89 function timePasses(ms) { |
| 90 return new Promise(function(resolve) { |
| 91 window.setTimeout(function() { |
| 92 resolve(); |
| 93 }, ms); |
| 94 }); |
| 95 } |
| 96 |
| 97 setup(function() { |
| 98 server = sinon.fakeServer.create(); |
| 99 server.respondWith( |
| 100 'GET', |
| 101 /\/responds_to_get_with_json.*/, |
| 102 [ |
| 103 200, |
| 104 responseHeaders.json, |
| 105 '{"success":true}' |
| 106 ] |
| 107 ); |
| 108 |
| 109 server.respondWith( |
| 110 'POST', |
| 111 '/responds_to_post_with_json', |
| 112 [ |
| 113 200, |
| 114 responseHeaders.json, |
| 115 '{"post_success":true}' |
| 116 ] |
| 117 ); |
| 118 |
| 119 server.respondWith( |
| 120 'GET', |
| 121 '/responds_to_get_with_text', |
| 122 [ |
| 123 200, |
| 124 responseHeaders.plain, |
| 125 'Hello World' |
| 126 ] |
| 127 ); |
| 128 |
| 129 server.respondWith( |
| 130 'GET', |
| 131 '/responds_to_debounced_get_with_json', |
| 132 [ |
| 133 200, |
| 134 responseHeaders.json, |
| 135 '{"success": "true"}' |
| 136 ] |
| 137 ); |
| 138 |
| 139 server.respondWith( |
| 140 'GET', |
| 141 '/responds_to_get_with_502_error_json', |
| 142 [ |
| 143 502, |
| 144 responseHeaders.json, |
| 145 '{"message": "an error has occurred"}' |
| 146 ] |
| 147 ); |
| 148 |
| 149 ajax = fixture('TrivialGet'); |
| 150 }); |
| 151 |
| 152 teardown(function() { |
| 153 server.restore(); |
| 154 }); |
| 155 |
| 156 // Echo requests are responded to individually and on demand, unlike the |
| 157 // others in this file which are responded to with server.respond(), |
| 158 // which responds to all open requests. |
| 159 // We don't use server.respondWith here because there's no way to use it |
| 160 // and only respond to a subset of requests. |
| 161 // This way we can test for delayed and out of order responses and |
| 162 // distinquish them by their responses. |
| 163 function respondToEchoRequest(request) { |
| 164 request.respond(200, responseHeaders.json, JSON.stringify({ |
| 165 url: request.url |
| 166 })); |
| 167 } |
| 168 |
| 169 suite('when making simple GET requests for JSON', function() { |
| 170 test('has sane defaults that love you', function() { |
| 171 request = ajax.generateRequest(); |
| 172 |
| 173 server.respond(); |
| 174 |
| 175 expect(request.response).to.be.ok; |
| 176 expect(request.response).to.be.an('object'); |
| 177 expect(request.response.success).to.be.equal(true); |
| 178 }); |
| 179 |
| 180 test('will be asynchronous by default', function() { |
| 181 expect(ajax.toRequestOptions().async).to.be.eql(true); |
| 182 }); |
| 183 }); |
| 184 |
| 185 suite('when setting custom headers', function() { |
| 186 test('are present in the request headers', function() { |
| 187 ajax.headers['custom-header'] = 'valid'; |
| 188 var options = ajax.toRequestOptions(); |
| 189 |
| 190 expect(options.headers).to.be.ok; |
| 191 expect(options.headers['custom-header']).to.be.an('string'); |
| 192 expect(options.headers.hasOwnProperty('custom-header')).to.be.equal( |
| 193 true); |
| 194 }); |
| 195 |
| 196 test('non-objects in headers are not applied', function() { |
| 197 ajax.headers = 'invalid'; |
| 198 var options = ajax.toRequestOptions(); |
| 199 |
| 200 expect(Object.keys(options.headers).length).to.be.equal(0); |
| 201 }); |
| 202 }); |
| 203 |
| 204 suite('when url isn\'t set yet', function() { |
| 205 test('we don\'t fire any automatic requests', function() { |
| 206 expect(server.requests.length).to.be.equal(0); |
| 207 ajax = fixture('BlankUrl'); |
| 208 |
| 209 return timePasses(1).then(function() { |
| 210 // We don't make any requests. |
| 211 expect(server.requests.length).to.be.equal(0); |
| 212 |
| 213 // Explicitly asking for the request to fire works. |
| 214 ajax.generateRequest(); |
| 215 expect(server.requests.length).to.be.equal(1); |
| 216 server.requests = []; |
| 217 |
| 218 // Explicitly setting url to '' works too. |
| 219 ajax = fixture('BlankUrl'); |
| 220 ajax.url = ''; |
| 221 return timePasses(1); |
| 222 }).then(function() { |
| 223 expect(server.requests.length).to.be.equal(1); |
| 224 }); |
| 225 }); |
| 226 |
| 227 test('requestUrl remains empty despite valid queryString', function() { |
| 228 ajax = fixture('BlankUrl'); |
| 229 expect(ajax.url).to.be.equal(undefined); |
| 230 expect(ajax.queryString).to.be.equal(''); |
| 231 expect(ajax.requestUrl).to.be.equal(''); |
| 232 |
| 233 ajax.params = {'a':'b', 'c':'d'}; |
| 234 |
| 235 expect(ajax.queryString).to.be.equal('a=b&c=d'); |
| 236 expect(ajax.requestUrl).to.be.equal('?a=b&c=d'); |
| 237 }); |
| 238 |
| 239 test('generateRequest works with empty URL and valid queryString', funct
ion() { |
| 240 ajax = fixture('BlankUrl'); |
| 241 expect(ajax.url).to.be.equal(undefined); |
| 242 |
| 243 ajax.generateRequest(); |
| 244 expect(server.requests[0].url).to.be.eql(''); |
| 245 |
| 246 ajax.params = {'a':'b', 'c':'d'}; |
| 247 |
| 248 ajax.generateRequest(); |
| 249 expect(server.requests[1].url).to.be.eql('?a=b&c=d'); |
| 250 }); |
| 251 }); |
| 252 |
| 253 suite('when properties are changed', function() { |
| 254 test('generates simple-request elements that reflect the change', functi
on() { |
| 255 request = ajax.generateRequest(); |
| 256 |
| 257 expect(request.xhr.method).to.be.equal('GET'); |
| 258 |
| 259 ajax.method = 'POST'; |
| 260 ajax.url = '/responds_to_post_with_json'; |
| 261 |
| 262 request = ajax.generateRequest(); |
| 263 |
| 264 expect(request.xhr.method).to.be.equal('POST'); |
| 265 }); |
| 266 }); |
| 267 |
| 268 suite('when generating a request', function() { |
| 269 test('yields an iron-request instance', function() { |
| 270 var IronRequest = document.createElement('iron-request').constructor; |
| 271 |
| 272 expect(ajax.generateRequest()).to.be.instanceOf(IronRequest); |
| 273 }); |
| 274 |
| 275 test('correctly adds params to a URL that already has some', function()
{ |
| 276 ajax.url += '?a=b'; |
| 277 ajax.params = {'c': 'd'}; |
| 278 expect(ajax.requestUrl).to.be.equal('/responds_to_get_with_json?a=b&c=
d') |
| 279 }) |
| 280 |
| 281 test('encodes params properly', function() { |
| 282 ajax.params = {'a b,c': 'd e f'}; |
| 283 |
| 284 expect(ajax.queryString).to.be.equal('a%20b%2Cc=d%20e%20f'); |
| 285 }); |
| 286 |
| 287 test('encodes array params properly', function() { |
| 288 ajax.params = {'a b': ['c','d e', 'f']}; |
| 289 |
| 290 expect(ajax.queryString).to.be.equal('a%20b=c&a%20b=d%20e&a%20b=f'); |
| 291 }); |
| 292 |
| 293 test('reflects the loading state in the `loading` property', function()
{ |
| 294 var request = ajax.generateRequest(); |
| 295 |
| 296 expect(ajax.loading).to.be.equal(true); |
| 297 |
| 298 server.respond(); |
| 299 |
| 300 return request.completes.then(function() { |
| 301 return timePasses(1); |
| 302 }).then(function() { |
| 303 expect(ajax.loading).to.be.equal(false); |
| 304 }); |
| 305 }); |
| 306 |
| 307 test('the loading-changed event gets fired twice', function() { |
| 308 |
| 309 var count = 0; |
| 310 ajax.addEventListener('loading-changed', function() { |
| 311 count++; |
| 312 }); |
| 313 |
| 314 var request = ajax.generateRequest(); |
| 315 |
| 316 server.respond(); |
| 317 |
| 318 return request.completes.then(function() { |
| 319 return timePasses(1); |
| 320 }).then(function() { |
| 321 expect(count).to.be.equal(2); |
| 322 }); |
| 323 |
| 324 }); |
| 325 }); |
| 326 |
| 327 suite('when there are multiple requests', function() { |
| 328 var requests; |
| 329 var echoAjax; |
| 330 var promiseAllComplete; |
| 331 |
| 332 setup(function() { |
| 333 echoAjax = fixture('GetEcho'); |
| 334 requests = []; |
| 335 |
| 336 for (var i = 0; i < 3; ++i) { |
| 337 echoAjax.params = {'order': i + 1}; |
| 338 requests.push(echoAjax.generateRequest()); |
| 339 } |
| 340 var allPromises = requests.map(function(r){return r.completes}); |
| 341 promiseAllComplete = Promise.all(allPromises); |
| 342 }); |
| 343 |
| 344 test('holds all requests in the `activeRequests` Array', function() { |
| 345 expect(requests).to.deep.eql(echoAjax.activeRequests); |
| 346 }); |
| 347 |
| 348 test('empties `activeRequests` when requests are completed', function()
{ |
| 349 expect(echoAjax.activeRequests.length).to.be.equal(3); |
| 350 for (var i = 0; i < 3; i++) { |
| 351 respondToEchoRequest(server.requests[i]); |
| 352 } |
| 353 return promiseAllComplete.then(function() { |
| 354 return timePasses(1); |
| 355 }).then(function() { |
| 356 expect(echoAjax.activeRequests.length).to.be.equal(0); |
| 357 }); |
| 358 }); |
| 359 |
| 360 test('avoids race conditions with last response', function() { |
| 361 expect(echoAjax.lastResponse).to.be.equal(undefined); |
| 362 |
| 363 // Resolving the oldest request doesn't update lastResponse. |
| 364 respondToEchoRequest(server.requests[0]); |
| 365 return requests[0].completes.then(function() { |
| 366 expect(echoAjax.lastResponse).to.be.equal(undefined); |
| 367 |
| 368 // Resolving the most recent request does! |
| 369 respondToEchoRequest(server.requests[2]); |
| 370 return requests[2].completes; |
| 371 }).then(function() { |
| 372 expect(echoAjax.lastResponse).to.be.deep.eql( |
| 373 {url: '/echoes_request_url?order=3'}); |
| 374 |
| 375 |
| 376 // Resolving an out of order stale request after does nothing! |
| 377 respondToEchoRequest(server.requests[1]); |
| 378 return requests[1].completes; |
| 379 }).then(function() { |
| 380 expect(echoAjax.lastResponse).to.be.deep.eql( |
| 381 {url: '/echoes_request_url?order=3'}); |
| 382 }); |
| 383 }); |
| 384 |
| 385 test('`loading` is true while the last one is loading', function() { |
| 386 expect(echoAjax.loading).to.be.equal(true); |
| 387 |
| 388 respondToEchoRequest(server.requests[0]); |
| 389 return requests[0].completes.then(function() { |
| 390 // We're still loading because requests[2] is the most recently |
| 391 // made request. |
| 392 expect(echoAjax.loading).to.be.equal(true); |
| 393 |
| 394 respondToEchoRequest(server.requests[2]); |
| 395 return requests[2].completes; |
| 396 }).then(function() { |
| 397 // Now we're done loading. |
| 398 expect(echoAjax.loading).to.be.eql(false); |
| 399 |
| 400 // Resolving an out of order stale request after should have |
| 401 // no effect. |
| 402 respondToEchoRequest(server.requests[1]); |
| 403 return requests[1].completes; |
| 404 }).then(function() { |
| 405 expect(echoAjax.loading).to.be.eql(false); |
| 406 }); |
| 407 }); |
| 408 }); |
| 409 |
| 410 suite('when params are changed', function() { |
| 411 test('generates a request that reflects the change', function() { |
| 412 ajax = fixture('ParamsGet'); |
| 413 request = ajax.generateRequest(); |
| 414 |
| 415 expect(request.xhr.url).to.be.equal('/responds_to_get_with_json?a=a'); |
| 416 |
| 417 ajax.params = {b: 'b'}; |
| 418 request = ajax.generateRequest(); |
| 419 |
| 420 expect(request.xhr.url).to.be.equal('/responds_to_get_with_json?b=b'); |
| 421 }); |
| 422 }); |
| 423 |
| 424 suite('when `auto` is enabled', function() { |
| 425 setup(function() { |
| 426 ajax = fixture('AutoGet'); |
| 427 }); |
| 428 |
| 429 test('automatically generates new requests', function() { |
| 430 return new Promise(function(resolve) { |
| 431 ajax.addEventListener('request', function() { |
| 432 resolve(); |
| 433 }); |
| 434 }); |
| 435 }); |
| 436 |
| 437 test('does not send requests if url is not a string', function() { |
| 438 return new Promise(function(resolve, reject) { |
| 439 ajax.addEventListener('request', function() { |
| 440 reject('A request was generated but url is null!'); |
| 441 }); |
| 442 |
| 443 ajax.url = null; |
| 444 ajax.handleAs = 'text'; |
| 445 |
| 446 Polymer.Base.async(function() { |
| 447 resolve(); |
| 448 }, 1); |
| 449 }); |
| 450 }); |
| 451 |
| 452 test('deduplicates multiple changes to a single request', function() { |
| 453 return new Promise(function(resolve, reject) { |
| 454 ajax.addEventListener('request', function() { |
| 455 server.respond(); |
| 456 }); |
| 457 |
| 458 ajax.addEventListener('response', function() { |
| 459 try { |
| 460 expect(ajax.activeRequests.length).to.be.eql(1); |
| 461 resolve() |
| 462 } catch (e) { |
| 463 reject(e); |
| 464 } |
| 465 }); |
| 466 |
| 467 ajax.handleas = 'text'; |
| 468 ajax.params = { foo: 'bar' }; |
| 469 ajax.headers = { 'X-Foo': 'Bar' }; |
| 470 }); |
| 471 }); |
| 472 |
| 473 test('automatically generates new request when a sub-property of params
is changed', function(done) { |
| 474 ajax.addEventListener('request', function() { |
| 475 server.respond(); |
| 476 }); |
| 477 |
| 478 ajax.params = { foo: 'bar' }; |
| 479 ajax.addEventListener('response', function() { |
| 480 ajax.addEventListener('request', function() { |
| 481 done(); |
| 482 }); |
| 483 |
| 484 ajax.set('params.foo', 'xyz'); |
| 485 }); |
| 486 }); |
| 487 }); |
| 488 |
| 489 suite('the last response', function() { |
| 490 setup(function() { |
| 491 request = ajax.generateRequest(); |
| 492 server.respond(); |
| 493 }); |
| 494 |
| 495 test('is accessible as a readonly property', function() { |
| 496 return request.completes.then(function (request) { |
| 497 expect(ajax.lastResponse).to.be.equal(request.response); |
| 498 }); |
| 499 }); |
| 500 |
| 501 |
| 502 test('updates with each new response', function() { |
| 503 return request.completes.then(function(request) { |
| 504 |
| 505 expect(request.response).to.be.an('object'); |
| 506 expect(ajax.lastResponse).to.be.equal(request.response); |
| 507 |
| 508 ajax.handleAs = 'text'; |
| 509 request = ajax.generateRequest(); |
| 510 server.respond(); |
| 511 |
| 512 return request.completes; |
| 513 }).then(function(request) { |
| 514 expect(request.response).to.be.a('string'); |
| 515 expect(ajax.lastResponse).to.be.equal(request.response); |
| 516 }); |
| 517 }); |
| 518 }); |
| 519 |
| 520 suite('when making POST requests', function() { |
| 521 setup(function() { |
| 522 ajax = fixture('TrivialPost'); |
| 523 }); |
| 524 |
| 525 test('POSTs the value of the `body` attribute', function() { |
| 526 var requestBody = JSON.stringify({foo: 'bar'}); |
| 527 |
| 528 ajax.body = requestBody; |
| 529 ajax.generateRequest(); |
| 530 |
| 531 expect(server.requests[0]).to.be.ok; |
| 532 expect(server.requests[0].requestBody).to.be.equal(requestBody); |
| 533 }); |
| 534 |
| 535 test('if `contentType` is set to form encode, the body is encoded',funct
ion() { |
| 536 ajax.body = {foo: 'bar\nbip', 'biz bo': 'baz blar'}; |
| 537 ajax.contentType = 'application/x-www-form-urlencoded'; |
| 538 ajax.generateRequest(); |
| 539 |
| 540 expect(server.requests[0]).to.be.ok; |
| 541 expect(server.requests[0].requestBody).to.be.equal( |
| 542 'foo=bar%0D%0Abip&biz+bo=baz+blar'); |
| 543 }); |
| 544 |
| 545 test('if `contentType` is json, the body is json encoded', function() { |
| 546 var requestObj = {foo: 'bar', baz: [1,2,3]} |
| 547 ajax.body = requestObj; |
| 548 ajax.contentType = 'application/json'; |
| 549 ajax.generateRequest(); |
| 550 |
| 551 expect(server.requests[0]).to.be.ok; |
| 552 expect(server.requests[0].requestBody).to.be.equal( |
| 553 JSON.stringify(requestObj)); |
| 554 }); |
| 555 |
| 556 suite('the examples in the documentation work', function() { |
| 557 test('json content, body attribute is an object', function() { |
| 558 ajax.setAttribute('body', '{"foo": "bar baz", "x": 1}'); |
| 559 ajax.contentType = 'application/json'; |
| 560 ajax.generateRequest(); |
| 561 |
| 562 expect(server.requests[0]).to.be.ok; |
| 563 expect(server.requests[0].requestBody).to.be.equal( |
| 564 '{"foo":"bar baz","x":1}'); |
| 565 }); |
| 566 |
| 567 test('form content, body attribute is an object', function() { |
| 568 ajax.setAttribute('body', '{"foo": "bar baz", "x": 1}'); |
| 569 ajax.contentType = 'application/x-www-form-urlencoded'; |
| 570 ajax.generateRequest(); |
| 571 |
| 572 expect(server.requests[0]).to.be.ok; |
| 573 expect(server.requests[0].requestBody).to.be.equal( |
| 574 'foo=bar+baz&x=1'); |
| 575 }); |
| 576 }); |
| 577 |
| 578 suite('and `contentType` is explicitly set to form encode', function() { |
| 579 test('we encode a custom object', function() { |
| 580 function Foo(bar) { this.bar = bar }; |
| 581 var requestObj = new Foo('baz'); |
| 582 ajax.body = requestObj; |
| 583 ajax.contentType = 'application/x-www-form-urlencoded'; |
| 584 ajax.generateRequest(); |
| 585 |
| 586 expect(server.requests[0]).to.be.ok; |
| 587 expect(server.requests[0].requestBody).to.be.equal('bar=baz'); |
| 588 }); |
| 589 }) |
| 590 |
| 591 suite('and `contentType` isn\'t set', function() { |
| 592 test('we don\'t try to encode an ArrayBuffer', function() { |
| 593 var requestObj = new ArrayBuffer() |
| 594 ajax.body = requestObj; |
| 595 ajax.generateRequest(); |
| 596 |
| 597 expect(server.requests[0]).to.be.ok; |
| 598 // We give the browser the ArrayBuffer directly, without trying |
| 599 // to encode it. |
| 600 expect(server.requests[0].requestBody).to.be.equal(requestObj); |
| 601 }); |
| 602 }) |
| 603 }); |
| 604 |
| 605 suite('when debouncing requests', function() { |
| 606 setup(function() { |
| 607 ajax = fixture('DebouncedGet'); |
| 608 }); |
| 609 |
| 610 test('only requests a single resource', function() { |
| 611 ajax._requestOptionsChanged(); |
| 612 expect(server.requests[0]).to.be.equal(undefined); |
| 613 ajax._requestOptionsChanged(); |
| 614 return timePasses(200).then(function() { |
| 615 expect(server.requests[0]).to.be.ok; |
| 616 }); |
| 617 }); |
| 618 }); |
| 619 |
| 620 suite('when a response handler is bound', function() { |
| 621 var responseHandler; |
| 622 |
| 623 setup(function() { |
| 624 responseHandler = sinon.spy(); |
| 625 ajax.addEventListener('response', responseHandler); |
| 626 }); |
| 627 |
| 628 test('calls the handler after every response', function() { |
| 629 ajax.generateRequest(); |
| 630 ajax.generateRequest(); |
| 631 |
| 632 server.respond(); |
| 633 |
| 634 return ajax.lastRequest.completes.then(function() { |
| 635 expect(responseHandler.callCount).to.be.equal(2); |
| 636 }); |
| 637 }); |
| 638 }); |
| 639 |
| 640 suite('when the response type is `json`', function() { |
| 641 setup(function() { |
| 642 server.restore(); |
| 643 }); |
| 644 |
| 645 test('finds the JSON on any platform', function() { |
| 646 ajax.url = '../bower.json'; |
| 647 request = ajax.generateRequest(); |
| 648 return request.completes.then(function() { |
| 649 expect(ajax.lastResponse).to.be.instanceOf(Object); |
| 650 }); |
| 651 }); |
| 652 }); |
| 653 |
| 654 suite('when handleAs parameter is `text`', function() { |
| 655 |
| 656 test('response type is string', function () { |
| 657 ajax.url = '/responds_to_get_with_json'; |
| 658 ajax.handleAs = 'text'; |
| 659 |
| 660 request = ajax.generateRequest(); |
| 661 var promise = request.completes.then(function () { |
| 662 expect(typeof(ajax.lastResponse)).to.be.equal('string'); |
| 663 }); |
| 664 |
| 665 expect(server.requests.length).to.be.equal(1); |
| 666 expect(server.requests[0].requestHeaders['accept']).to.be.equal( |
| 667 'text/plain'); |
| 668 server.respond(); |
| 669 |
| 670 return promise; |
| 671 }); |
| 672 |
| 673 }); |
| 674 |
| 675 suite('when a request fails', function() { |
| 676 test('we give an error with useful details', function() { |
| 677 ajax.url = '/responds_to_get_with_502_error_json'; |
| 678 ajax.handleAs = 'json'; |
| 679 var eventFired = false; |
| 680 ajax.addEventListener('error', function(event) { |
| 681 expect(event.detail.request).to.be.ok; |
| 682 expect(event.detail.error).to.be.ok; |
| 683 eventFired = true; |
| 684 }); |
| 685 var request = ajax.generateRequest(); |
| 686 var promise = request.completes.then(function() { |
| 687 throw new Error('Expected the request to fail!'); |
| 688 }, function(error) { |
| 689 expect(error).to.be.instanceof(Error); |
| 690 expect(request.succeeded).to.be.eq(false); |
| 691 return timePasses(100); |
| 692 }).then(function() { |
| 693 expect(eventFired).to.be.eq(true); |
| 694 expect(ajax.lastError).to.not.be.eq(null); |
| 695 expect(ajax.lastError.status).to.be.eq(502); |
| 696 expect(ajax.lastError.statusText).to.be.eq("Bad Gateway"); |
| 697 expect(ajax.lastError.response).to.be.ok; |
| 698 }); |
| 699 |
| 700 server.respond(); |
| 701 |
| 702 return promise; |
| 703 }); |
| 704 |
| 705 test('we give a useful error even when the domain doesn\'t resolve', fun
ction() { |
| 706 ajax.url = 'http://nonexistant.example.com/'; |
| 707 server.restore(); |
| 708 var eventFired = false; |
| 709 ajax.addEventListener('error', function(event) { |
| 710 expect(event.detail.request).to.be.ok; |
| 711 expect(event.detail.error).to.be.ok; |
| 712 eventFired = true; |
| 713 }); |
| 714 var request = ajax.generateRequest(); |
| 715 var promise = request.completes.then(function() { |
| 716 throw new Error('Expected the request to fail!'); |
| 717 }, function(error) { |
| 718 expect(request.succeeded).to.be.eq(false); |
| 719 expect(error).to.not.be.eq(null); |
| 720 return timePasses(100); |
| 721 }).then(function() { |
| 722 expect(eventFired).to.be.eq(true); |
| 723 expect(ajax.lastError).to.not.be.eq(null); |
| 724 }); |
| 725 |
| 726 server.respond(); |
| 727 |
| 728 return promise; |
| 729 }); |
| 730 }); |
| 731 |
| 732 suite('when handleAs parameter is `json`', function() { |
| 733 |
| 734 test('response type is string', function () { |
| 735 ajax.url = '/responds_to_get_with_json'; |
| 736 ajax.handleAs = 'json'; |
| 737 |
| 738 request = ajax.generateRequest(); |
| 739 var promise = request.completes.then(function () { |
| 740 expect(typeof(ajax.lastResponse)).to.be.equal('object'); |
| 741 }); |
| 742 |
| 743 expect(server.requests.length).to.be.equal(1); |
| 744 expect(server.requests[0].requestHeaders['accept']).to.be.equal( |
| 745 'application/json'); |
| 746 |
| 747 server.respond(); |
| 748 |
| 749 return promise; |
| 750 }); |
| 751 |
| 752 }); |
| 753 |
| 754 suite('when making a POST over the wire', function() { |
| 755 test('FormData is handled correctly', function() { |
| 756 server.restore(); |
| 757 var requestBody = new FormData(); |
| 758 requestBody.append('a', 'foo'); |
| 759 requestBody.append('b', 'bar'); |
| 760 |
| 761 var ajax = fixture('RealPost'); |
| 762 ajax.body = requestBody; |
| 763 return ajax.generateRequest().completes.then(function() { |
| 764 expect(ajax.lastResponse.headers['Content-Type']).to.match( |
| 765 /^multipart\/form-data; boundary=.*$/); |
| 766 |
| 767 expect(ajax.lastResponse.form.a).to.be.equal('foo'); |
| 768 expect(ajax.lastResponse.form.b).to.be.equal('bar'); |
| 769 }); |
| 770 }); |
| 771 |
| 772 test('json is handled correctly', function() { |
| 773 server.restore(); |
| 774 var ajax = fixture('RealPost'); |
| 775 ajax.body = JSON.stringify({a: 'foo', b: 'bar'}); |
| 776 ajax.contentType = 'application/json'; |
| 777 return ajax.generateRequest().completes.then(function() { |
| 778 expect(ajax.lastResponse.headers['Content-Type']).to.match( |
| 779 /^application\/json(;.*)?$/); |
| 780 expect(ajax.lastResponse.json.a).to.be.equal('foo'); |
| 781 expect(ajax.lastResponse.json.b).to.be.equal('bar'); |
| 782 }); |
| 783 }); |
| 784 |
| 785 test('urlencoded data is handled correctly', function() { |
| 786 server.restore(); |
| 787 var ajax = fixture('RealPost'); |
| 788 ajax.body = 'a=foo&b=bar'; |
| 789 return ajax.generateRequest().completes.then(function() { |
| 790 expect(ajax.lastResponse.headers['Content-Type']).to.match( |
| 791 /^application\/x-www-form-urlencoded(;.*)?$/); |
| 792 |
| 793 expect(ajax.lastResponse.form.a).to.be.equal('foo'); |
| 794 expect(ajax.lastResponse.form.b).to.be.equal('bar'); |
| 795 }); |
| 796 }); |
| 797 |
| 798 test('xml is handled correctly', function() { |
| 799 server.restore(); |
| 800 var ajax = fixture('RealPost'); |
| 801 |
| 802 var xmlDoc = document.implementation.createDocument( |
| 803 null, "foo", null); |
| 804 var node = xmlDoc.createElement("bar"); |
| 805 node.setAttribute("name" , "baz"); |
| 806 xmlDoc.documentElement.appendChild(node); |
| 807 ajax.body = xmlDoc; |
| 808 return ajax.generateRequest().completes.then(function() { |
| 809 expect(ajax.lastResponse.headers['Content-Type']).to.match( |
| 810 /^application\/xml(;.*)?$/); |
| 811 expect(ajax.lastResponse.data).to.match( |
| 812 /<foo\s*><bar\s+name="baz"\s*\/><\/foo\s*>/); |
| 813 }); |
| 814 }); |
| 815 }); |
| 816 |
| 817 suite('when setting timeout', function() { |
| 818 setup(function() { |
| 819 server.restore(); |
| 820 }); |
| 821 |
| 822 test('it is present in the request xhr object', function () { |
| 823 ajax.url = '/responds_to_get_with_json'; |
| 824 ajax.timeout = 5000; // 5 Seconds |
| 825 |
| 826 request = ajax.generateRequest(); |
| 827 expect(request.xhr.timeout).to.be.equal(5000); // 5 Seconds |
| 828 }); |
| 829 |
| 830 test('it fails once that timeout is reached', function () { |
| 831 var ajax = fixture('Delay'); |
| 832 ajax.timeout = 1; // 1 Millisecond |
| 833 |
| 834 request = ajax.generateRequest(); |
| 835 return request.completes.then(function () { |
| 836 throw new Error('Expected the request to throw an error.'); |
| 837 }, function() { |
| 838 expect(request.succeeded).to.be.equal(false); |
| 839 expect(request.xhr.status).to.be.equal(0); |
| 840 expect(request.timedOut).to.be.equal(true); |
| 841 return timePasses(1); |
| 842 }).then(function() { |
| 843 expect(ajax.loading).to.be.equal(false); |
| 844 expect(ajax.lastResponse).to.be.equal(null); |
| 845 expect(ajax.lastError).to.not.be.equal(null); |
| 846 }); |
| 847 }); |
| 848 }); |
| 849 |
| 850 suite('when using the bubbles attribute', function () { |
| 851 setup(function() { |
| 852 server.restore(); |
| 853 }); |
| 854 test('the request and response events should bubble to window', function
(done) { |
| 855 server.restore(); |
| 856 var total = 0; |
| 857 function incrementTotal(){ |
| 858 total++; |
| 859 if (total === 4){ |
| 860 done(); |
| 861 } |
| 862 } |
| 863 window.addEventListener('request', incrementTotal); |
| 864 window.addEventListener('iron-ajax-request', incrementTotal); |
| 865 window.addEventListener('response', incrementTotal); |
| 866 window.addEventListener('iron-ajax-response', incrementTotal); |
| 867 var ajax = fixture('Bubbles')[0]; |
| 868 ajax.generateRequest(); |
| 869 server.respond(); |
| 870 }); |
| 871 |
| 872 test('the request and error events should bubble to window', function (d
one) { |
| 873 server.restore(); |
| 874 var total = 0; |
| 875 function incrementTotal(){ |
| 876 total++; |
| 877 if (total === 4){ |
| 878 done(); |
| 879 } |
| 880 } |
| 881 window.addEventListener('request', incrementTotal); |
| 882 window.addEventListener('iron-ajax-request', incrementTotal); |
| 883 window.addEventListener('error', incrementTotal); |
| 884 window.addEventListener('iron-ajax-error', incrementTotal); |
| 885 var ajax = fixture('Bubbles')[1]; |
| 886 ajax.generateRequest(); |
| 887 server.respond(); |
| 888 }); |
| 889 }); |
| 890 |
| 891 }); |
| 892 </script> |
| 893 |
| 894 </body> |
| 895 </html> |
OLD | NEW |