mirror of
https://github.com/apache/superset.git
synced 2026-04-19 08:04:53 +00:00
Fix SQL Lab window resizing layout bug (#7615)
This commit is contained in:
@@ -20,10 +20,19 @@ import React from 'react';
|
||||
import { shallow } from 'enzyme';
|
||||
|
||||
import { defaultQueryEditor, initialState, queries, table } from './fixtures';
|
||||
import {
|
||||
SQL_EDITOR_GUTTER_HEIGHT,
|
||||
SQL_EDITOR_GUTTER_MARGIN,
|
||||
SQL_TOOLBAR_HEIGHT,
|
||||
} from '../../../src/SqlLab/constants';
|
||||
import AceEditorWrapper from '../../../src/SqlLab/components/AceEditorWrapper';
|
||||
import LimitControl from '../../../src/SqlLab/components/LimitControl';
|
||||
import SouthPane from '../../../src/SqlLab/components/SouthPane';
|
||||
import SqlEditor from '../../../src/SqlLab/components/SqlEditor';
|
||||
import SqlEditorLeftBar from '../../../src/SqlLab/components/SqlEditorLeftBar';
|
||||
|
||||
const MOCKED_SQL_EDITOR_HEIGHT = 500;
|
||||
|
||||
describe('SqlEditor', () => {
|
||||
const mockedProps = {
|
||||
actions: {},
|
||||
@@ -40,7 +49,7 @@ describe('SqlEditor', () => {
|
||||
};
|
||||
|
||||
beforeAll(() => {
|
||||
jest.spyOn(SqlEditor.prototype, 'getSqlEditorHeight').mockImplementation(() => 500);
|
||||
jest.spyOn(SqlEditor.prototype, 'getSqlEditorHeight').mockImplementation(() => MOCKED_SQL_EDITOR_HEIGHT);
|
||||
});
|
||||
|
||||
it('is valid', () => {
|
||||
@@ -52,6 +61,33 @@ describe('SqlEditor', () => {
|
||||
const wrapper = shallow(<SqlEditor {...mockedProps} />);
|
||||
expect(wrapper.find(SqlEditorLeftBar)).toHaveLength(1);
|
||||
});
|
||||
it('render an AceEditorWrapper', () => {
|
||||
const wrapper = shallow(<SqlEditor {...mockedProps} />);
|
||||
expect(wrapper.find(AceEditorWrapper)).toHaveLength(1);
|
||||
});
|
||||
it('render an SouthPane', () => {
|
||||
const wrapper = shallow(<SqlEditor {...mockedProps} />);
|
||||
expect(wrapper.find(SouthPane)).toHaveLength(1);
|
||||
});
|
||||
it('does not overflow the editor window', () => {
|
||||
const wrapper = shallow(<SqlEditor {...mockedProps} />);
|
||||
const totalSize = parseFloat(wrapper.find(AceEditorWrapper).props().height)
|
||||
+ wrapper.find(SouthPane).props().height
|
||||
+ SQL_TOOLBAR_HEIGHT
|
||||
+ (SQL_EDITOR_GUTTER_MARGIN * 2)
|
||||
+ SQL_EDITOR_GUTTER_HEIGHT;
|
||||
expect(totalSize).toEqual(MOCKED_SQL_EDITOR_HEIGHT);
|
||||
});
|
||||
it('does not overflow the editor window after resizing', () => {
|
||||
const wrapper = shallow(<SqlEditor {...mockedProps} />);
|
||||
wrapper.setState({ height: 450 });
|
||||
const totalSize = parseFloat(wrapper.find(AceEditorWrapper).props().height)
|
||||
+ wrapper.find(SouthPane).props().height
|
||||
+ SQL_TOOLBAR_HEIGHT
|
||||
+ (SQL_EDITOR_GUTTER_MARGIN * 2)
|
||||
+ SQL_EDITOR_GUTTER_HEIGHT;
|
||||
expect(totalSize).toEqual(450);
|
||||
});
|
||||
it('render a LimitControl with default limit', () => {
|
||||
const defaultQueryLimit = 101;
|
||||
const updatedProps = { ...mockedProps, defaultQueryLimit };
|
||||
|
||||
Reference in New Issue
Block a user