React-router: Bug: wrong browser back button behaviour when routes are wrapped by container component

Created on 17 Apr 2017  路  1Comment  路  Source: ReactTraining/react-router

Version

react v15.5.4
redux v3.6.0
react-redux v5.0.4
react-router v4.1.1
react-router-redux v5.0.0-alpha.6

Test Case

Live examples (hash history):
http://mars.iti.pk.edu.pl/~nkg/container/dist/ - routes wrapped by container component and working wrong
http://mars.iti.pk.edu.pl/~nkg/presentation/dist/ - routes wrapped by presentation component and working good

Source code (browser history):
https://github.com/dzwiedziu-nkg/react-router-redux-bug

Steps to reproduce

Go to http://mars.iti.pk.edu.pl/~nkg/container/dist/ and:

  1. Click on _About_ hyperlink.
  2. Click on _Topics_ hyperlink.
  3. Click on bowser's _back_ button.
  4. Click on bowser's _back_ button again.

Expected Behavior

  1. Change address in browser to /about and see _About_ below hyperlinks.
  2. Change address in browser to /topics and see _Topics_ below hyperlinks.
  3. Change address in browser to /about and see _About_ below hyperlinks.
  4. Change address in browser to / and see _Home_ below hyperlinks.

Actual Behavior

  1. Change address in browser to /about and see _About_ below hyperlinks - good.
  2. Change address in browser to /topics and see _Topics_ below hyperlinks - good.
  3. Change address in browser to /about and see _Topics_ below hyperlinks - wrong.
  4. Change address in browser to / and see _About_ below hyperlinks - wrong.

Most helpful comment

My mistake, I forgot to use withRouter (https://reacttraining.com/react-router/web/guides/redux-integration). When changed const LayoutContainer = connect(mapStateToProps)(Layout); to const LayoutContainer = withRouter(connect(mapStateToProps)(Layout)); it works well.

>All comments

My mistake, I forgot to use withRouter (https://reacttraining.com/react-router/web/guides/redux-integration). When changed const LayoutContainer = connect(mapStateToProps)(Layout); to const LayoutContainer = withRouter(connect(mapStateToProps)(Layout)); it works well.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

wzup picture wzup  路  3Comments

sarbbottam picture sarbbottam  路  3Comments

ackvf picture ackvf  路  3Comments

winkler1 picture winkler1  路  3Comments

andrewpillar picture andrewpillar  路  3Comments