Raw textarea now async

app/components/viewers/ResponseRaw.js

@@ -0,0 +1,50 @@
+import React, {Component, PropTypes} from 'react';
+
+class ResponseRaw extends Component {
+  _update (value) {
+    setTimeout(() => {
+      this._textarea.value = value;
+    }, 50)
+  }
+
+  componentDidUpdate () {
+    this._update(this.props.value)
+  }
+
+  componentDidMount () {
+    this._update(this.props.value)
+  }
+
+  shouldComponentUpdate (nextProps) {
+    for (let key in nextProps) {
+      if (nextProps.hasOwnProperty(key)) {
+        if (nextProps[key] !== this.props[key]) {
+          return true;
+        }
+      }
+    }
+
+    return false;
+  }
+
+  render () {
+    const {fontSize} = this.props;
+    return (
+      <textarea
+        ref={n => this._textarea = n}
+        placeholder="..."
+        className="force-wrap scrollable wide tall selectable monospace pad no-resize"
+        readOnly={true}
+        defaultValue=""
+        style={{fontSize}}>
+      </textarea>
+    );
+  }
+}
+
+ResponseRaw.propTypes = {
+  value: PropTypes.string.isRequired,
+  fontSize: PropTypes.number
+};
+
+export default ResponseRaw;

app/components/viewers/ResponseViewer.js

@@ -1,6 +1,7 @@
 import React, {Component, PropTypes} from 'react';
 import Editor from '../base/Editor';
 import ResponseWebview from './ResponseWebview';
+import ResponseRaw from './ResponseRaw';
 import ResponseError from './ResponseError';
 import {
   PREVIEW_MODE_FRIENDLY,
@@ -62,10 +63,10 @@ class ResponseViewer extends Component {
         );
       default: // Raw
         return (
-          <textarea className="scrollable wide tall selectable monospace pad no-resize"
+          <ResponseRaw
-                    defaultValue={body}
+            value={body}
-                    style={{fontSize: editorFontSize}}>
+            fontSize={editorFontSize}
-          </textarea>
+          />
         )
     }
   }