Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Value is Undefined in SSR of React-Redux v6 #1107

Closed
sinwailam193 opened this issue Dec 8, 2018 · 5 comments
Closed

Value is Undefined in SSR of React-Redux v6 #1107

sinwailam193 opened this issue Dec 8, 2018 · 5 comments

Comments

@sinwailam193
Copy link

@sinwailam193 sinwailam193 commented Dec 8, 2018

There is an issue that I found in regarding to React Redux v6 on SSR, it might be related to the new Context.Consumer API.

I am currently getting an error in the terminal that states

Could not find "store" in the context of "Connect(WithStyles(HomeRoute))". Either wrap the root component in a <Provider>, or pass a custom React context provider to <Provider> and the corresponding React context consumer to Connect(WithStyles(HomeRoute)) in connect options.

However when I turn off SSR, the app works fine with no issue. So this issue is only on the server side rendering. I also dug into the new version 6 code and when I console.log Context that is being passed into the Connect class of connectAdvanced it logs

{ '$$typeof': Symbol(react.context),
  _calculateChangedBits: null,
  _currentValue:
   { storeState:
      { userReducer: { users: [], user: null },
        questionReducer: { questions: [], total: 0 } },
     store:
      { dispatch: [Function],
        subscribe: [Function: subscribe],
        getState: [Function: getState],
        replaceReducer: [Function: replaceReducer],
        [Symbol(observable)]: [Function: observable] } },
  _currentValue2: null,
  _threadCount: 0,
  Provider: { '$$typeof': Symbol(react.provider), _context: [Circular] },
  Consumer:
   { '$$typeof': Symbol(react.context),
     _context: [Circular],
     _calculateChangedBits: null },
  _currentRenderer: null,
  _currentRenderer2: null }

which contains the store and store state, however the issue is when it is being consumed by the Consumer

<ContextToUse.Consumer>
            {this.renderWrappedComponent}
 </ContextToUse.Consumer>

value is being undefined in this.renderWrappedComponent.

The expected behavior is that value should contain store and storeState from the store in Consumer on the server side, similar to the behavior of client side.

The version of redux is 4.0.1 and react-redux 6.0.0, Mac OS. This was not an issue in the previous version of react-redux 5.1.1 since it was using the old context API.

@markerikson
Copy link
Contributor

@markerikson markerikson commented Dec 8, 2018

Can you put together a project that reproduces the issue?

Loading

@sinwailam193
Copy link
Author

@sinwailam193 sinwailam193 commented Dec 8, 2018

Hi @markerikson, I'm still able to reproduce it on this project, https://github.com/sinwailam193/boilerplate.
Once you run localhost:8080, you should be able to see the issue in the terminal. Right now I don't know if it is caused by other third party libraries or not.

Loading

@sinwailam193 sinwailam193 reopened this Dec 8, 2018
@sinwailam193
Copy link
Author

@sinwailam193 sinwailam193 commented Dec 9, 2018

Ok I figure out the issue, it deals with the fact that it is using the server side rendering is using https://github.com/ctrlplusb/react-tree-walker, therefore it is causing this error.

Loading

@DBosley
Copy link

@DBosley DBosley commented Jan 9, 2019

@sinwailam193: What did you do to resolve this? I'm having the same problem with SSR.

Loading

@sinwailam193
Copy link
Author

@sinwailam193 sinwailam193 commented Jan 10, 2019

Hey @DBosley, were you also using the https://github.com/ctrlplusb/react-universally boilerplate? If you are, I would say just don't use react-async-bootstrapper, it's what is causing this bug in the first place.

Loading

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants