manually triggering update in componentWillReceiveProps to resize also if value is changed programmatically

1 files changed, 26 insertions, 4 deletions

diff --git a/src/TextareaAutosize.js b/src/TextareaAutosize.js
index f4ab8ff..3916ee9 100644
--- a/src/TextareaAutosize.js
+++ b/src/TextareaAutosize.js
@@ -1,7 +1,10 @@
 'use strict';
 
 const React = require('react'),
-  autosize = require('autosize');
+  autosize = require('autosize'),
+  UPDATE = 'autosize:update',
+  DESTROY = 'autosize:destroy',
+  RESIZED = 'autosize:resized';
 
 const TextareaAutosize = React.createClass({
 
@@ -18,13 +21,26 @@ const TextareaAutosize = React.createClass({
   componentDidMount() {
     autosize(this.refs.textarea.getDOMNode());
     if (this.props.onResize) {
-      this.refs.textarea.getDOMNode().addEventListener('autosize:resized', this.props.onResize);
+      this.refs.textarea.getDOMNode().addEventListener(RESIZED, this.props.onResize);
     }
   },
 
   componentWillUnmount() {
     if (this.props.onResize) {
-      this.refs.textarea.getDOMNode().removeEventListener('autosize:resized');
+      this.refs.textarea.getDOMNode().removeEventListener(RESIZED);
+    }
+    this.dispatchEvent(DESTROY);
+  },
+
+  dispatchEvent(EVENT_TYPE) {
+    const event = document.createEvent('Event');
+    event.initEvent(EVENT_TYPE, true, false);
+    setTimeout(() => this.refs.textarea.getDOMNode().dispatchEvent(event));
+  },
+
+  getValue(props) {
+    if (props) {
+      return props.valueLink ? props.valueLink.value : props.value;
     }
   },
 
@@ -34,7 +50,13 @@ const TextareaAutosize = React.createClass({
         {this.props.children}
       </textarea>
     );
-  }
+  },
+
+  componentWillReceiveProps(nextProps) {
+    if (this.getValue(nextProps) !== this.getValue(this.props)) {
+      this.dispatchEvent(UPDATE);
+    }
+  },
 
 });