Revert "Change location to be a plain object for effortless record/replay"

This reverts commit aeeaf19.

Author: gaearon

modules/AbstractHistory.js

@@ -1,4 +1,5 @@
 var invariant = require('invariant');
+var Location = require('./Location');
 
 var _listenSingleton = null;
 
@@ -84,10 +85,7 @@ class AbstractHistory {
   }
 
   getLocation() {
-    return {
-      path: this.getPath(),
-      navigationType: this.navigationType
-    };
+    return new Location(this.getPath(), this.navigationType);
   }
 
   back() {

modules/Location.js

@@ -0,0 +1,54 @@
+var NavigationTypes = require('./NavigationTypes');
+var PathUtils = require('./PathUtils');
+
+/**
+ * A Location answers two important questions:
+ *
+ * 1. Where am I?
+ * 2. How did I get here?
+ */
+class Location {
+
+  /**
+   * Revives the location from its serialized form.
+   * Use `Location.revive` as a second argument to `JSON.parse`.
+   *
+   *   var serialized = JSON.stringify(location);
+   *   var deserialized = JSON.parse(serialized, Location.revive);
+   *
+   */
+  static revive(key, value) {
+    if (key === '') {
+      return new Location(value.path, value.navigationType);
+    } else {
+      return value;
+    }
+  }
+
+  constructor(path, navigationType) {
+    this.path = path;
+    this.navigationType = navigationType || NavigationTypes.POP;
+  }
+
+  getPathname() {
+    return PathUtils.getPathname(this.path);
+  }
+
+  getQueryString() {
+    return PathUtils.getQueryString(this.path);
+  }
+
+  getQuery(options) {
+    return PathUtils.getQuery(this.path, options);
+  }
+
+  toJSON() {
+    return {
+      path: this.path,
+      navigationType: this.navigationType
+    };
+  }
+
+}
+
+module.exports = Location;

modules/PropTypes.js

@@ -1,5 +1,6 @@
-var { func, object, string, arrayOf, instanceOf, oneOfType, shape } = require('react').PropTypes;
+var { func, object, arrayOf, instanceOf, oneOfType } = require('react').PropTypes;
 var AbstractHistory = require('./AbstractHistory');
+var Location = require('./Location');
 
 function falsy(props, propName, componentName) {
   if (props[propName])
@@ -9,17 +10,14 @@ function falsy(props, propName, componentName) {
 var component = func;
 var components = oneOfType([ component, arrayOf(component) ]);
 var history = instanceOf(AbstractHistory);
+var location = instanceOf(Location);
 var route = object;
-var location = shape({
-  path: string.isRequired,
-  navigationType: string
-});
 
 module.exports = {
   falsy,
   component,
   components,
   history,
-  route,
-  location
+  location,
+  route
 };

modules/StateMixin.js

@@ -1,4 +1,4 @@
-var PathUtils = require('./PathUtils');
+var { isAbsolutePath } = require('./PathUtils');
 
 function routeIsActive(activeRoutes, route) {
   if (typeof route === 'object')
@@ -39,15 +39,15 @@ var StateMixin = {
   },
 
   getPathname() {
-    return PathUtils.getPathname(this.getLocation());
+    return this.getLocation().getPathname();
   },
 
   getQueryString() {
-    return PathUtils.getQueryString(this.getLocation());
+    return this.getLocation().getQueryString();
   },
 
   getQuery() {
-    return PathUtils.getQuery(this.getLocation());
+    return this.getLocation().getQuery();
   },
 
   getBranch() {
@@ -66,7 +66,7 @@ var StateMixin = {
     if (!this.getLocation())
       return false;
 
-    if (PathUtils.isAbsolutePath(to))
+    if (isAbsolutePath(to))
       return to === this.getPath();
 
     return routeIsActive(this.getBranch(), to) &&

modules/__tests__/Location-test.js

@@ -0,0 +1,46 @@
+var expect = require('expect');
+var Location = require('../Location');
+var NavigationTypes = require('../NavigationTypes');
+
+describe('Location', function () {
+  var location;
+
+  it('can be revived', function () {
+    location = new Location('/the/path', NavigationTypes.POP);
+
+    var serialized = JSON.stringify(location);
+    var revived = JSON.parse(serialized, Location.revive);
+
+    expect(revived instanceof Location).toEqual(true);
+    expect(revived.path).toEqual(location.path);
+    expect(revived.navigationType).toEqual(location.navigationType);
+  });
+
+  describe('with a query string', function () {
+    beforeEach(function () {
+      location = new Location('/the/path?the=query');
+    });
+
+    it('knows its pathname', function() {
+      expect(location.getPathname()).toEqual('/the/path');
+    });
+
+    it('knows its query string', function() {
+      expect(location.getQueryString()).toEqual('the=query');
+    });
+  });
+
+  describe('without a query string', function () {
+    beforeEach(function () {
+      location = new Location('/the/path');
+    });
+
+    it('knows its pathname', function() {
+      expect(location.getPathname()).toEqual('/the/path');
+    });
+
+    it('has an empty query string', function() {
+      expect(location.getQueryString()).toEqual('');
+    });
+  });
+});

modules/__tests__/PathUtils-test.js

@@ -100,25 +100,11 @@ describe('PathUtils.injectParams', function () {
 });
 
 describe('PathUtils.getPathname', function () {
-  it('returns the path when there is no query', function () {
-    expect(PathUtils.getPathname('/a/b/c')).toEqual('/a/b/c');
-  });
-
   it('returns the pathname portion of a path', function () {
     expect(PathUtils.getPathname('/a/b/c?id=def')).toEqual('/a/b/c');
   });
 });
 
-describe('PathUtils.getQueryString', function () {
-  it('returns an empty string when there is no query', function () {
-    expect(PathUtils.getQueryString('/a/b/c')).toEqual('');
-  });
-
-  it('returns the querystring portion of a path', function () {
-    expect(PathUtils.getQueryString('/a/b/c?id=def')).toEqual('id=def');
-  });
-});
-
 describe('PathUtils.withQuery', function () {
   it('appends the query string', function () {
     expect(PathUtils.withQuery('/a/b/c', { id: 'def' })).toEqual('/a/b/c?id=def');

modules/createRouter.js

@@ -10,6 +10,7 @@ var NavigationMixin = require('./NavigationMixin');
 var TransitionMixin = require('./TransitionMixin');
 var StateMixin = require('./StateMixin');
 var findMatch = require('./findMatch');
+var Location = require('./Location');
 var AbstractHistory = require('./AbstractHistory');
 
 function createElement(component, props) {
@@ -53,7 +54,7 @@ function checkProps(props) {
  * determine what to render to the page.
  *
  * In a client-side environment you simply pass a History object to the Router
- * as a prop. A History acts like a store for location objects and emits new
+ * as a prop. A History acts like a store for Location objects and emits new
  * ones as the location changes over time (i.e. a user navigates around your
  * site). History objects are included for all the most common scenarios in
  * which the router may be used.
@@ -97,10 +98,10 @@ function createRouter(routes) {
      */
     static run(location, callback) {
       if (typeof location === 'string')
-        location = { path: location };
+        location = new Location(location);
 
       invariant(
-        typeof location.path === 'string',
+        location instanceof Location,
         'Router.run needs a Location'
       );