diff --git a/superset-frontend/src/SqlLab/components/SqlEditor/SqlEditor.test.jsx b/superset-frontend/src/SqlLab/components/SqlEditor/SqlEditor.test.jsx
index 9dcc37fdd188a..67f25d4d396c1 100644
--- a/superset-frontend/src/SqlLab/components/SqlEditor/SqlEditor.test.jsx
+++ b/superset-frontend/src/SqlLab/components/SqlEditor/SqlEditor.test.jsx
@@ -25,6 +25,7 @@ import thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import fetchMock from 'fetch-mock';
import {
+ SET_QUERY_EDITOR_SQL_DEBOUNCE_MS,
SQL_EDITOR_GUTTER_HEIGHT,
SQL_EDITOR_GUTTER_MARGIN,
SQL_TOOLBAR_HEIGHT,
@@ -43,8 +44,14 @@ import {
jest.mock('src/components/AsyncAceEditor', () => ({
...jest.requireActual('src/components/AsyncAceEditor'),
- FullSQLEditor: props => (
-
{JSON.stringify(props)}
+ FullSQLEditor: ({ onChange, onBlur, value }) => (
+
),
}));
jest.mock('src/SqlLab/components/SqlEditorLeftBar', () => () => (
@@ -166,10 +173,8 @@ describe('SqlEditor', () => {
},
}),
);
-
- expect(await findByTestId('react-ace')).toHaveTextContent(
- JSON.stringify({ value: expectedSql }).slice(1, -1),
- );
+ const editor = await findByTestId('react-ace');
+ expect(editor).toHaveValue(expectedSql);
});
it('render a SouthPane', async () => {
@@ -179,6 +184,28 @@ describe('SqlEditor', () => {
).toBeInTheDocument();
});
+ it('triggers setQueryEditorAndSaveSql with debounced call to avoid performance regression', async () => {
+ const { findByTestId } = setup(mockedProps, store);
+ const editor = await findByTestId('react-ace');
+ const sql = 'select *';
+ fireEvent.change(editor, { target: { value: sql } });
+ // Verify no immediate sql update triggered
+ expect(
+ store.getActions().filter(({ type }) => type === 'QUERY_EDITOR_SET_SQL'),
+ ).toHaveLength(0);
+ await waitFor(
+ () =>
+ expect(
+ store
+ .getActions()
+ .filter(({ type }) => type === 'QUERY_EDITOR_SET_SQL'),
+ ).toHaveLength(1),
+ {
+ timeout: SET_QUERY_EDITOR_SQL_DEBOUNCE_MS + 100,
+ },
+ );
+ });
+
it('runs query action with ctas false', async () => {
const expectedStore = mockStore({
...initialState,
diff --git a/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx b/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
index 83286e588136f..ba6d89511d1b5 100644
--- a/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
+++ b/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
@@ -49,7 +49,6 @@ import {
persistEditorHeight,
postStopQuery,
queryEditorSetAutorun,
- queryEditorSetSql,
queryEditorSetAndSaveSql,
queryEditorSetTemplateParams,
runQueryFromSqlEditor,
@@ -456,7 +455,6 @@ const SqlEditor = ({
);
const onSqlChanged = sql => {
- dispatch(queryEditorSetSql(queryEditor, sql));
setQueryEditorAndSaveSqlWithDebounce(sql);
// Request server-side validation of the query text
if (canValidateQuery()) {