mirror of
https://github.com/apache/superset.git
synced 2026-04-18 23:55:00 +00:00
Migrates Collapse component from Bootstrap to AntD (#12920)
This commit is contained in:
committed by
GitHub
parent
e4a0233181
commit
9a05d6afe5
@@ -21,12 +21,13 @@ import { mount, shallow } from 'enzyme';
|
||||
import { Provider } from 'react-redux';
|
||||
import configureStore from 'redux-mock-store';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import Collapse from 'src/common/components/Collapse';
|
||||
|
||||
import { IconTooltip } from 'src/components/IconTooltip';
|
||||
import Fade from 'src/common/components/Fade';
|
||||
import TableElement from 'src/SqlLab/components/TableElement';
|
||||
import ColumnElement from 'src/SqlLab/components/ColumnElement';
|
||||
|
||||
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
|
||||
import { mockedActions, table } from './fixtures';
|
||||
|
||||
describe('TableElement', () => {
|
||||
@@ -43,9 +44,19 @@ describe('TableElement', () => {
|
||||
it('renders with props', () => {
|
||||
expect(React.isValidElement(<TableElement {...mockedProps} />)).toBe(true);
|
||||
});
|
||||
it('has 2 IconTooltip elements', () => {
|
||||
const wrapper = shallow(<TableElement {...mockedProps} />);
|
||||
expect(wrapper.find(IconTooltip)).toHaveLength(2);
|
||||
it('has 4 IconTooltip elements', () => {
|
||||
const wrapper = mount(
|
||||
<Provider store={store}>
|
||||
<TableElement {...mockedProps} />
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: {
|
||||
theme: supersetTheme,
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(wrapper.find(IconTooltip)).toHaveLength(4);
|
||||
});
|
||||
it('has 14 columns', () => {
|
||||
const wrapper = shallow(<TableElement {...mockedProps} />);
|
||||
@@ -64,20 +75,45 @@ describe('TableElement', () => {
|
||||
},
|
||||
);
|
||||
});
|
||||
it('fades table', () => {
|
||||
const wrapper = shallow(<TableElement {...mockedProps} />);
|
||||
expect(wrapper.state().hovered).toBe(false);
|
||||
it('fades table', async () => {
|
||||
const wrapper = mount(
|
||||
<Provider store={store}>
|
||||
<TableElement {...mockedProps} />
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: {
|
||||
theme: supersetTheme,
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(wrapper.find(TableElement).state().hovered).toBe(false);
|
||||
expect(wrapper.find(Fade).props().hovered).toBe(false);
|
||||
wrapper.find('div.TableElement').simulate('mouseEnter');
|
||||
expect(wrapper.state().hovered).toBe(true);
|
||||
wrapper.find('.header-container').hostNodes().simulate('mouseEnter');
|
||||
await waitForComponentToPaint(wrapper, 300);
|
||||
expect(wrapper.find(TableElement).state().hovered).toBe(true);
|
||||
expect(wrapper.find(Fade).props().hovered).toBe(true);
|
||||
});
|
||||
it('sorts columns', () => {
|
||||
const wrapper = shallow(<TableElement {...mockedProps} />);
|
||||
expect(wrapper.state().sortColumns).toBe(false);
|
||||
const wrapper = mount(
|
||||
<Provider store={store}>
|
||||
<Collapse>
|
||||
<TableElement {...mockedProps} />
|
||||
</Collapse>
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: {
|
||||
theme: supersetTheme,
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(wrapper.find(TableElement).state().sortColumns).toBe(false);
|
||||
wrapper.find('.header-container').hostNodes().simulate('click');
|
||||
expect(wrapper.find(ColumnElement).first().props().column.name).toBe('id');
|
||||
wrapper.find('.sort-cols').simulate('click');
|
||||
expect(wrapper.state().sortColumns).toBe(true);
|
||||
wrapper.find('.header-container').simulate('mouseEnter');
|
||||
wrapper.find('.sort-cols').hostNodes().simulate('click');
|
||||
expect(wrapper.find(TableElement).state().sortColumns).toBe(true);
|
||||
expect(wrapper.find(ColumnElement).first().props().column.name).toBe(
|
||||
'active',
|
||||
);
|
||||
@@ -99,10 +135,18 @@ describe('TableElement', () => {
|
||||
expect(mockedActions.collapseTable.called).toBe(true);
|
||||
});
|
||||
it('removes the table', () => {
|
||||
const wrapper = shallow(<TableElement {...mockedProps} />);
|
||||
expect(wrapper.state().expanded).toBe(true);
|
||||
wrapper.find('.table-remove').simulate('click');
|
||||
expect(wrapper.state().expanded).toBe(false);
|
||||
const wrapper = mount(
|
||||
<Provider store={store}>
|
||||
<TableElement {...mockedProps} />
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: {
|
||||
theme: supersetTheme,
|
||||
},
|
||||
},
|
||||
);
|
||||
wrapper.find('.table-remove').hostNodes().simulate('click');
|
||||
expect(mockedActions.removeDataPreview.called).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user