mirror of
https://github.com/apache/superset.git
synced 2026-04-19 08:04:53 +00:00
refactor: Boostrap to AntD - Tabs (#14048)
This commit is contained in:
committed by
GitHub
parent
4410fd047e
commit
1d6a746a09
@@ -24,7 +24,7 @@ import fetchMock from 'fetch-mock';
|
||||
import { ParentSize } from '@vx/responsive';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import { Sticky, StickyContainer } from 'react-sticky';
|
||||
import { TabContainer, TabContent, TabPane } from 'react-bootstrap';
|
||||
import Tabs from 'src/components/Tabs';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
import BuilderComponentPane from 'src/dashboard/components/BuilderComponentPane';
|
||||
@@ -39,7 +39,10 @@ import {
|
||||
} from 'spec/fixtures/mockDashboardLayout';
|
||||
import { mockStoreWithTabs, storeWithState } from 'spec/fixtures/mockStore';
|
||||
import mockState from 'spec/fixtures/mockState';
|
||||
import { DASHBOARD_ROOT_ID } from 'src/dashboard/util/constants';
|
||||
import {
|
||||
DASHBOARD_ROOT_ID,
|
||||
DASHBOARD_GRID_ID,
|
||||
} from 'src/dashboard/util/constants';
|
||||
|
||||
fetchMock.get('glob:*/csstemplateasyncmodelview/api/read', {});
|
||||
|
||||
@@ -118,19 +121,17 @@ describe('DashboardBuilder', () => {
|
||||
});
|
||||
});
|
||||
|
||||
it('should render a TabContainer and TabContent', () => {
|
||||
it('should render one Tabs and two TabPane', () => {
|
||||
const wrapper = setup({ dashboardLayout: undoableDashboardLayoutWithTabs });
|
||||
const parentSize = wrapper.find(ParentSize);
|
||||
expect(parentSize.find(TabContainer)).toHaveLength(1);
|
||||
expect(parentSize.find(TabContent)).toHaveLength(1);
|
||||
expect(parentSize.find(Tabs)).toHaveLength(1);
|
||||
expect(parentSize.find(Tabs.TabPane)).toHaveLength(2);
|
||||
});
|
||||
|
||||
it('should set animation=true, mountOnEnter=true, and unmounOnExit=false on TabContainer for perf', () => {
|
||||
it('should set animated=true on Tabs for perf', () => {
|
||||
const wrapper = setup({ dashboardLayout: undoableDashboardLayoutWithTabs });
|
||||
const tabProps = wrapper.find(ParentSize).find(TabContainer).props();
|
||||
expect(tabProps.animation).toBe(true);
|
||||
expect(tabProps.mountOnEnter).toBe(true);
|
||||
expect(tabProps.unmountOnExit).toBe(false);
|
||||
const tabProps = wrapper.find(ParentSize).find(Tabs).props();
|
||||
expect(tabProps.animated).toBe(true);
|
||||
});
|
||||
|
||||
it('should render a TabPane and DashboardGrid for first Tab', () => {
|
||||
@@ -138,10 +139,10 @@ describe('DashboardBuilder', () => {
|
||||
const parentSize = wrapper.find(ParentSize);
|
||||
const expectedCount =
|
||||
undoableDashboardLayoutWithTabs.present.TABS_ID.children.length;
|
||||
expect(parentSize.find(TabPane)).toHaveLength(expectedCount);
|
||||
expect(parentSize.find(TabPane).first().find(DashboardGrid)).toHaveLength(
|
||||
1,
|
||||
);
|
||||
expect(parentSize.find(Tabs.TabPane)).toHaveLength(expectedCount);
|
||||
expect(
|
||||
parentSize.find(Tabs.TabPane).first().find(DashboardGrid),
|
||||
).toHaveLength(1);
|
||||
});
|
||||
|
||||
it('should render a TabPane and DashboardGrid for second Tab', () => {
|
||||
@@ -155,8 +156,10 @@ describe('DashboardBuilder', () => {
|
||||
const parentSize = wrapper.find(ParentSize);
|
||||
const expectedCount =
|
||||
undoableDashboardLayoutWithTabs.present.TABS_ID.children.length;
|
||||
expect(parentSize.find(TabPane)).toHaveLength(expectedCount);
|
||||
expect(parentSize.find(TabPane).at(1).find(DashboardGrid)).toHaveLength(1);
|
||||
expect(parentSize.find(Tabs.TabPane)).toHaveLength(expectedCount);
|
||||
expect(
|
||||
parentSize.find(Tabs.TabPane).at(1).find(DashboardGrid),
|
||||
).toHaveLength(1);
|
||||
});
|
||||
|
||||
it('should render a BuilderComponentPane if editMode=false and user selects "Insert Components" pane', () => {
|
||||
@@ -179,7 +182,7 @@ describe('DashboardBuilder', () => {
|
||||
dashboardLayout: undoableDashboardLayoutWithTabs,
|
||||
});
|
||||
|
||||
expect(wrapper.find(TabContainer).prop('activeKey')).toBe(0);
|
||||
expect(wrapper.find(Tabs).prop('activeKey')).toBe(DASHBOARD_GRID_ID);
|
||||
|
||||
wrapper
|
||||
.find('.dashboard-component-tabs .ant-tabs .ant-tabs-tab')
|
||||
|
||||
Reference in New Issue
Block a user