title: React history.push() not rendering new component
body: <p>I have a React.js project with a simple sign in function. After the user is authorized, I call history.push method which changes the link in the address bar but does not render the new component. (I use BrowserRouter)</p>
  <p>My <strong>index.js</strong> component:</p>
  <pre><code>ReactDOM.render(
    &lt;Provider store={createStore(mainReducer, applyMiddleware(thunk))}&gt;
      &lt;BrowserRouter&gt;
        &lt;Main /&gt;
      &lt;/BrowserRouter&gt;
    &lt;/Provider&gt;,
    document.getElementById('root')
  );
  </code></pre>
  <p>My <strong>Main.js</strong> component:</p>
  <pre><code>const Main = (props) =&gt; {
    return (
      &lt;Switch&gt;
        &lt;Route exact path=&quot;/&quot; component={Signin} /&gt;
        &lt;Route exact path=&quot;/servers&quot; component={Servers} /&gt;
      &lt;/Switch&gt;
  )}
  
  export default withRouter(Main);
  </code></pre>
  <p>My <strong>Action Creator</strong>:</p>
  <pre><code>export const authorization = (username, password) =&gt; (dispatch) =&gt;
    new Promise ((resolve, reject) =&gt; {
      fetch(url, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({
          username: username,
          password: password,
        })
      }).then( response =&gt; {
        if (response.ok) {
            response.json().then( result =&gt; {
              console.log(&quot;API reached.&quot;);
              dispatch(logUserIn(result.token));
              resolve(result);
          })
        } else {
          let error = new Error(response.statusText)
          error.response = response
          dispatch(showError(error.response.statusText), () =&gt; {throw error})
          reject(error);
        }
      });
    });
  </code></pre>
  <p>My <strong>Signin.js</strong> component:</p>
  <pre><code> handleSubmit(event) {
  
      event.preventDefault();
  
      this.setState({ isLoading: true })
  
      const { username, password } = this.state;
      this.props.onLoginRequest(username, password, this.props.history).then(result =&gt; {
        console.log(&quot;Success. Token: &quot;+result.token); //I do get &quot;success&quot; in console
        this.props.history.push('/servers') //Changes address, does not render /servers component
      });
  
    }
  
  const mapActionsToProps = {
    onLoginRequest: authorization
  }
  </code></pre>
  <p>The weirdest thing is that if I change my handleSubmit() method to this - everything works perfectly:</p>
  <pre><code>  handleSubmit(event) {
  
      event.preventDefault();
  
      this.setState({ isLoading: true })
  
      const { username, password } = this.state;
      this.props.onLoginRequest(username, password, this.props.history).then(result =&gt; {
        console.log(&quot;Success. Token: &quot;+result.token);
        //this.props.history.push('/servers')
      });
      this.props.history.push('/servers')
    }
  </code></pre>
  <p>The same issue comes if I try to push history from the <code>componentWillReceiveProps(newProps)</code> method - it changes address but does not render new component. Could someone please explain why this happens and how to fix it?</p>