MessageInput: clear body on submit correctly

react-use-form-state 0.10 feature

2 files changed, 19 insertions, 18 deletions

diff --git a/vnext/src/components/MessageInput.js b/vnext/src/components/MessageInput.js
index ef96b3b5..e4988d59 100644
--- a/vnext/src/components/MessageInput.js
+++ b/vnext/src/components/MessageInput.js
@@ -54,8 +54,7 @@ export default function MessageInput({ text, data, rows, children, onSend }) {
             to: data.to || {}
         });
         setAttach('');
-        formState.values.body = '';
-        textareaRef.current.value = '';
+        formState.clearField('body');
         textareaRef.current.style.height = '';
         updateFocus();
     };
diff --git a/vnext/src/components/__tests__/MessageInput-test.js b/vnext/src/components/__tests__/MessageInput-test.js
index 77a71d77..7ac69ed0 100644
--- a/vnext/src/components/__tests__/MessageInput-test.js
+++ b/vnext/src/components/__tests__/MessageInput-test.js
@@ -12,11 +12,11 @@ const testMessage = {
     to: {}
 };
 
-window.matchMedia = window.matchMedia || function() {
+window.matchMedia = window.matchMedia || function () {
     return {
         matches: true,
-        addListener: function() { },
-        removeListener: function() { }
+        addListener: function () { },
+        removeListener: function () { }
     };
 };
 
@@ -59,18 +59,23 @@ it('Submits on ctrl-enter', () => {
         });
     });
     let textarea = messageInput.root.findByType('textarea');
-    textarea.props.onKeyPress({
-        charCode: 13,
-        which: 13,
-        keyCode: 13,
-        ctrlKey: false
+    act(() => {
+
+        textarea.props.onKeyPress({
+            charCode: 13,
+            which: 13,
+            keyCode: 13,
+            ctrlKey: false
+        });
     });
     expect(onSend).toHaveBeenCalledTimes(0);
-    textarea.props.onKeyPress({
-        charCode: 13,
-        which: 13,
-        keyCode: 13,
-        ctrlKey: true
+    act(() => {
+        textarea.props.onKeyPress({
+            charCode: 13,
+            which: 13,
+            keyCode: 13,
+            ctrlKey: true
+        });
     });
     expect(onSend).toHaveBeenCalledTimes(1);
     expect(textarea.props.value).toEqual('');
@@ -83,11 +88,8 @@ it('Submits on ctrl-enter', () => {
         });
     });
     expect(textarea.props.value).toEqual(' ');
-    /*
-        TODO: waiting for react-use-form-state reset
     act(() => {
         messageInput.root.findByType('form').props.onSubmit({ event: {} });
     });
     expect(textarea.props.value).toEqual('', 'Value should be cleared after submit');
-    */
 });