diff --git a/packages/react-router-dom/modules/BrowserRouter.js b/packages/react-router-dom/modules/BrowserRouter.js index 3bf05d2f23..9a97e67033 100644 --- a/packages/react-router-dom/modules/BrowserRouter.js +++ b/packages/react-router-dom/modules/BrowserRouter.js @@ -18,7 +18,7 @@ class BrowserRouter extends React.Component { history = createHistory(this.props); - componentWillMount() { + componentDidMount() { warning( !this.props.history, " ignores the history prop. To use a custom history, " + diff --git a/packages/react-router-dom/modules/HashRouter.js b/packages/react-router-dom/modules/HashRouter.js index 26f822728b..6ed287cd3e 100644 --- a/packages/react-router-dom/modules/HashRouter.js +++ b/packages/react-router-dom/modules/HashRouter.js @@ -17,7 +17,7 @@ class HashRouter extends React.Component { history = createHistory(this.props); - componentWillMount() { + componentDidMount() { warning( !this.props.history, " ignores the history prop. To use a custom history, " + diff --git a/packages/react-router-dom/modules/__tests__/BrowserRouter-test.js b/packages/react-router-dom/modules/__tests__/BrowserRouter-test.js index a4a594cba5..613b064208 100644 --- a/packages/react-router-dom/modules/__tests__/BrowserRouter-test.js +++ b/packages/react-router-dom/modules/__tests__/BrowserRouter-test.js @@ -27,6 +27,21 @@ describe("A ", () => { expect(typeof history).toBe("object"); }); + it.skip("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("warns when passed a history prop", () => { const history = {}; const node = document.createElement("div"); diff --git a/packages/react-router-dom/modules/__tests__/HashRouter-test.js b/packages/react-router-dom/modules/__tests__/HashRouter-test.js index 2bcc25578b..95c44a7427 100644 --- a/packages/react-router-dom/modules/__tests__/HashRouter-test.js +++ b/packages/react-router-dom/modules/__tests__/HashRouter-test.js @@ -27,6 +27,21 @@ describe("A ", () => { expect(typeof history).toBe("object"); }); + it.skip("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("warns when passed a history prop", () => { const history = {}; const node = document.createElement("div"); diff --git a/packages/react-router/modules/MemoryRouter.js b/packages/react-router/modules/MemoryRouter.js index 3922857f2f..5084328ba9 100644 --- a/packages/react-router/modules/MemoryRouter.js +++ b/packages/react-router/modules/MemoryRouter.js @@ -18,7 +18,7 @@ class MemoryRouter extends React.Component { history = createHistory(this.props); - componentWillMount() { + componentDidMount() { warning( !this.props.history, " ignores the history prop. To use a custom history, " + diff --git a/packages/react-router/modules/Prompt.js b/packages/react-router/modules/Prompt.js index f2a2aac6c7..0e5063ec23 100644 --- a/packages/react-router/modules/Prompt.js +++ b/packages/react-router/modules/Prompt.js @@ -37,7 +37,7 @@ class Prompt extends React.Component { } } - componentWillMount() { + componentDidMount() { invariant( this.context.router, "You should not use outside a " @@ -46,10 +46,10 @@ class Prompt extends React.Component { if (this.props.when) this.enable(this.props.message); } - componentWillReceiveProps(nextProps) { - if (nextProps.when) { - if (!this.props.when || this.props.message !== nextProps.message) - this.enable(nextProps.message); + componentDidUpdate(prevProps) { + if (this.props.when) { + if (!prevProps.when || prevProps.message !== this.props.message) + this.enable(this.props.message); } else { this.disable(); } diff --git a/packages/react-router/modules/Router.js b/packages/react-router/modules/Router.js index a68b44d883..bc8f120105 100644 --- a/packages/react-router/modules/Router.js +++ b/packages/react-router/modules/Router.js @@ -64,9 +64,9 @@ class Router extends React.Component { }); } - componentWillReceiveProps(nextProps) { + componentDidUpdate(prevProps) { warning( - this.props.history === nextProps.history, + prevProps.history === this.props.history, "You cannot change " ); } diff --git a/packages/react-router/modules/StaticRouter.js b/packages/react-router/modules/StaticRouter.js index 4b516c58c3..3379070ae0 100644 --- a/packages/react-router/modules/StaticRouter.js +++ b/packages/react-router/modules/StaticRouter.js @@ -90,7 +90,7 @@ class StaticRouter extends React.Component { handleBlock = () => noop; - componentWillMount() { + componentDidMount() { warning( !this.props.history, " ignores the history prop. To use a custom history, " + diff --git a/packages/react-router/modules/Switch.js b/packages/react-router/modules/Switch.js index c3389dafc7..823ca2b1d8 100644 --- a/packages/react-router/modules/Switch.js +++ b/packages/react-router/modules/Switch.js @@ -26,14 +26,14 @@ class Switch extends React.Component { ); } - componentWillReceiveProps(nextProps) { + componentDidUpdate(prevProps) { warning( - !(nextProps.location && !this.props.location), + !(this.props.location && !prevProps.location), ' elements should not change from uncontrolled to controlled (or vice versa). You initially used no "location" prop and then provided one on a subsequent render.' ); warning( - !(!nextProps.location && this.props.location), + !(!this.props.location && prevProps.location), ' elements should not change from controlled to uncontrolled (or vice versa). You provided a "location" prop initially but omitted it on a subsequent render.' ); } diff --git a/packages/react-router/modules/__tests__/MemoryRouter-test.js b/packages/react-router/modules/__tests__/MemoryRouter-test.js index 9b160fcf76..5e23c8024a 100644 --- a/packages/react-router/modules/__tests__/MemoryRouter-test.js +++ b/packages/react-router/modules/__tests__/MemoryRouter-test.js @@ -40,4 +40,19 @@ describe("A ", () => { expect.stringContaining(" ignores the history prop") ); }); + + it.skip("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); }); diff --git a/packages/react-router/modules/__tests__/Prompt-test.js b/packages/react-router/modules/__tests__/Prompt-test.js new file mode 100644 index 0000000000..989c0f441c --- /dev/null +++ b/packages/react-router/modules/__tests__/Prompt-test.js @@ -0,0 +1,70 @@ +import React from "react"; +import ReactDOM from "react-dom"; +import MemoryRouter from "../MemoryRouter"; +import Prompt from "../Prompt"; + +describe("A ", () => { + it("is enabled when 'when' is undefined", () => { + const node = document.createElement("div"); + + spyOn(Prompt.prototype, "enable"); + + ReactDOM.render( + + + , + node + ); + + expect(Prompt.prototype.enable).toHaveBeenCalledTimes(1); + expect(Prompt.prototype.enable).toHaveBeenCalledWith("hi"); + }); + + it("is enabled when 'when' is true", () => { + const node = document.createElement("div"); + + spyOn(Prompt.prototype, "enable"); + + ReactDOM.render( + + + , + node + ); + + expect(Prompt.prototype.enable).toHaveBeenCalledTimes(1); + expect(Prompt.prototype.enable).toHaveBeenCalledWith("hi"); + }); + + it("is not enabled when 'when' is false", () => { + const node = document.createElement("div"); + + spyOn(Prompt.prototype, "enable"); + + ReactDOM.render( + + + , + node + ); + + expect(Prompt.prototype.enable).toHaveBeenCalledTimes(0); + }); + + it("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + + + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); +}); diff --git a/packages/react-router/modules/__tests__/Redirect-test.js b/packages/react-router/modules/__tests__/Redirect-test.js index d29aa70e3d..157adb2de2 100644 --- a/packages/react-router/modules/__tests__/Redirect-test.js +++ b/packages/react-router/modules/__tests__/Redirect-test.js @@ -36,5 +36,28 @@ describe("A ", () => { messageId: "123" }); }); + + it.skip("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + + + + null} /> + + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); }); }); diff --git a/packages/react-router/modules/__tests__/Route-test.js b/packages/react-router/modules/__tests__/Route-test.js index 13c046a72d..0d98734cf3 100644 --- a/packages/react-router/modules/__tests__/Route-test.js +++ b/packages/react-router/modules/__tests__/Route-test.js @@ -21,6 +21,24 @@ describe("A ", () => { expect(node.innerHTML).toContain(TEXT); }); + it.skip("does not error in StrictMode", () => { + const TEXT = "Mrs. Kato"; + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + +

{TEXT}

} /> +
+
, + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("does not render when it does not match", () => { const TEXT = "bubblegum"; const node = document.createElement("div"); diff --git a/packages/react-router/modules/__tests__/Router-test.js b/packages/react-router/modules/__tests__/Router-test.js index 23ed306f2c..3a10b9a804 100644 --- a/packages/react-router/modules/__tests__/Router-test.js +++ b/packages/react-router/modules/__tests__/Router-test.js @@ -38,6 +38,21 @@ describe("A ", () => { ); }).not.toThrow(); }); + + it.skip("does not error in StrictMode", () => { + spyOn(console, "error"); + + ReactDOM.render( + + +

Bar

+
+
, + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); }); describe("with no children", () => { diff --git a/packages/react-router/modules/__tests__/StaticRouter-test.js b/packages/react-router/modules/__tests__/StaticRouter-test.js index 8f34b81caa..57fdb31c32 100644 --- a/packages/react-router/modules/__tests__/StaticRouter-test.js +++ b/packages/react-router/modules/__tests__/StaticRouter-test.js @@ -67,6 +67,31 @@ describe("A ", () => { ); }); + it.skip("does not error in StrictMode", () => { + const ContextChecker = (props, reactContext) => { + expect(typeof reactContext.router.history).toBe("object"); + return null; + }; + + ContextChecker.contextTypes = { + router: PropTypes.object.isRequired + }; + + const context = {}; + + spyOn(console, "error"); + + ReactDOMServer.renderToStaticMarkup( + + + + + + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("warns when passed a history prop", () => { const context = {}; const history = {}; diff --git a/packages/react-router/modules/__tests__/Switch-test.js b/packages/react-router/modules/__tests__/Switch-test.js index 99d1e1574a..de55f2f790 100644 --- a/packages/react-router/modules/__tests__/Switch-test.js +++ b/packages/react-router/modules/__tests__/Switch-test.js @@ -22,6 +22,26 @@ describe("A ", () => { expect(node.innerHTML).toMatch(/one/); }); + it.skip("does not error in StrictMode", () => { + const node = document.createElement("div"); + + spyOn(console, "error"); + + ReactDOM.render( + + + +

one

} /> +

two

} /> +
+
+
, + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("renders the first that matches the URL", () => { const node = document.createElement("div"); diff --git a/packages/react-router/modules/__tests__/SwitchMount-test.js b/packages/react-router/modules/__tests__/SwitchMount-test.js index fa19bcf806..47be77ad37 100644 --- a/packages/react-router/modules/__tests__/SwitchMount-test.js +++ b/packages/react-router/modules/__tests__/SwitchMount-test.js @@ -12,7 +12,7 @@ describe("A ", () => { let mountCount = 0; class App extends React.Component { - componentWillMount() { + componentDidMount() { mountCount++; } diff --git a/packages/react-router/modules/__tests__/withRouter-test.js b/packages/react-router/modules/__tests__/withRouter-test.js index aa4dd0f8d0..6d15302ba7 100644 --- a/packages/react-router/modules/__tests__/withRouter-test.js +++ b/packages/react-router/modules/__tests__/withRouter-test.js @@ -28,6 +28,28 @@ describe("withRouter", () => { ); }); + it.skip("does not error in StrictMode", () => { + const WrappedComponent = withRouter(() => null); + + spyOn(console, "error"); + + ReactDOM.render( + + ( + + + + )} + /> + , + node + ); + + expect(console.error).toHaveBeenCalledTimes(0); + }); + it("provides the parent match as a prop to the wrapped component", () => { let parentMatch; const PropsChecker = withRouter(props => {