Fixed maximum update depth exceeded caused by Redirect. (#6674)

* Redirect: Failing test for rendering in functional component

* Properly check if location matches in <Redirect/>

Fixes #6673

* Redirect: Handle all eventualities of to strings.

* Redirect: Add update depth test with 'to' as location

* Redirect: Simplify and rename tests.

* Redirect: work around locationsAreEquals quirk.

Author: StringEpsilon

packages/react-router/modules/Redirect.js

@@ -43,7 +43,16 @@ function Redirect({ computedMatch, to, push = false }) {
               method(location);
             }}
             onUpdate={(self, prevProps) => {
-              if (!locationsAreEqual(prevProps.to, location)) {
+              const prevLocation =
+                typeof prevProps.to === "string"
+                  ? createLocation(prevProps.to)
+                  : prevProps.to;
+              if (
+                !locationsAreEqual(prevLocation, {
+                  ...location,
+                  key: prevLocation.key
+                })
+              ) {
                 method(location);
               }
             }}

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

@@ -1,7 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import { MemoryRouter, Redirect, Route, Switch } from "react-router";
-
+import { createLocation } from "history";
 import renderStrict from "./utils/renderStrict";
 
 describe("A <Redirect>", () => {
@@ -11,6 +11,31 @@ describe("A <Redirect>", () => {
     ReactDOM.unmountComponentAtNode(node);
   });
 
+  describe("that always renders", () => {
+    it("doesn't break / throw when rendered with string `to`", () => {
+      expect(() => {
+        renderStrict(
+          <MemoryRouter>
+            <Redirect to="go-out" />
+          </MemoryRouter>,
+          node
+        );
+      }).not.toThrow();
+    });
+
+    it("doesn't break / throw when rendered with location `to`", () => {
+      const to = createLocation("/go-out?search=foo#hash");
+      expect(() => {
+        renderStrict(
+          <MemoryRouter>
+            <Redirect to={to} />
+          </MemoryRouter>,
+          node
+        );
+      }).not.toThrow();
+    });
+  });
+
   describe("inside a <Switch>", () => {
     it("automatically interpolates params", () => {
       let params;