Update for React v15.2.x

Author: taion

.eslintignore

@@ -27,3 +27,7 @@ build/Release
 # Dependency directory
 # https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
 node_modules
+
+# Build artifacts
+/examples/static
+/lib

.gitignore

@@ -121,9 +121,9 @@ const PropTable = React.createClass({
   },
 
   getType(prop) {
-    let type = prop.type || {};
-    let name = this.getDisplayTypeName(type.name);
-    let doclets = prop.doclets || {};
+    const type = prop.type || {};
+    const name = this.getDisplayTypeName(type.name);
+    const doclets = prop.doclets || {};
 
     switch (name) {
       case 'object':
@@ -139,9 +139,9 @@ const PropTable = React.createClass({
           return i === (list.length - 1) ? current : current.concat(' | ');
         }, []);
       case 'array':
-        let child = this.getType({ type: type.value });
-
-        return <span>{'array<'}{ child }{'>'}</span>;
+        return (
+          <span>{'array<'}{this.getType({ type: type.value })}{'>'}</span>
+        );
       case 'enum':
         return this.renderEnum(type);
       case 'custom':

examples/PropTable.js

@@ -1,9 +1,9 @@
-let webpack = require('webpack');
-let WebpackDevServer = require('webpack-dev-server');
-let config = require('../webpack/examples.config');
+import webpack from 'webpack';
+import WebpackDevServer from 'webpack-dev-server';
 
-new WebpackDevServer(webpack(config), {
+import config from '../webpack/examples.config';
 
+const server = new WebpackDevServer(webpack(config), {
   contentBase: 'examples',
   publicPath: '/static/',
   hot: true,
@@ -12,10 +12,14 @@ new WebpackDevServer(webpack(config), {
   stats: {
     colors: true
   }
-}).listen(3000, 'localhost', function (err) {
+});
+
+server.listen(3000, 'localhost', err => {
+  /* eslint-disable no-console */
   if (err) {
-    console.log(err);
+    console.error(err);
   }
 
   console.log('Listening at localhost:3000');
+  /* eslint-enable no-console */
 });

examples/server.js

@@ -24,13 +24,12 @@
     "clean": "rimraf lib",
     "clean:examples": "rimraf examples/static",
     "build": "npm run clean && babel src --out-dir lib",
-    "build:examples": "npm run clean:examples && babel-node ./webpack/run-webpack --config docs.config.js",
-    "examples": "npm run clean:examples && babel-node ./examples/server.js",
-    "lint": "eslint src test",
+    "build:examples": "npm run clean:examples && webpack --config webpack/docs.config.js",
+    "examples": "npm run clean:examples && babel-node examples/server.js",
+    "lint": "eslint examples/*.js src test *.js",
     "test": "npm run lint && npm run testonly",
     "testonly": "karma start --single-run",
     "tdd": "karma start",
-    "coverage": "COVERAGE=true npm run testonly",
     "release": "release"
   },
   "peerDependencies": {
@@ -41,7 +40,7 @@
     "@monastic.panic/component-playground": "^2.0.0",
     "babel": "^5.8.38",
     "babel-core": "^5.8.38",
-    "babel-eslint": "^6.1.0",
+    "babel-eslint": "^6.1.2",
     "babel-loader": "^5.4.0",
     "babel-plugin-object-assign": "^1.2.1",
     "chai": "^3.5.0",
@@ -71,11 +70,11 @@
     "mocha": "^2.5.3",
     "node-libs-browser": "^1.0.0",
     "raw-loader": "^0.5.1",
-    "react": "~15.1.0",
-    "react-addons-test-utils": "~15.1.0",
+    "react": "^15.2.1",
+    "react-addons-test-utils": "^15.2.1",
     "react-bootstrap": "^0.29.5",
     "react-component-metadata": "^2.1.1",
-    "react-dom": "~15.1.0",
+    "react-dom": "^15.2.1",
     "react-hot-loader": "^1.3.0",
     "release-script": "^1.0.2",
     "rimraf": "^2.5.3",

package.json

@@ -60,6 +60,7 @@ class Position extends React.Component {
     delete props.target;
     delete props.container;
     delete props.containerPadding;
+    delete props.shouldUpdatePosition;
 
     const child = React.Children.only(children);
     return cloneElement(

src/Position.js

@@ -1,13 +1,16 @@
+import jQuery from 'jquery';
 import React from 'react';
-import ReactDOM from 'react-dom';
 import ReactTestUtils from 'react-addons-test-utils';
-import Modal from '../src/Modal';
-import { render } from './helpers';
-import jquery from 'jquery';
+import ReactDOM from 'react-dom';
 import simulant from 'simulant';
+
+import Modal from '../src/Modal';
+
 import Transition from '../src/Transition';
 
-let $ = componentOrNode => jquery(ReactDOM.findDOMNode(componentOrNode));
+import { render, shouldWarn } from './helpers';
+
+const $ = componentOrNode => jQuery(ReactDOM.findDOMNode(componentOrNode));
 
 describe('Modal', function () {
   let mountPoint;
@@ -362,18 +365,15 @@ describe('Modal', function () {
     });
 
     it('Should warn if the modal content is not focusable', function () {
-      let Dialog = ()=> ({ render(){ return <div/>; } });
+      shouldWarn('The modal content node does not accept focus');
 
-      sinon.stub(console, 'error');
+      const Dialog = () => <div />;
 
       render(
         <Modal show>
           <Dialog />
         </Modal>
         , focusableContainer);
-
-      expect(console.error).to.have.been.calledOnce;
-      console.error.restore();
     });
   });
 

test/ModalSpec.js

@@ -9,10 +9,13 @@ import overlayPositionUtils from '../src/utils/overlayPositionUtils';
 import {render} from './helpers';
 
 describe('Position', function () {
+  // Swallow extra props.
+  const Span = () => <span />;
+
   it('Should output a child', function () {
     let instance = ReactTestUtils.renderIntoDocument(
       <Position>
-        <span>Text</span>
+        <Span>Text</Span>
       </Position>
     );
     assert.equal(ReactDOM.findDOMNode(instance).nodeName, 'SPAN');
@@ -22,8 +25,8 @@ describe('Position', function () {
     expect(() => {
       ReactTestUtils.renderIntoDocument(
         <Position>
-          <span>Text</span>
-          <span>Another Text</span>
+          <Span>Text</Span>
+          <Span>Another Text</Span>
         </Position>
       );
     }).to.throw(Error, /onlyChild must be passed a children with exactly one child/);
@@ -61,7 +64,7 @@ describe('Position', function () {
                 target={() => this.refs[this.state.target]}
                 fakeProp={this.state.fakeProp}
               >
-                <div />
+                <Span />
               </Position>
             </div>
           );
@@ -114,7 +117,7 @@ describe('Position', function () {
                 shouldUpdatePosition
                 fakeProp={this.state.fakeProp}
               >
-                <div />
+                <Span />
               </Position>
             </div>
           );

test/PositionSpec.js

@@ -246,13 +246,16 @@ describe('Transition', function () {
       }
 
       render() {
+        const { ...props } = this.props;
+        delete props.initialIn;
+
         return (
           <Transition
             ref="transition"
             unmountOnExit
             in={this.state.in}
             timeout={10}
-            {...this.props}
+            {...props}
           >
             <div />
           </Transition>

test/TransitionSpec.js

@@ -1,10 +1,8 @@
-import ReactDOM from 'react-dom';
 import { cloneElement } from 'react';
+import ReactDOM from 'react-dom';
 
 export function shouldWarn(about) {
-  console.warn.called.should.be.true;
-  console.warn.calledWithMatch(about).should.be.true;
-  console.warn.reset();
+  console.error.expected.push(about);
 }
 
 /**