ctrlplusb/react-async-bootstrapper

Bootstrap not passing proper context on SSR

jcampalo opened this issue · 5 comments

With the latest react version I'm unable to make this library work, for some reason react-tree-walker is not able to keep the context of the provider.

I was able to reproduce the error inside the asyncBootstrapper.test.js:

`
import React, { Component } from 'react'
import asyncBootstrapper from '../'

const ThemeContext = React.createContext('light')

describe('asyncBootstrapper()', () => {
let values = []
let actualContext
let contextValue

class DeprecatedAPI extends Component {
asyncBootstrap() {
values.push(this.props.id)
return true
}

render() {
  return <div>{this.props.children}</div>
}

}

class NewAPI extends Component {
bootstrap() {
values.push(this.props.id)
actualContext = this.context
return true
}

render() {
  return <div>{this.props.children}</div>
}

}

const app = Foo => (
<ThemeContext.Provider value='dark'>


Test





<ThemeContext.Consumer>
{value => {
contextValue = value
return value
}}
</ThemeContext.Consumer>



</ThemeContext.Provider>
)

beforeEach(() => {
values = []
})

it('deprecated API', () =>
asyncBootstrapper(app(DeprecatedAPI)).then(() =>
expect(values).toEqual([1, 2, 4, 3]),
))

it('new API', () =>
asyncBootstrapper(app(NewAPI), null, { bespokeContext: true }).then(() => {
expect(values).toEqual([1, 2, 4, 3])
expect(actualContext).toEqual({
bespokeContext: true,
reactAsyncBootstrapperRunning: true,
})
expect(contextValue).toEqual('dark')
}))
})
`

Updating the react version to 16.6.3 you should be able to reproduce the error.

Same bug, but encountered it with connected to redux component - it fails with error of missing store in context.

Same here but with react-helmet-async.

@NikitaRzm @jcampalo Did you find any solutions or did you revert to an older version?

@ctrlplusb Any ideas on what might be going on here?

Well, i found, that issue possibly is ctrlplusb/react-tree-walker#40 (in react-walk-tree), with context. People waits for new release, fixes already applied, but package does not published yet in new version.

Seems we need to wait or solve problems of bootstrapping in other way :)

@oyeanuj Yes, I'm still using 16.5.x version of React. As @NikitaRzm is related to the issue with react-tree-walker.

I created a temporary fork that will allow you to use the latest commit. I have very little time, so please don't expect any support, but it should get you past the hurdles, I think. Let me know if this works.

Install in your package.json dependencies as such:
"react-async-bootstrapper": "git+https://github.com/mschipperheyn/react-async-bootstrapper.git#581e3fd",