diff --git a/superset-frontend/spec/javascripts/sqllab/SqlEditor_spec.jsx b/superset-frontend/spec/javascripts/sqllab/SqlEditor_spec.jsx index 2ba62687c81..cce5e1bfbe8 100644 --- a/superset-frontend/spec/javascripts/sqllab/SqlEditor_spec.jsx +++ b/superset-frontend/spec/javascripts/sqllab/SqlEditor_spec.jsx @@ -22,7 +22,7 @@ import { supersetTheme, ThemeProvider } from '@superset-ui/core'; import { Provider } from 'react-redux'; import thunk from 'redux-thunk'; import configureStore from 'redux-mock-store'; - +import fetchMock from 'fetch-mock'; import { SQL_EDITOR_GUTTER_HEIGHT, SQL_EDITOR_GUTTER_MARGIN, @@ -37,18 +37,24 @@ import { queryEditorSetFunctionNames, queryEditorSetSelectedText, } from 'src/SqlLab/actions/sqlLab'; - +import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint'; import { initialState, queries, table } from './fixtures'; const MOCKED_SQL_EDITOR_HEIGHT = 500; +fetchMock.get('glob:*/api/v1/database/*', {}); + const middlewares = [thunk]; const mockStore = configureStore(middlewares); const store = mockStore(initialState); describe('SqlEditor', () => { const mockedProps = { - actions: { queryEditorSetFunctionNames, queryEditorSetSelectedText }, + actions: { + queryEditorSetFunctionNames, + queryEditorSetSelectedText, + addDangerToast: jest.fn(), + }, database: {}, queryEditorId: initialState.sqlLab.queryEditors[0].id, latestQuery: queries[0], @@ -72,22 +78,26 @@ describe('SqlEditor', () => { }, ); - it('render a SqlEditorLeftBar', () => { + it('render a SqlEditorLeftBar', async () => { const wrapper = buildWrapper(); + await waitForComponentToPaint(wrapper); expect(wrapper.find(SqlEditorLeftBar)).toExist(); }); - it('render an AceEditorWrapper', () => { + it('render an AceEditorWrapper', async () => { const wrapper = buildWrapper(); + await waitForComponentToPaint(wrapper); expect(wrapper.find(AceEditorWrapper)).toExist(); }); - it('render a SouthPane', () => { + it('render a SouthPane', async () => { const wrapper = buildWrapper(); + await waitForComponentToPaint(wrapper); expect(wrapper.find(ConnectedSouthPane)).toExist(); }); // TODO eschutho convert tests to RTL // eslint-disable-next-line jest/no-disabled-tests - it.skip('does not overflow the editor window', () => { + it.skip('does not overflow the editor window', async () => { const wrapper = buildWrapper(); + await waitForComponentToPaint(wrapper); const totalSize = parseFloat(wrapper.find(AceEditorWrapper).props().height) + wrapper.find(ConnectedSouthPane).props().height + @@ -97,9 +107,10 @@ describe('SqlEditor', () => { expect(totalSize).toEqual(MOCKED_SQL_EDITOR_HEIGHT); }); // eslint-disable-next-line jest/no-disabled-tests - it.skip('does not overflow the editor window after resizing', () => { + it.skip('does not overflow the editor window after resizing', async () => { const wrapper = buildWrapper(); wrapper.setState({ height: 450 }); + await waitForComponentToPaint(wrapper); const totalSize = parseFloat(wrapper.find(AceEditorWrapper).props().height) + wrapper.find(ConnectedSouthPane).props().height + @@ -108,10 +119,11 @@ describe('SqlEditor', () => { SQL_EDITOR_GUTTER_HEIGHT; expect(totalSize).toEqual(450); }); - it('render a Limit Dropdown', () => { + it('render a Limit Dropdown', async () => { const defaultQueryLimit = 101; const updatedProps = { ...mockedProps, defaultQueryLimit }; const wrapper = buildWrapper(updatedProps); + await waitForComponentToPaint(wrapper); expect(wrapper.find(Dropdown)).toExist(); }); }); diff --git a/superset-frontend/src/SqlLab/components/SqlEditor.jsx b/superset-frontend/src/SqlLab/components/SqlEditor.jsx index ac79746fe4c..fb85482cf15 100644 --- a/superset-frontend/src/SqlLab/components/SqlEditor.jsx +++ b/superset-frontend/src/SqlLab/components/SqlEditor.jsx @@ -547,7 +547,10 @@ class SqlEditor extends React.PureComponent { return ( {[...new Set(LIMIT_DROPDOWN)].map(limit => ( - this.setQueryLimit(limit)}> + this.setQueryLimit(limit)} + > {/* // eslint-disable-line no-use-before-define */} {this.convertToNumWithSpaces(limit)}