From 7bb867407af99060b8a4eb03a6d8bf8e15569abc Mon Sep 17 00:00:00 2001
From: Stephen Liu <750188453@qq.com>
Date: Tue, 25 Jan 2022 23:57:12 +0800
Subject: [PATCH] fix(textarea-control): ace editor input exception (#18146)

---
 .../src/explore/components/controls/TextAreaControl.jsx   | 6 +++++-
 .../explore/components/controls/TextAreaControl.test.jsx  | 8 ++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/explore/components/controls/TextAreaControl.jsx b/superset-frontend/src/explore/components/controls/TextAreaControl.jsx
index 62f9d76a186dc..d0f6503fc556b 100644
--- a/superset-frontend/src/explore/components/controls/TextAreaControl.jsx
+++ b/superset-frontend/src/explore/components/controls/TextAreaControl.jsx
@@ -63,6 +63,10 @@ export default class TextAreaControl extends React.Component {
     this.props.onChange(value);
   }
 
+  onAreaEditorChange(value) {
+    this.props.onChange(value);
+  }
+
   renderEditor(inModal = false) {
     const minLines = inModal ? 40 : this.props.minLines || 12;
     if (this.props.language) {
@@ -76,7 +80,6 @@ export default class TextAreaControl extends React.Component {
           style={style}
           minLines={minLines}
           maxLines={inModal ? 1000 : this.props.maxLines}
-          onChange={this.props.onChange}
           width="100%"
           height={`${minLines}em`}
           editorProps={{ $blockScrolling: true }}
@@ -84,6 +87,7 @@ export default class TextAreaControl extends React.Component {
           readOnly={this.props.readOnly}
           key={this.props.name}
           {...this.props}
+          onChange={this.onAreaEditorChange.bind(this)}
         />
       );
     }
diff --git a/superset-frontend/src/explore/components/controls/TextAreaControl.test.jsx b/superset-frontend/src/explore/components/controls/TextAreaControl.test.jsx
index 6dbc4b5bc3a7c..fbbe88c85904d 100644
--- a/superset-frontend/src/explore/components/controls/TextAreaControl.test.jsx
+++ b/superset-frontend/src/explore/components/controls/TextAreaControl.test.jsx
@@ -54,4 +54,12 @@ describe('TextArea', () => {
     expect(wrapper.find(TextArea)).not.toExist();
     expect(wrapper.find(TextAreaEditor)).toExist();
   });
+
+  it('calls onAreaEditorChange when entering in the AceEditor', () => {
+    const props = { ...defaultProps };
+    props.language = 'markdown';
+    wrapper = shallow(<TextAreaControl {...props} />);
+    wrapper.simulate('change', { target: { value: 'x' } });
+    expect(defaultProps.onChange.calledWith('x')).toBe(true);
+  });
 });