Use history.createLocation in <StaticRouter>

packages/react-router/modules/StaticRouter.js

@@ -2,19 +2,9 @@ import warning from "warning";
 import invariant from "invariant";
 import React from "react";
 import PropTypes from "prop-types";
-import { createPath, parsePath } from "history";
+import { createLocation, createPath } from "history";
 import Router from "./Router";
 
-const normalizeLocation = object => {
-  const { pathname = "/", search = "", hash = "" } = object;
-
-  return {
-    pathname,
-    search: search === "?" ? "" : search,
-    hash: hash === "#" ? "" : hash
-  };
-};
-
 const addLeadingSlash = path => {
   return path.charAt(0) === "/" ? path : "/" + path;
 };
@@ -41,11 +31,6 @@ const stripBasename = (basename, location) => {
   };
 };
 
-const createLocation = location =>
-  typeof location === "string"
-    ? parsePath(location)
-    : normalizeLocation(location);
-
 const createURL = location =>
   typeof location === "string" ? location : createPath(location);
 

packages/react-router/modules/__tests__/StaticRouter-test.js

@@ -108,47 +108,53 @@ describe("A <StaticRouter>", () => {
     expect(context.url).toBe("/somewhere-else");
   });
 
-  it("knows how to serialize location objects", () => {
-    const context = {};
+  describe("location", () => {
+    it("knows how to parse raw URL string into an object", () => {
+      const LocationChecker = props => {
+        expect(props.location).toMatchObject({
+          pathname: "/the/path",
+          search: "?the=query",
+          hash: "#the-hash"
+        });
+        return null;
+      };
 
-    ReactDOMServer.renderToStaticMarkup(
-      <StaticRouter context={context}>
-        <Redirect to={{ pathname: "/somewhere-else" }} />
-      </StaticRouter>
-    );
+      const context = {};
 
-    expect(context.action).toBe("REPLACE");
-    expect(context.location.pathname).toBe("/somewhere-else");
-    expect(context.location.search).toBe("");
-    expect(context.location.hash).toBe("");
-    expect(context.url).toBe("/somewhere-else");
-  });
+      ReactDOMServer.renderToStaticMarkup(
+        <StaticRouter context={context} location="/the/path?the=query#the-hash">
+          <Route component={LocationChecker} />
+        </StaticRouter>
+      );
+    });
 
-  it("knows how to parse raw URLs", () => {
-    const LocationChecker = props => {
-      expect(props.location).toMatchObject({
-        pathname: "/the/path",
-        search: "?the=query",
-        hash: "#the-hash"
-      });
-      return null;
-    };
+    it("adds missing properties to location object", () => {
+      const LocationChecker = props => {
+        expect(props.location).toMatchObject({
+          pathname: "/test",
+          search: "",
+          hash: ""
+        });
+        return null;
+      };
 
-    const context = {};
+      const context = {};
 
-    ReactDOMServer.renderToStaticMarkup(
-      <StaticRouter context={context} location="/the/path?the=query#the-hash">
-        <Route component={LocationChecker} />
-      </StaticRouter>
-    );
-  });
+      ReactDOMServer.renderToStaticMarkup(
+        <StaticRouter context={context} location={{ pathname: "/test" }}>
+          <Route component={LocationChecker} />
+        </StaticRouter>
+      );
+    });
 
-  describe("with a basename", () => {
-    it("strips the basename from location pathnames", () => {
+    it("decodes an encoded pathname", () => {
       const LocationChecker = props => {
         expect(props.location).toMatchObject({
-          pathname: "/path"
+          pathname: "/estático",
+          search: "",
+          hash: ""
         });
+        expect(props.match.params.type).toBe("estático");
         return null;
       };
 
@@ -157,64 +163,102 @@ describe("A <StaticRouter>", () => {
       ReactDOMServer.renderToStaticMarkup(
         <StaticRouter
           context={context}
-          basename="/the-base"
-          location="/the-base/path"
+          location={{ pathname: "/est%C3%A1tico" }}
         >
-          <Route component={LocationChecker} />
+          <Route path="/:type" component={LocationChecker} />
         </StaticRouter>
       );
     });
 
-    it("reports PUSH actions on the context object", () => {
+    it("knows how to serialize location objects", () => {
       const context = {};
 
       ReactDOMServer.renderToStaticMarkup(
-        <StaticRouter context={context} basename="/the-base">
-          <Redirect push to="/somewhere-else" />
+        <StaticRouter context={context}>
+          <Redirect to={{ pathname: "/somewhere-else" }} />
         </StaticRouter>
       );
 
-      expect(context.action).toBe("PUSH");
-      expect(context.url).toBe("/the-base/somewhere-else");
+      expect(context.action).toBe("REPLACE");
+      expect(context.location.pathname).toBe("/somewhere-else");
+      expect(context.location.search).toBe("");
+      expect(context.location.hash).toBe("");
+      expect(context.url).toBe("/somewhere-else");
     });
 
-    it("reports REPLACE actions on the context object", () => {
-      const context = {};
+    describe("with a basename", () => {
+      it("strips the basename from location pathnames", () => {
+        const LocationChecker = props => {
+          expect(props.location).toMatchObject({
+            pathname: "/path"
+          });
+          return null;
+        };
+
+        const context = {};
+
+        ReactDOMServer.renderToStaticMarkup(
+          <StaticRouter
+            context={context}
+            basename="/the-base"
+            location="/the-base/path"
+          >
+            <Route component={LocationChecker} />
+          </StaticRouter>
+        );
+      });
 
-      ReactDOMServer.renderToStaticMarkup(
-        <StaticRouter context={context} basename="/the-base">
-          <Redirect to="/somewhere-else" />
-        </StaticRouter>
-      );
+      it("reports PUSH actions on the context object", () => {
+        const context = {};
 
-      expect(context.action).toBe("REPLACE");
-      expect(context.url).toBe("/the-base/somewhere-else");
+        ReactDOMServer.renderToStaticMarkup(
+          <StaticRouter context={context} basename="/the-base">
+            <Redirect push to="/somewhere-else" />
+          </StaticRouter>
+        );
+
+        expect(context.action).toBe("PUSH");
+        expect(context.url).toBe("/the-base/somewhere-else");
+      });
+
+      it("reports REPLACE actions on the context object", () => {
+        const context = {};
+
+        ReactDOMServer.renderToStaticMarkup(
+          <StaticRouter context={context} basename="/the-base">
+            <Redirect to="/somewhere-else" />
+          </StaticRouter>
+        );
+
+        expect(context.action).toBe("REPLACE");
+        expect(context.url).toBe("/the-base/somewhere-else");
+      });
     });
-  });
 
-  describe("no basename", () => {
-    it("createHref does not append extra leading slash", () => {
-      const context = {};
-      const node = document.createElement("div");
-      const pathname = "/test-path-please-ignore";
-
-      const Link = ({ to, children }) => (
-        <Route
-          children={({ history: { createHref } }) => (
-            <a href={createHref(to)}>{children}</a>
-          )}
-        />
-      );
+    describe("no basename", () => {
+      it("createHref does not append extra leading slash", () => {
+        const context = {};
+        const node = document.createElement("div");
+        const pathname = "/test-path-please-ignore";
+
+        const Link = ({ to, children }) => (
+          <Route
+            children={({ history: { createHref } }) => (
+              <a href={createHref(to)}>{children}</a>
+            )}
+          />
+        );
 
-      ReactDOM.render(
-        <StaticRouter context={context}>
-          <Link to={pathname} />
-        </StaticRouter>,
-        node
-      );
+        ReactDOM.render(
+          <StaticRouter context={context}>
+            <Link to={pathname} />
+          </StaticRouter>,
+          node
+        );
 
-      const a = node.getElementsByTagName("a")[0];
-      expect(a.getAttribute("href")).toEqual(pathname);
+        const a = node.getElementsByTagName("a")[0];
+        expect(a.getAttribute("href")).toEqual(pathname);
+      });
     });
   });