Reject request on XHR timeout (#2646)

Co-authored-by: Zachary Hamm <hamm.zachary@gmail.com>

request/request.js

@@ -79,7 +79,7 @@ module.exports = function($window, Promise, oncompletion) {
 			var assumeJSON = (args.serialize == null || args.serialize === JSON.serialize) && !(body instanceof $window.FormData)
 			var responseType = args.responseType || (typeof args.extract === "function" ? "" : "json")
 
-			var xhr = new $window.XMLHttpRequest(), aborted = false
+			var xhr = new $window.XMLHttpRequest(), aborted = false, isTimeout = false
 			var original = xhr, replacedAbort
 			var abort = xhr.abort
 
@@ -141,12 +141,25 @@ module.exports = function($window, Promise, oncompletion) {
 						}
 						if (success) resolve(response)
 						else {
-							try { message = ev.target.responseText }
-							catch (e) { message = response }
-							var error = new Error(message)
-							error.code = ev.target.status
-							error.response = response
-							reject(error)
+							var completeErrorResponse = function() {
+								try { message = ev.target.responseText }
+								catch (e) { message = response }
+								var error = new Error(message)
+								error.code = ev.target.status
+								error.response = response
+								reject(error)
+							}
+
+							if (xhr.status === 0) {
+								// Use setTimeout to push this code block onto the event queue
+								// This allows `xhr.ontimeout` to run in the case that there is a timeout
+								// Without this setTimeout, `xhr.ontimeout` doesn't have a chance to reject
+								// as `xhr.onreadystatechange` will run before it
+								setTimeout(function() {
+									if (isTimeout) return
+									completeErrorResponse()
+								})
+							} else completeErrorResponse()
 						}
 					}
 					catch (e) {
@@ -155,6 +168,13 @@ module.exports = function($window, Promise, oncompletion) {
 				}
 			}
 
+			xhr.ontimeout = function (ev) {
+				isTimeout = true
+				var error = new Error("Request timed out")
+				error.code = ev.target.status
+				reject(error)
+			}
+
 			if (typeof args.config === "function") {
 				xhr = args.config(xhr, args, url) || xhr
 

request/tests/test-request.js

@@ -677,6 +677,57 @@ o.spec("request", function() {
 				o(e instanceof Error).equals(true)
 			}).then(done)
 		})
+		o("rejects on request timeout", function(done) {
+			var timeout = 50
+			var timeToGetItem = timeout + 1
+
+			mock.$defineRoutes({
+				"GET /item": function() {
+					return new Promise(function(resolve) {
+						setTimeout(function() {
+							resolve({status: 200})
+						}, timeToGetItem)
+					})
+				}
+			})
+
+			request({
+				method: "GET", url: "/item",
+				timeout: timeout
+			}).catch(function(e) {
+				o(e instanceof Error).equals(true)
+				o(e.message).equals("Request timed out")
+				o(e.code).equals(0)
+			}).then(function() {
+				done()
+			})
+		})
+		o("does not reject when time to request resource does not exceed timeout", function(done) {
+			var timeout = 50
+			var timeToGetItem = timeout - 1
+			var isRequestRejected = false
+
+			mock.$defineRoutes({
+				"GET /item": function() {
+					return new Promise(function(resolve) {
+						setTimeout(function() {
+							resolve({status: 200})
+						}, timeToGetItem)
+					})
+				}
+			})
+
+			request({
+				method: "GET", url: "/item",
+				timeout: timeout
+			}).catch(function(e) {
+				isRequestRejected = true
+				o(e.message).notEquals("Request timed out")
+			}).then(function() {
+				o(isRequestRejected).equals(false)
+				done()
+			})
+		})
 		o("does not reject on status error code when extract provided", function(done) {
 			mock.$defineRoutes({
 				"GET /item": function() {