Fallback to Render if Hydrate is not defined

ReactDOM.hydrate() may not be defined for everyone, it will now use
hydrate if it is defined or fallback to render.

Fixes #832

Author: BookOfGreg

CHANGELOG.md

@@ -1,12 +1,8 @@
 # react-rails
 
-#### Breaking Changes
-
-#### New Features
-
-#### Deprecation
-
+## 2.4.2
 #### Bug Fixes
+- ReactDOM.hydrate() may not be defined for everyone, it will now use hydrate if it is defined or fallback to render #832
 
 ## 2.4.1
 

CONTRIBUTING.md

@@ -108,7 +108,7 @@ It outputs an ironically webpacked couple of files into `lib/assets/react-source
 ##### Updating ReactRailsUJS
 - Update the UJS with `rake ujs:update`
 - (For Maintainers) To release a new NPM version:
-  - Update the version in `react_ujs/package.json`
+  - Update the version in `package.json`
   - Commit & push to master
   - `bundle exec rake ujs:publish` (runs `npm publish`)
 

lib/assets/javascripts/react_ujs.js

@@ -315,7 +315,11 @@ var ReactRailsUJS = {
         }
         throw new Error(message + ". Make sure your component is available to render.")
       } else {
-        ReactDOM.hydrate(React.createElement(constructor, props), node);
+        if (typeof ReactDOM.hydrate === "function") {
+          ReactDOM.hydrate(React.createElement(constructor, props), node);
+        } else {
+          ReactDOM.render(React.createElement(constructor, props), node);
+        }
       }
     }
   },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react_ujs",
-  "version": "2.4.1",
+  "version": "2.4.2",
   "description": "Rails UJS for the react-rails gem",
   "main": "react_ujs/index.js",
   "files": [

react_ujs/dist/react_ujs.js

@@ -315,7 +315,11 @@ var ReactRailsUJS = {
         }
         throw new Error(message + ". Make sure your component is available to render.")
       } else {
-        ReactDOM.hydrate(React.createElement(constructor, props), node);
+        if (typeof ReactDOM.hydrate === "function") {
+          ReactDOM.hydrate(React.createElement(constructor, props), node);
+        } else {
+          ReactDOM.render(React.createElement(constructor, props), node);
+        }
       }
     }
   },

react_ujs/index.js

@@ -90,7 +90,11 @@ var ReactRailsUJS = {
         }
         throw new Error(message + ". Make sure your component is available to render.")
       } else {
-        ReactDOM.hydrate(React.createElement(constructor, props), node);
+        if (typeof ReactDOM.hydrate === "function") {
+          ReactDOM.hydrate(React.createElement(constructor, props), node);
+        } else {
+          ReactDOM.render(React.createElement(constructor, props), node);
+        }
       }
     }
   },