added jquery example, fix issue with jquery, added .mock override wit…

…h shortcut
jameslnewell · Dec 28, 2014 · 1720d69 · 1720d69
1 parent 7677965
commit 1720d69
Show file tree

Hide file tree

Showing 6 changed files with 148 additions and 32 deletions.
diff --git a/component.json b/component.json
@@ -1,4 +1,9 @@
 {
   "name": "xhr-mock",
-  "scripts": ["index.js", "lib/MockXMLHttpRequest.js"]
+  "scripts": ["index.js", "lib/MockXMLHttpRequest.js"],
+	"development": {
+		"dependencies": {
+			"component/assert": "*"
+		}
+	}
 }
diff --git a/example/jquery.html b/example/jquery.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <title>jQuery Example &mdash; xhr-mock</title>
+</head>
+<body>
+
+    <h1>xhr-mock</h1>
+    <h2>jQuery Example</h2>
+
+    <script src="https://code.jquery.com/jquery-2.1.3.js"></script>
+    <script src="../build/build.js"></script>
+    <script>
+
+        var mock = require('xhr-mock');
+        mock.setup();
+
+        mock.get('http://google.com/', function(request) {
+            request.status          = 200;
+            request.responseText    = '<h1>Google</h1>';
+        });
+
+        // ---------
+
+        $.get('http://google.com/', function(data, textStatus, jqXHR) {
+            console.log(arguments);
+        }).fail(function() {
+            console.log('ERROR');
+        });
+
+        // ---------
+
+    </script>
+</body>
+</html>
diff --git a/example.html → example/native.html b/example.html → example/native.html
@@ -2,11 +2,14 @@
 <html>
 <head lang="en">
     <meta charset="UTF-8">
-    <title></title>
+    <title>Native Example &mdash; xhr-mock</title>
 </head>
 <body>
 
-    <script src="build/build.js"></script>
+    <h1>xhr-mock</h1>
+    <h2>Native Example</h2>
+
+    <script src="../build/build.js"></script>
     <script>
 
         var mock = require('xhr-mock');

diff --git a/index.js b/index.js
@@ -3,14 +3,20 @@ var MockXMLHttpRequest  = require('./lib/MockXMLHttpRequest');
 var real                = window.XMLHttpRequest;
 var mock                = MockXMLHttpRequest;
 
+/**
+ * Mock utility
+ */
 module.exports = {
 
+	XMLHttpRequest: MockXMLHttpRequest,
+
   /**
    * Replace the native XHR with the mocked XHR
    * @returns {exports}
    */
   setup: function() {
     window.XMLHttpRequest = mock;
+	  MockXMLHttpRequest.handlers = [];
     return this;
   },
 
@@ -19,8 +25,8 @@ module.exports = {
    * @returns {exports}
    */
   teardown: function() {
+	  MockXMLHttpRequest.handlers = [];
     window.XMLHttpRequest = real;
-    MockXMLHttpRequest.handlers = [];
     return this;
   },
 
@@ -29,27 +35,51 @@ module.exports = {
    * @param   {Function} fn
    * @returns {exports}
    */
-  mock: function(fn) {
-    MockXMLHttpRequest.addHandler(fn);
+  mock: function(method, url, fn) {
+	  var handler = fn;
+
+	  if (arguments.length === 3) {
+		  handler = function(request) {
+			  if (request.method == method && request.url == url) {
+				  fn(request);
+				  return true;
+			  }
+		  };
+	  }
+
+    MockXMLHttpRequest.addHandler(handler);
+
     return this;
   },
 
   /**
-   * Mock a request
+   * Mock a GET request
    * @param   {String}    url
    * @param   {Function}  fn
    * @returns {exports}
    */
   get: function(url, fn) {
-    var method = 'GET';
-    MockXMLHttpRequest.addHandler(function(request) {
-      if (request.method == method && request.url == url) {
-        fn(request);
-        return true;
-      }
-    });
-    return this;
-  }
+    return this.mock('GET', url, fn);
+  },
+
+	/**
+	 * Mock a POST request
+	 * @param   {String}    url
+	 * @param   {Function}  fn
+	 * @returns {exports}
+	 */
+	post: function(url, fn) {
+		return this.mock('POST', url, fn);
+	},
 
+	/**
+	 * Mock a PUT request
+	 * @param   {String}    url
+	 * @param   {Function}  fn
+	 * @returns {exports}
+	 */
+	put: function(url, fn) {
+		return this.mock('PUT', url, fn);
+	}
 
 };
diff --git a/lib/MockXMLHttpRequest.js b/lib/MockXMLHttpRequest.js
@@ -3,11 +3,11 @@
 //https://xhr.spec.whatwg.org/
 //http://www.w3.org/TR/2006/WD-XMLHttpRequest-20060405/
 
-MockXMLHttpRequest.STATE_UNINITIALIZED  = 0;
-MockXMLHttpRequest.STATE_OPEN           = 1;
-MockXMLHttpRequest.STATE_SENT           = 2;
-MockXMLHttpRequest.STATE_RECEIVING      = 3;
-MockXMLHttpRequest.STATE_LOADED         = 4;
+MockXMLHttpRequest.STATE_UNSENT  = 0;
+MockXMLHttpRequest.STATE_OPENED           = 1;
+MockXMLHttpRequest.STATE_HEADERS_RECEIVED           = 2;
+MockXMLHttpRequest.STATE_LOADING      = 3;
+MockXMLHttpRequest.STATE_DONE         = 4;
 
 /**
  * The request handlers
@@ -74,13 +74,13 @@ function MockXMLHttpRequest() {
 MockXMLHttpRequest.prototype.reset = function() {
 
   this.response     = null;
-  this.responseType = ''
+  this.responseType = '';
   this.responseText = '';
 
   this.status       = '';
   this.statusText   = '';
 
-  this.readyState   = MockXMLHttpRequest.STATE_UNINITIALIZED;
+  this.readyState   = MockXMLHttpRequest.STATE_UNSENT;
 };
 
 /**
@@ -94,19 +94,23 @@ MockXMLHttpRequest.prototype.trigger = function(event) {
     this['on'+event]();
   }
 
+	if (this['onreadystatechange']) {
+		this['onreadystatechange']();
+	}
+
   //iterate over the listeners
 
   return this;
 };
 
 MockXMLHttpRequest.prototype.open = function(method, url, async, user, password) {
   this.reset();
-  this.method   = method,
-  this.url      = url,
-  this.async    = async,
-  this.user     = user,
-  this.password = password,
-  this.data     = null
+  this.method   = method;
+  this.url      = url;
+  this.async    = async;
+  this.user     = user;
+  this.password = password;
+  this.data     = null;
 };
 
 MockXMLHttpRequest.prototype.setRequestHeader = function(header, value) {
@@ -126,13 +130,13 @@ MockXMLHttpRequest.prototype.send = function(data) {
     if (handled) {
 
       //trigger a success event because the request was handled
-      self.readyState = MockXMLHttpRequest.STATE_LOADED;
+      self.readyState = MockXMLHttpRequest.STATE_DONE;
       self.trigger('load');
 
     } else {
 
       //trigger an error because the request was handled
-      self.readyState = MockXMLHttpRequest.STATE_LOADED;
+      self.readyState = MockXMLHttpRequest.STATE_DONE;
       self.trigger('error');
 
     }
@@ -144,7 +148,10 @@ MockXMLHttpRequest.prototype.send = function(data) {
 MockXMLHttpRequest.prototype.abort = function() {
 };
 
-MockXMLHttpRequest.prototype.geAllResponseHeaders = function(header) {
+MockXMLHttpRequest.prototype.getAllResponseHeaders = function(header) {
+	if (this.readyState === MockXMLHttpRequest.STATE_UNSENT) {
+		return '';
+	}
 };
 
 MockXMLHttpRequest.prototype.geResponseHeader = function(header) {

diff --git a/test/MockXMLHttpRequest.js b/test/MockXMLHttpRequest.js
@@ -0,0 +1,35 @@
+var assert  = require('assert');
+var mock    = require('xhr-mock');
+
+describe('xhr-mock', function() {
+
+	describe('.setup() and teardown()', function() {
+
+		it('should setup and teardown the mock XMLHttpRequest class', function() {
+
+			var xhr = window.XMLHttpRequest;
+			mock.setup();
+			assert.notEqual(window.XMLHttpRequest, xhr);
+			mock.teardown();
+			assert.equal(window.XMLHttpRequest, xhr);
+
+		});
+
+		it('should remove any handlers', function() {
+
+			mock.get('http://www.google.com/', function() {});
+			mock.setup();
+			assert.equal(mock.XMLHttpRequest.handlers.length, 0);
+			mock.get('http://www.google.com/', function() {});
+			mock.teardown();
+			assert.equal(mock.XMLHttpRequest.handlers.length, 0);
+
+
+		});
+
+	});
+
+
+
+
+});