Merge pull request #32 from neezer/master

Upgrade for React 0.14

CHANGELOG.md

@@ -1,3 +1,9 @@
+## master (unreleased)
+
+- Upgrade for use with React 0.14
+- List `react` and `react-dom` as `dependencies` instead of `peerDependency`,
+  for NPM3 compatibility.
+
 ## 1.0.3
 
 - Replace `this.getDOMNode()` with `React.findDOMNode(this)`

build/npm/waypoint.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var React = require('react');
+var ReactDOM = require('react-dom');
 
 var PropTypes = React.PropTypes;
 
@@ -67,7 +68,7 @@ var Waypoint = React.createClass({
    *   as a fallback.
    */
   _findScrollableAncestor: function _findScrollableAncestor() {
-    var node = React.findDOMNode(this);
+    var node = ReactDOM.findDOMNode(this);
 
     while (node.parentNode) {
       node = node.parentNode;
@@ -142,7 +143,7 @@ var Waypoint = React.createClass({
    *   ancestor element.
    */
   _currentPosition: function _currentPosition() {
-    var waypointTop = this._distanceToTopOfScrollableAncestor(React.findDOMNode(this));
+    var waypointTop = this._distanceToTopOfScrollableAncestor(ReactDOM.findDOMNode(this));
     var contextHeight = undefined;
     var contextScrollTop = undefined;
 

package.json

@@ -28,7 +28,8 @@
   ],
   "license": "MIT",
   "peerDependencies": {
-    "react": "^0.13.0 || ^0.14.0-beta1"
+    "react": "^0.14.0",
+    "react-dom": "^0.14.0"
   },
   "devDependencies": {
     "babel": "^5.1.9",

spec/waypoint_spec.js

@@ -1,12 +1,13 @@
 const React = require('../node_modules/react/react.js');
+const ReactDOM = require('../node_modules/react-dom/index.js');
 const Waypoint = require('../src/waypoint.jsx');
 
 let div;
 
 const renderAttached = function(component) {
   div = document.createElement('div');
   document.body.appendChild(div);
-  const renderedComponent = React.render(component, div);
+  const renderedComponent = ReactDOM.render(component, div);
   return renderedComponent;
 };
 
@@ -54,7 +55,7 @@ describe('<Waypoint>', function() {
 
   afterEach(() => {
     if (div) {
-      React.unmountComponentAtNode(div);
+      ReactDOM.unmountComponentAtNode(div);
     }
   });
 
@@ -63,7 +64,7 @@ describe('<Waypoint>', function() {
       this.topSpacerHeight = 90;
       this.bottomSpacerHeight = 200;
       this.parentComponent = this.subject();
-      this.scrollable = this.parentComponent.getDOMNode();
+      this.scrollable = this.parentComponent;
     });
 
     it('calls the onEnter handler', () => {
@@ -74,17 +75,6 @@ describe('<Waypoint>', function() {
       expect(this.props.onLeave).not.toHaveBeenCalled();
     });
 
-    describe('when the waypoint is re-rendered', () => {
-      beforeEach(() => {
-        this.props.onEnter.calls.reset();
-        this.parentComponent.forceUpdate();
-      });
-
-      it('does not call the onEnter callback again', () => {
-        expect(this.props.onEnter).not.toHaveBeenCalled();
-      });
-    });
-
     describe('when scrolling while the waypoint is visible', () => {
       beforeEach(() => {
         scrollNodeTo(this.scrollable, this.topSpacerHeight / 2);
@@ -135,7 +125,7 @@ describe('<Waypoint>', function() {
 
     describe('when scrolling down just below the threshold', () => {
       beforeEach(() => {
-        scrollNodeTo(this.subject().getDOMNode(), 99);
+        scrollNodeTo(this.subject(), 99);
       });
 
       it('does not call the onEnter handler', () => {
@@ -149,7 +139,7 @@ describe('<Waypoint>', function() {
 
     describe('when scrolling down past the threshold', () => {
       beforeEach(() => {
-        scrollNodeTo(this.subject().getDOMNode(), 100);
+        scrollNodeTo(this.subject(), 100);
       });
 
       it('calls the onEnter handler', () => {
@@ -167,7 +157,7 @@ describe('<Waypoint>', function() {
       // though, and one after. We want to treat this as if the waypoint was
       // visible for a brief moment, and so we fire both onEnter and onLeave.
       beforeEach(() => {
-        scrollNodeTo(this.subject().getDOMNode(), 5000);
+        scrollNodeTo(this.subject(), 5000);
       });
 
       it('calls the onEnter handler', () => {
@@ -186,7 +176,7 @@ describe('<Waypoint>', function() {
 
       describe('when scrolling down just below the threshold', () => {
         beforeEach(() => {
-          scrollNodeTo(this.subject().getDOMNode(), 89);
+          scrollNodeTo(this.subject(), 89);
         });
 
         it('does not call the onEnter handler', () => {
@@ -200,7 +190,7 @@ describe('<Waypoint>', function() {
 
       describe('when scrolling down past the threshold', () => {
         beforeEach(() => {
-          scrollNodeTo(this.subject().getDOMNode(), 90);
+          scrollNodeTo(this.subject(), 90);
         });
 
         it('calls the onEnter handler', () => {
@@ -218,7 +208,7 @@ describe('<Waypoint>', function() {
     beforeEach(() => {
       this.topSpacerHeight = 200;
       this.bottomSpacerHeight = 200;
-      this.scrollable = this.subject().getDOMNode();
+      this.scrollable = this.subject();
 
       // Because of how we detect when a Waypoint is scrolled past without any
       // scroll event fired when it was visible, we need to reset callback

src/waypoint.jsx

@@ -1,4 +1,5 @@
 const React = require('react');
+const ReactDOM = require('react-dom');
 
 const { PropTypes } = React;
 
@@ -63,7 +64,7 @@ const Waypoint = React.createClass({
    *   as a fallback.
    */
   _findScrollableAncestor() {
-    let node = React.findDOMNode(this);
+    let node = ReactDOM.findDOMNode(this);
 
     while (node.parentNode) {
       node = node.parentNode;
@@ -146,7 +147,7 @@ const Waypoint = React.createClass({
    */
   _currentPosition() {
     const waypointTop =
-      this._distanceToTopOfScrollableAncestor(React.findDOMNode(this));
+      this._distanceToTopOfScrollableAncestor(ReactDOM.findDOMNode(this));
     let contextHeight;
     let contextScrollTop;