Merge pull request #55 from github/test-redirect

Test Atomic HTTP redirect handling

Author: josh

README.md

@@ -162,6 +162,23 @@ fetch('/users')
   })
 ```
 
+### Response URL caveat
+
+The `Response` object has a URL attribute for the final responded resource.
+Usually this is the same as the `Request` url, but in the case of a redirect,
+its all transparent. Newer versions of XHR include a `responseURL` attribute
+that returns this value. But not every browser supports this. The compromise
+requires setting a special server side header to tell the browser what URL it
+just requested (yeah, I know browsers).
+
+``` ruby
+response.headers['X-Request-URL'] = request.url
+```
+
+If you want `response.url` to be reliable, you'll want to set this header. The
+day that you ditch this polyfill and use native fetch only, you can remove the
+header hack.
+
 ## Browser Support
 
 ![Chrome](https://raw.github.com/alrra/browser-logos/master/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/firefox/firefox_48x48.png) | ![IE](https://raw.github.com/alrra/browser-logos/master/internet-explorer/internet-explorer_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/opera/opera_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/safari/safari_48x48.png)

fetch.js

@@ -180,7 +180,8 @@
         var options = {
           status: status,
           statusText: xhr.statusText,
-          headers: headers(xhr)
+          headers: headers(xhr),
+          url: xhr.responseURL || xhr.getResponseHeader('X-Request-URL')
         }
         resolve(new Response(xhr.responseText, options))
       }
@@ -210,6 +211,7 @@
     this.status = options.status
     this.statusText = options.statusText
     this.headers = options.headers
+    this.url = options.url || ''
   }
 
   Body.call(Response.prototype)

test/server.js

@@ -20,10 +20,33 @@ var routes = {
       }));
     })
   },
-  '/hello': function(res) {
-    res.writeHead(200, {'Content-Type': 'text/plain'});
+  '/hello': function(res, req) {
+    res.writeHead(200, {
+      'Content-Type': 'text/plain',
+      'X-Request-URL': 'http://' + req.headers.host + req.url
+    });
     res.end('hi');
   },
+  '/redirect/301': function(res) {
+    res.writeHead(301, {'Location': '/hello'});
+    res.end();
+  },
+  '/redirect/302': function(res) {
+    res.writeHead(302, {'Location': '/hello'});
+    res.end();
+  },
+  '/redirect/303': function(res) {
+    res.writeHead(303, {'Location': '/hello'});
+    res.end();
+  },
+  '/redirect/307': function(res) {
+    res.writeHead(307, {'Location': '/hello'});
+    res.end();
+  },
+  '/redirect/308': function(res) {
+    res.writeHead(308, {'Location': '/hello'});
+    res.end();
+  },
   '/boom': function(res) {
     res.writeHead(500, {'Content-Type': 'text/plain'});
     res.end('boom');

test/test.js

@@ -196,3 +196,56 @@ promiseTest('supports HTTP DELETE', 2, function() {
     equal(request.data, '')
   })
 })
+
+promiseTest('handles 301 redirect response', 3, function() {
+  return fetch('/redirect/301').then(function(response) {
+    equal(response.status, 200)
+    equal(response.url ? new URL(response.url).pathname : null, '/hello')
+    return response.text()
+  }).then(function(body) {
+    equal(body, 'hi')
+  })
+})
+
+promiseTest('handles 302 redirect response', 3, function() {
+  return fetch('/redirect/302').then(function(response) {
+    equal(response.status, 200)
+    equal(response.url ? new URL(response.url).pathname : null, '/hello')
+    return response.text()
+  }).then(function(body) {
+    equal(body, 'hi')
+  })
+})
+
+promiseTest('handles 303 redirect response', 3, function() {
+  return fetch('/redirect/303').then(function(response) {
+    equal(response.status, 200)
+    equal(response.url ? new URL(response.url).pathname : null, '/hello')
+    return response.text()
+  }).then(function(body) {
+    equal(body, 'hi')
+  })
+})
+
+promiseTest('handles 307 redirect response', 3, function() {
+  return fetch('/redirect/307').then(function(response) {
+    equal(response.status, 200)
+    equal(response.url ? new URL(response.url).pathname : null, '/hello')
+    return response.text()
+  }).then(function(body) {
+    equal(body, 'hi')
+  })
+})
+
+// PhantomJS doesn't support 308 redirects
+if (!navigator.userAgent.match(/PhantomJS/)) {
+  promiseTest('handles 308 redirect response', 3, function() {
+    return fetch('/redirect/308').then(function(response) {
+      equal(response.status, 200)
+    equal(response.url ? new URL(response.url).pathname : null, '/hello')
+      return response.text()
+    }).then(function(body) {
+      equal(body, 'hi')
+    })
+  })
+}