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

ReactDOM.hydrate is not a function #832

Closed
victorbojica opened this issue Nov 4, 2017 · 6 comments
Closed

ReactDOM.hydrate is not a function #832

victorbojica opened this issue Nov 4, 2017 · 6 comments
Assignees

Comments

@victorbojica
Copy link

Hi,

Just updated the package and i'm running into this:

index.js:93 Uncaught TypeError: ReactDOM.hydrate is not a function at Object.mountComponents (index.js:93) at HTMLDocument.ReactRailsUJS.handleMount (index.js:124) at HTMLDocument.dispatch (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:5227) at HTMLDocument.elemData.handle (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:4879) at Object.t.dispatch (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6) at r.t.Controller.r.notifyApplicationAfterRender (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:7) at r.t.Controller.r.viewRendered (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6) at n.t.Renderer.t.renderView (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6) at n.t.SnapshotRenderer.n.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6) at Function.t.Renderer.t.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)

Probably related to #828

Thanks.

@BookOfGreg
Copy link
Member

What version of React are you running? ReactDOM.hydrate is a function from v16.
yarn upgrade react react-dom should fix that right up for you 👍 Let me know how it goes.

@xinranxiao
Copy link
Contributor

xinranxiao commented Nov 7, 2017

@victorbojica make sure your package.json has this specific version for react_usj: "react_ujs": "2.4.0" (as opposed to something like "react_ujs": "^2.4.0").

#828 bumped the patch version and now requires React v16.xx. It's not backwards compatible and will break anyone with ^2.x.x who's not on React v16.x. @BookOfGreg I'd recommend rolling back that change with 2.4.2 and then bumping maybe the major version for the change? Not sure what's the best way to set a hard v16.xx requirement

@BookOfGreg
Copy link
Member

@xinranxiao Good point, the 2.4.0 change will have not been backward compatible for sprockets users in the Gem (and I even listed it as so in the Changelog) and the UJS is definitely is not backward compatible as it uses without testing for existence of hydrate.

I must take a moment to apologise for moving too quickly.

@rmosolgo I'd like your input to this issue as me rushing is what got us here, so me rushing to fix isn't wise either.

I could release a react_UJS node package 2.4.2 that checks for hydrate and uses render if hydrate is not defined, that lets us get passed the UJS backward compatibility hurdle no bother.

There's also the gem itself that is backwards incompatible only for Sprockets users that are using the pre-bundled react, as it forces a React 16 upgrade. Webpacker users and sprockets not pre-bundling have their own React so dodge the issue. I could backport fixes to 2.3-stable branch and release that as gem 2.4.2and then release 2.4.1 as 3.0.

The reason I didn't want to release as 3.0 as it seemed like a big leap for the work I was doing, and only affected a subset of users, though the gem is mature enough that I shouldn't be releasing so quickly as I have been doing.

Thoughts please?

@rmosolgo
Copy link
Member

Sorry I'm late on the ping here!

Oh, I see -- the react_ujs now depends on React 16, is that right?

I could release a react_UJS node package 2.4.2 that checks for hydrate and uses render if hydrate is not defined

This seems perfect, are there any drawbacks to it? (A patch version seems right to me -- we're fixing a backwards compat scenario.)

As for Sprockets, I think a corresponding Gem release will solve the problem there. If they have their own React bundled in, and it's less than 16, they'll be ok, because the UJS will choose render instead of hydrate, right?

@BookOfGreg
Copy link
Member

As for Sprockets, I think a corresponding Gem release will solve the problem there. If they have their own React bundled in, and it's less than 16, they'll be ok, because the UJS will choose render instead of hydrate, right?

Ah good point. Yes correcting the UJS will fix it for that set of users.

For people on sprockets using the bundled react, I've effectively forced an incompatible upgrade from React 15 to 16, should I release a 3.0 to the gem for that or is that a small enough subset to pass over? They would definitely need to handle PropTypes and CreateReactClass.

I'll go ahead and work on the 2.4.2 for the UJS for now, thanks for your thoughts.

@BookOfGreg BookOfGreg self-assigned this Nov 13, 2017
@rmosolgo
Copy link
Member

IMO no need for a major version change, other React versions were also incremented on minor versions:

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

No branches or pull requests

4 participants