From 2c5d6da40c2c9c62b5fe75f3a17a1fd4785fdcb0 Mon Sep 17 00:00:00 2001 From: Saleh Hamadeh Date: Tue, 24 Oct 2017 16:24:27 -0700 Subject: [PATCH] Update React to v16.0.0 --- packages/react-server-cli/package.json | 4 +- .../bike-share/components/network-card.js | 21 ++++---- .../bike-share/components/network-list.js | 3 +- .../bike-share/components/station-card.js | 19 +++---- .../bike-share/components/station-list.js | 3 +- .../meteor-site/components/Map.js | 3 +- .../meteor-site/components/Table.js | 3 +- .../redux-basic/components/Counter.js | 3 +- .../package.json | 4 +- packages/react-server-redux/package.json | 2 +- .../react-server-redux/src/RootProvider.js | 3 +- .../react-server-test-pages/.reactserverrc | 3 +- packages/react-server-test-pages/package.json | 4 +- .../pages/root/reduxAdapter.js | 3 +- .../pages/root/rootProvider.js | 3 +- .../components/Markdown.js | 7 +-- .../components/doc-body.js | 3 +- .../components/page-title.js | 3 +- packages/react-server-website/package.json | 4 +- .../react-server/core/ClientController.js | 2 +- .../core/components/FragmentDataCache.jsx | 31 +++++++----- .../react-server/core/components/Link.jsx | 49 ++++++++++++------- .../core/components/RootContainer.js | 7 +-- .../core/components/RootElement.js | 9 ++-- packages/react-server/package.json | 8 +-- 25 files changed, 120 insertions(+), 84 deletions(-) diff --git a/packages/react-server-cli/package.json b/packages/react-server-cli/package.json index 3c9c49222..6bd6e543f 100644 --- a/packages/react-server-cli/package.json +++ b/packages/react-server-cli/package.json @@ -68,8 +68,8 @@ "mockery": "^2.0.0", "nsp": "^2.6.2", "output-file-sync": "^1.1.2", - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "react-hot-loader": "^1.3.1", "react-server": "^0.7.3", "react-server-gulp-module-tagger": "^0.6.0", diff --git a/packages/react-server-examples/bike-share/components/network-card.js b/packages/react-server-examples/bike-share/components/network-card.js index 4b364f59a..97bffa2ca 100644 --- a/packages/react-server-examples/bike-share/components/network-card.js +++ b/packages/react-server-examples/bike-share/components/network-card.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import React from 'react'; import {logging, Link} from 'react-server'; @@ -11,17 +12,17 @@ const NetworkCard = ({id, name, location, company}) => { }; NetworkCard.propTypes = { - company: React.PropTypes.any, - href: React.PropTypes.string, - id: React.PropTypes.string, - location: React.PropTypes.shape({ - city: React.PropTypes.string, - country: React.PropTypes.string, - latitude: React.PropTypes.number, - longitude: React.PropTypes.number, + company: PropTypes.any, + href: PropTypes.string, + id: PropTypes.string, + location: PropTypes.shape({ + city: PropTypes.string, + country: PropTypes.string, + latitude: PropTypes.number, + longitude: PropTypes.number, }), - name: React.PropTypes.string, - stations: React.PropTypes.array, + name: PropTypes.string, + stations: PropTypes.array, }; NetworkCard.displayName = 'NetworkCard'; diff --git a/packages/react-server-examples/bike-share/components/network-list.js b/packages/react-server-examples/bike-share/components/network-list.js index 13043d1f3..0c8cdca09 100644 --- a/packages/react-server-examples/bike-share/components/network-list.js +++ b/packages/react-server-examples/bike-share/components/network-list.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import React from 'react'; import {logging} from 'react-server'; import NetworkCard from './network-card'; @@ -13,7 +14,7 @@ const NetworkList = ({networks}) => { }; NetworkList.propTypes = { - networks: React.PropTypes.array, + networks: PropTypes.array, }; NetworkList.displayName = 'NetworkList'; diff --git a/packages/react-server-examples/bike-share/components/station-card.js b/packages/react-server-examples/bike-share/components/station-card.js index 675591a80..1a5b8370f 100644 --- a/packages/react-server-examples/bike-share/components/station-card.js +++ b/packages/react-server-examples/bike-share/components/station-card.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import React from 'react'; import {logging} from 'react-server'; @@ -18,15 +19,15 @@ const StationCard = ({station}) => { }; StationCard.propTypes = { - station: React.PropTypes.shape({ - empty_slots: React.PropTypes.number, // eslint-disable-line - extra: React.PropTypes.object, - free_bikes: React.PropTypes.number, // eslint-disable-line - id: React.PropTypes.string, - latitude: React.PropTypes.number, - longitude: React.PropTypes.number, - name: React.PropTypes.string, - timestamp: React.PropTypes.string, + station: PropTypes.shape({ + empty_slots: PropTypes.number, // eslint-disable-line + extra: PropTypes.object, + free_bikes: PropTypes.number, // eslint-disable-line + id: PropTypes.string, + latitude: PropTypes.number, + longitude: PropTypes.number, + name: PropTypes.string, + timestamp: PropTypes.string, }), }; diff --git a/packages/react-server-examples/bike-share/components/station-list.js b/packages/react-server-examples/bike-share/components/station-list.js index 5b83f492d..cb5273fe6 100644 --- a/packages/react-server-examples/bike-share/components/station-list.js +++ b/packages/react-server-examples/bike-share/components/station-list.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import React from 'react'; import {logging} from 'react-server'; import StationCard from './station-card'; @@ -11,7 +12,7 @@ const StationList = ({stations}) => { }; StationList.propTypes = { - stations: React.PropTypes.array, + stations: PropTypes.array, }; StationList.displayName = 'StationList'; diff --git a/packages/react-server-examples/meteor-site/components/Map.js b/packages/react-server-examples/meteor-site/components/Map.js index fdedad3ea..f409650dc 100644 --- a/packages/react-server-examples/meteor-site/components/Map.js +++ b/packages/react-server-examples/meteor-site/components/Map.js @@ -1,4 +1,5 @@ -import { default as React, PropTypes } from "react"; +import PropTypes from 'prop-types'; +import React from "react"; import GoogleMap from "google-map-react"; const MeteorMap = ({ defaultCenter, center , meteors }) => ( diff --git a/packages/react-server-examples/meteor-site/components/Table.js b/packages/react-server-examples/meteor-site/components/Table.js index b82150f0f..930cc2992 100644 --- a/packages/react-server-examples/meteor-site/components/Table.js +++ b/packages/react-server-examples/meteor-site/components/Table.js @@ -1,4 +1,5 @@ -import { default as React, PropTypes } from "react"; +import PropTypes from 'prop-types'; +import React from "react"; import { Link } from "react-server"; const headerColumns = [ diff --git a/packages/react-server-examples/redux-basic/components/Counter.js b/packages/react-server-examples/redux-basic/components/Counter.js index 03fae3a99..919957449 100644 --- a/packages/react-server-examples/redux-basic/components/Counter.js +++ b/packages/react-server-examples/redux-basic/components/Counter.js @@ -1,4 +1,5 @@ -import React, { Component, PropTypes } from 'react' +import PropTypes from 'prop-types'; +import React, { Component } from 'react'; import { connect } from 'react-redux' class Counter extends Component { diff --git a/packages/react-server-integration-tests/package.json b/packages/react-server-integration-tests/package.json index 1f83a6d7c..29b3f4c7e 100644 --- a/packages/react-server-integration-tests/package.json +++ b/packages/react-server-integration-tests/package.json @@ -18,8 +18,8 @@ "minimist": "^1.2.0", "mkdirp": "^0.5.1", "q": "1.4.1", - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "react-server": "^0.7.3", "react-server-cli": "^0.7.3", "rimraf": "^2.5.4", diff --git a/packages/react-server-redux/package.json b/packages/react-server-redux/package.json index 196300da0..293057b1a 100644 --- a/packages/react-server-redux/package.json +++ b/packages/react-server-redux/package.json @@ -26,7 +26,7 @@ "redux": "^3.6.0" }, "peerDependencies": { - "react": "~0.14.2 || ^15.1.0" + "react": "~0.14.2 || ^15.1.0 || ^16.0.0" }, "devDependencies": { "ava": "^0.17.0", diff --git a/packages/react-server-redux/src/RootProvider.js b/packages/react-server-redux/src/RootProvider.js index aff7bd5e6..310862f05 100644 --- a/packages/react-server-redux/src/RootProvider.js +++ b/packages/react-server-redux/src/RootProvider.js @@ -1,3 +1,4 @@ +const PropTypes = require('prop-types'); var React = require('react'); var { Provider } = require('react-redux'); @@ -35,5 +36,5 @@ class RootProvider extends React.Component { module.exports = RootProvider; RootProvider.propTypes = { - store: React.PropTypes.object.isRequired, + store: PropTypes.object.isRequired, } diff --git a/packages/react-server-test-pages/.reactserverrc b/packages/react-server-test-pages/.reactserverrc index 2889158c3..834c274ee 100644 --- a/packages/react-server-test-pages/.reactserverrc +++ b/packages/react-server-test-pages/.reactserverrc @@ -1,3 +1,4 @@ { - "routesFile": "./routes.js" + "routesFile": "./routes.js", + "hot": false } diff --git a/packages/react-server-test-pages/package.json b/packages/react-server-test-pages/package.json index 8e2fca09e..9536b6acc 100644 --- a/packages/react-server-test-pages/package.json +++ b/packages/react-server-test-pages/package.json @@ -16,8 +16,8 @@ "dependencies": { "lodash": "^4.16.4", "q": "1.4.1", - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "react-server": "^0.7.3", "react-server-cli": "^0.7.3", "react-server-data-bundle-cache": "^0.7.3", diff --git a/packages/react-server-test-pages/pages/root/reduxAdapter.js b/packages/react-server-test-pages/pages/root/reduxAdapter.js index 85254d071..2176aeade 100644 --- a/packages/react-server-test-pages/pages/root/reduxAdapter.js +++ b/packages/react-server-test-pages/pages/root/reduxAdapter.js @@ -1,5 +1,6 @@ import {createStore, applyMiddleware} from "redux"; import React from 'react'; +import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import {RootElement} from "react-server"; import {RootProvider, ReduxAdapter} from "react-server-redux"; @@ -34,7 +35,7 @@ function initAction() { class BasicComponent extends React.Component { propTypes: { - elementData: React.PropTypes.sting.isRequired, + elementData: PropTypes.sting.isRequired, } render() { diff --git a/packages/react-server-test-pages/pages/root/rootProvider.js b/packages/react-server-test-pages/pages/root/rootProvider.js index 5be565b82..e585624f0 100644 --- a/packages/react-server-test-pages/pages/root/rootProvider.js +++ b/packages/react-server-test-pages/pages/root/rootProvider.js @@ -2,6 +2,7 @@ import {RootElement} from "react-server"; import {RootProvider} from "react-server-redux"; import {createStore} from "redux"; import { connect } from 'react-redux'; +import PropTypes from 'prop-types'; import React from 'react'; function simpleReducer(state = {simpleValue: "Hello"}) { @@ -15,7 +16,7 @@ class BasicComponent extends React.Component { } BasicComponent.propTypes = { - simpleValue: React.PropTypes.string, + simpleValue: PropTypes.string, } const mapStateToProps = function(state) { diff --git a/packages/react-server-website/components/Markdown.js b/packages/react-server-website/components/Markdown.js index 899c8cbd1..b765252d0 100644 --- a/packages/react-server-website/components/Markdown.js +++ b/packages/react-server-website/components/Markdown.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import React from 'react'; import Remarkable from 'remarkable'; @@ -58,9 +59,9 @@ export default class Markdown extends React.Component { } Markdown.propTypes = { - source : React.PropTypes.string, - reuseDom : React.PropTypes.bool, - bundleData : React.PropTypes.bool, + source : PropTypes.string, + reuseDom : PropTypes.bool, + bundleData : PropTypes.bool, } Markdown.defaultProps = { diff --git a/packages/react-server-website/components/doc-body.js b/packages/react-server-website/components/doc-body.js index 5d2d7124e..b0eac174e 100644 --- a/packages/react-server-website/components/doc-body.js +++ b/packages/react-server-website/components/doc-body.js @@ -1,5 +1,6 @@ +import PropTypes from 'prop-types'; import React from "react"; -import {Component, PropTypes} from 'react'; +import { Component } from 'react'; import Markdown from './Markdown'; export default class DocBody extends Component { diff --git a/packages/react-server-website/components/page-title.js b/packages/react-server-website/components/page-title.js index 3901736db..8c8885d81 100644 --- a/packages/react-server-website/components/page-title.js +++ b/packages/react-server-website/components/page-title.js @@ -1,5 +1,6 @@ +import PropTypes from 'prop-types'; import React from 'react'; -import {Component, PropTypes} from 'react'; +import { Component } from 'react'; import './page-title.less'; export default class PageTitle extends Component { diff --git a/packages/react-server-website/package.json b/packages/react-server-website/package.json index e99aa4767..2701968f8 100644 --- a/packages/react-server-website/package.json +++ b/packages/react-server-website/package.json @@ -17,8 +17,8 @@ "babel-plugin-transform-runtime": "^6.15.0", "babel-runtime": "^6.18.0", "highlight.js": "^9.5.0", - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "react-server": "^0.7.3", "react-server-cli": "^0.7.3", "react-server-data-bundle-cache": "^0.7.3", diff --git a/packages/react-server/core/ClientController.js b/packages/react-server/core/ClientController.js index ecdefe00e..564e3a286 100644 --- a/packages/react-server/core/ClientController.js +++ b/packages/react-server/core/ClientController.js @@ -585,7 +585,7 @@ class ClientController extends EventEmitter { , timer = logger.timer(`renderElement.individual.${name}`) element = React.cloneElement(element, { context: this.context }); - ReactDOM.render(element, root); + ReactDOM.hydrate(element, root); _.forEach( getRootElementAttributes(element), diff --git a/packages/react-server/core/components/FragmentDataCache.jsx b/packages/react-server/core/components/FragmentDataCache.jsx index 047831449..d10c5a089 100644 --- a/packages/react-server/core/components/FragmentDataCache.jsx +++ b/packages/react-server/core/components/FragmentDataCache.jsx @@ -1,6 +1,7 @@ var ReactServerAgent = require("../ReactServerAgent"), - React = require("react"); + React = require("react"), + PropTypes = require('prop-types'); /** * FragmentDataCache writes out a serialized form of the ReactServerAgent request @@ -36,30 +37,34 @@ var ReactServerAgent = require("../ReactServerAgent"), * * entry.res and entry.err.response won't have any `body` entry if * the response from the server was HTML instead of JSON. */ -var FragmentDataCache = module.exports = React.createClass({ +class FragmentDataCache extends React.Component { - propTypes: { - cacheNodeId: React.PropTypes.string, - }, + static get displayName() { + return 'FragmentDataCache'; + } - displayName: 'FragmentDataCache', + static get propTypes() { + return { + cacheNodeId: PropTypes.string, + }; + } - getDefaultProps: function () { + getDefaultProps() { return { cacheNodeId: "react-server-fragment-data-cache", - } - }, + }; + } - render: function () { + render() { return (
); - }, + } -}); +}; /** * Return a promise that resolves with the FragmentDataCache component @@ -70,3 +75,5 @@ FragmentDataCache.createWhenReady = function (fragmentDataCacheProps = {}) { return ; }); } + +module.exports = FragmentDataCache; diff --git a/packages/react-server/core/components/Link.jsx b/packages/react-server/core/components/Link.jsx index a79045531..fc4e4f086 100644 --- a/packages/react-server/core/components/Link.jsx +++ b/packages/react-server/core/components/Link.jsx @@ -1,33 +1,45 @@ var React = require('react'), + PropTypes = require('prop-types'), navigateTo = require("../util/navigateTo"); -module.exports = React.createClass({ - displayName: 'Link', +class Link extends React.Component { - propTypes: { - path : React.PropTypes.string, - href : React.PropTypes.string, - onClick : React.PropTypes.func, - bundleData : React.PropTypes.bool, - reuseDom : React.PropTypes.bool, - className : React.PropTypes.string, - }, + static get displayName() { + return 'Link'; + } - getDefaultProps(){ + static get propTypes() { + return { + path : PropTypes.string, + href : PropTypes.string, + onClick : PropTypes.func, + bundleData : PropTypes.bool, + reuseDom : PropTypes.bool, + className : PropTypes.string, + }; + } + + static get defaultProps() { return { bundleData : false, reuseDom : false, - } - }, + }; + } + + constructor(props) { + super(props); + + this._onClick = this._onClick.bind(this); + } - render: function () { + render() { return ( {this.props.children} ); - }, + } - _onClick: function (e) { + _onClick(e) { // TODO: IE8-9 detection @@ -46,6 +58,7 @@ module.exports = React.createClass({ } else { // do normal browser navigate } + } +} - }, -}) +module.exports = Link; diff --git a/packages/react-server/core/components/RootContainer.js b/packages/react-server/core/components/RootContainer.js index 004112ec2..3a3b7a332 100644 --- a/packages/react-server/core/components/RootContainer.js +++ b/packages/react-server/core/components/RootContainer.js @@ -1,3 +1,4 @@ +var PropTypes = require('prop-types'); var React = require('react'); var { ensureRootElementWithContainer, @@ -13,9 +14,9 @@ class RootContainer extends React.Component { module.exports = RootContainer; RootContainer.propTypes = { - listen: React.PropTypes.func, - when: React.PropTypes.object, // A promise. - _isRootContainer: React.PropTypes.bool, + listen: PropTypes.func, + when: PropTypes.object, // A promise. + _isRootContainer: PropTypes.bool, } RootContainer.defaultProps = { diff --git a/packages/react-server/core/components/RootElement.js b/packages/react-server/core/components/RootElement.js index 92bd5375b..801b60967 100644 --- a/packages/react-server/core/components/RootElement.js +++ b/packages/react-server/core/components/RootElement.js @@ -1,4 +1,5 @@ var React = require('react'); +const PropTypes = require('prop-types'); var Q = require('q'); const {isTheFold} = require('./TheFold'); @@ -97,10 +98,10 @@ class RootElement extends React.Component { module.exports = RootElement; RootElement.propTypes = { - listen: React.PropTypes.func, - when: React.PropTypes.object, // A promise. - childProps: React.PropTypes.object, - _isRootElement: React.PropTypes.bool, + listen: PropTypes.func, + when: PropTypes.object, // A promise. + childProps: PropTypes.object, + _isRootElement: PropTypes.bool, } RootElement.defaultProps = { diff --git a/packages/react-server/package.json b/packages/react-server/package.json index 7071fd1a2..978fa9046 100644 --- a/packages/react-server/package.json +++ b/packages/react-server/package.json @@ -39,8 +39,8 @@ "winston": "^2.3.0" }, "peerDependencies": { - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "superagent": "1.8.4" }, "devDependencies": { @@ -69,8 +69,8 @@ "gulp-sourcemaps": "^2.2.0", "memory-stream": "0.0.3", "minimist": "^1.2.0", - "react": "~0.14.2 || ^15.1.0", - "react-dom": "~0.14.2 || ^15.1.0", + "react": "~0.14.2 || ^15.1.0 || ^16.0.0", + "react-dom": "~0.14.2 || ^15.1.0 || ^16.0.0", "react-server-gulp-module-tagger": "^0.6.0", "rimraf": "^2.5.4", "superagent": "^3.1.0"