merge getInitialState in componentWillMount

It now uses object-assign instead of setState because of facebook/react#1740
brigand · Apr 20, 2015 · 346bcf8 · 346bcf8
1 parent c217de1
commit 346bcf8
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 7 deletions.
diff --git a/index.js b/index.js
@@ -1,4 +1,5 @@
 var mixin = require('smart-mixin');
+var assign = require('object-assign');
 
 var mixinProto = mixin({
   // lifecycle stuff is as you'd expect
@@ -26,15 +27,21 @@ function setInitialState(reactMixin) {
   var getInitialState = reactMixin.getInitialState;
   var componentWillMount = reactMixin.componentWillMount;
 
+  function applyInitialState(instance){
+      var state = instance.state || {};
+      assign(state, getInitialState.call(instance));
+      instance.state = state;
+  }
+
   if(getInitialState) {
     if(!componentWillMount) {
       reactMixin.componentWillMount = function() {
-        this.setState(getInitialState.call(this));
+          applyInitialState(this);
       };
     }
     else {
       reactMixin.componentWillMount = function() {
-        this.setState(getInitialState.call(this));
+        applyInitialState(this);
         componentWillMount.call(this);
       };
     }

diff --git a/package.json b/package.json
@@ -4,6 +4,7 @@
   "description": "",
   "main": "index.js",
   "dependencies": {
+    "object-assign": "^2.0.0",
     "smart-mixin": "^1.2.0"
   },
   "devDependencies": {

diff --git a/test/react-mixin.js b/test/react-mixin.js
@@ -10,6 +10,7 @@ describe('react-mixin', function(){
 
         beforeEach(function(){
             function Component(){
+                this.state = {foo: 'bar'}
             };
             Component.prototype = Object.create(React.Component);
             Component.prototype.constructor = Component;
@@ -44,6 +45,7 @@ describe('react-mixin', function(){
 
         beforeEach(function () {
             function Component(){
+                this.state = {foo: 'bar'};
             };
             Component.prototype = Object.create(React.Component);
             Component.prototype.constructor = Component;
@@ -114,10 +116,13 @@ describe('react-mixin', function(){
                 reactMixin.onClass(reactClass, mixin);
                 expect(reactClass.prototype.componentWillMount).to.exist;
 
-                Object.create(reactClass.prototype).componentWillMount();
+                var instance = new reactClass(); 
+                expect(instance.state).to.eql({foo: 'bar'});
+                instance.componentWillMount();
 
-                expect(reactClass.prototype.setState.calledOnce).to.be.true;
+                expect(reactClass.prototype.setState.calledOnce).to.be.false;
                 expect(reactClass.prototype.getInitialState).not.to.exist;
+                expect(instance.state).to.eql({foo: 'bar', test: 'test'});
             });
 
             it('merges two componentWillMount', function () {
@@ -135,9 +140,9 @@ describe('react-mixin', function(){
                 reactMixin.onClass(reactClass, mixin);
                 expect(reactClass.prototype.componentWillMount).to.exist;
 
-                Object.create(reactClass.prototype).componentWillMount();
+                new reactClass().componentWillMount();
 
-                expect(reactClass.prototype.setState.calledTwice).to.be.true
+                expect(reactClass.prototype.setState.calledOnce).to.be.true
                 expect(reactClass.prototype.getInitialState).not.to.exist;
             });
 
@@ -155,7 +160,7 @@ describe('react-mixin', function(){
 
                 reactMixin.onClass(reactClass, mixin);
 
-                var obj = Object.create(reactClass.prototype);
+                var obj = new reactClass();
                 obj.componentWillMount();
 
                 expect(obj.state.counter).to.be.eql(23);