mirror of https://github.com/apache/superset.git
test: Adds tests to the OptionControls component (#13729)
This commit is contained in:
parent
ec5d2f5f32
commit
6fd62e3f7e
|
@ -26,7 +26,7 @@ import AdhocFilter, {
|
||||||
EXPRESSION_TYPES,
|
EXPRESSION_TYPES,
|
||||||
CLAUSES,
|
CLAUSES,
|
||||||
} from 'src/explore/components/controls/FilterControl/AdhocFilter';
|
} from 'src/explore/components/controls/FilterControl/AdhocFilter';
|
||||||
import { LabelsContainer } from 'src/explore/components/OptionControls';
|
import { LabelsContainer } from 'src/explore/components/controls/OptionControls';
|
||||||
import { AGGREGATES, OPERATORS } from 'src/explore/constants';
|
import { AGGREGATES, OPERATORS } from 'src/explore/constants';
|
||||||
import AdhocFilterControl from 'src/explore/components/controls/FilterControl/AdhocFilterControl';
|
import AdhocFilterControl from 'src/explore/components/controls/FilterControl/AdhocFilterControl';
|
||||||
import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
|
import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
|
||||||
|
|
|
@ -22,7 +22,7 @@ import sinon from 'sinon';
|
||||||
import { shallow } from 'enzyme';
|
import { shallow } from 'enzyme';
|
||||||
|
|
||||||
import { AGGREGATES } from 'src/explore/constants';
|
import { AGGREGATES } from 'src/explore/constants';
|
||||||
import { LabelsContainer } from 'src/explore/components/OptionControls';
|
import { LabelsContainer } from 'src/explore/components/controls/OptionControls';
|
||||||
import { supersetTheme } from '@superset-ui/core';
|
import { supersetTheme } from '@superset-ui/core';
|
||||||
import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
|
import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
|
||||||
import AdhocMetric, {
|
import AdhocMetric, {
|
||||||
|
|
|
@ -1,69 +0,0 @@
|
||||||
/**
|
|
||||||
* Licensed to the Apache Software Foundation (ASF) under one
|
|
||||||
* or more contributor license agreements. See the NOTICE file
|
|
||||||
* distributed with this work for additional information
|
|
||||||
* regarding copyright ownership. The ASF licenses this file
|
|
||||||
* to you under the Apache License, Version 2.0 (the
|
|
||||||
* "License"); you may not use this file except in compliance
|
|
||||||
* with the License. You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
import React from 'react';
|
|
||||||
import { ThemeProvider, supersetTheme } from '@superset-ui/core';
|
|
||||||
import { DndProvider } from 'react-dnd';
|
|
||||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
|
||||||
import { render, screen } from 'spec/helpers/testing-library';
|
|
||||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
|
||||||
import { noOp } from 'src/utils/common';
|
|
||||||
|
|
||||||
const setup = (overrides?: Record<string, any>) => {
|
|
||||||
const props = {
|
|
||||||
label: <span>Test label</span>,
|
|
||||||
onRemove: noOp,
|
|
||||||
onMoveLabel: noOp,
|
|
||||||
onDropLabel: noOp,
|
|
||||||
type: 'test',
|
|
||||||
index: 0,
|
|
||||||
...overrides,
|
|
||||||
};
|
|
||||||
return render(
|
|
||||||
<ThemeProvider theme={supersetTheme}>
|
|
||||||
<DndProvider backend={HTML5Backend}>
|
|
||||||
<OptionControlLabel {...props} />
|
|
||||||
</DndProvider>
|
|
||||||
</ThemeProvider>,
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
describe('OptionControls', () => {
|
|
||||||
it('should render', () => {
|
|
||||||
const { container } = setup();
|
|
||||||
expect(container).toBeVisible();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should display a label', () => {
|
|
||||||
setup();
|
|
||||||
expect(screen.getByText('Test label')).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should display a certification icon if saved metric is certified', () => {
|
|
||||||
const { container } = setup({
|
|
||||||
savedMetric: {
|
|
||||||
metric_name: 'test_metric',
|
|
||||||
is_certified: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
screen.getByText('test_metric');
|
|
||||||
expect(screen.queryByText('Test label')).toBeFalsy();
|
|
||||||
|
|
||||||
expect(container.querySelector('.metric-option > svg')).toBeInTheDocument();
|
|
||||||
});
|
|
||||||
});
|
|
|
@ -24,7 +24,7 @@ import {
|
||||||
AddControlLabel,
|
AddControlLabel,
|
||||||
DndLabelsContainer,
|
DndLabelsContainer,
|
||||||
HeaderContainer,
|
HeaderContainer,
|
||||||
} from 'src/explore/components/OptionControls';
|
} from 'src/explore/components/controls/OptionControls';
|
||||||
import { DatasourcePanelDndItem } from 'src/explore/components/DatasourcePanel/types';
|
import { DatasourcePanelDndItem } from 'src/explore/components/DatasourcePanel/types';
|
||||||
import Icon from 'src/components/Icon';
|
import Icon from 'src/components/Icon';
|
||||||
import { DndColumnSelectProps } from './types';
|
import { DndColumnSelectProps } from './types';
|
||||||
|
|
|
@ -24,7 +24,7 @@ import {
|
||||||
CloseContainer,
|
CloseContainer,
|
||||||
OptionControlContainer,
|
OptionControlContainer,
|
||||||
Label,
|
Label,
|
||||||
} from 'src/explore/components/OptionControls';
|
} from 'src/explore/components/controls/OptionControls';
|
||||||
import { OptionProps } from '../types';
|
import { OptionProps } from '../types';
|
||||||
|
|
||||||
export default function Option(props: OptionProps) {
|
export default function Option(props: OptionProps) {
|
||||||
|
|
|
@ -23,10 +23,10 @@ import {
|
||||||
DropTargetMonitor,
|
DropTargetMonitor,
|
||||||
DragSourceMonitor,
|
DragSourceMonitor,
|
||||||
} from 'react-dnd';
|
} from 'react-dnd';
|
||||||
import { DragContainer } from 'src/explore/components/OptionControls';
|
import { DragContainer } from 'src/explore/components/controls/OptionControls';
|
||||||
|
import { DndItemType } from 'src/explore/components/DndItemType';
|
||||||
import Option from './Option';
|
import Option from './Option';
|
||||||
import { OptionProps, OptionItemInterface } from '../types';
|
import { OptionProps, OptionItemInterface } from '../types';
|
||||||
import { DndItemType } from '../../../DndItemType';
|
|
||||||
|
|
||||||
export default function OptionWrapper(
|
export default function OptionWrapper(
|
||||||
props: OptionProps & { type: DndItemType },
|
props: OptionProps & { type: DndItemType },
|
||||||
|
|
|
@ -37,7 +37,7 @@ import {
|
||||||
AddIconButton,
|
AddIconButton,
|
||||||
HeaderContainer,
|
HeaderContainer,
|
||||||
LabelsContainer,
|
LabelsContainer,
|
||||||
} from 'src/explore/components/OptionControls';
|
} from 'src/explore/components/controls/OptionControls';
|
||||||
import Icon from 'src/components/Icon';
|
import Icon from 'src/components/Icon';
|
||||||
import columnType from './columnType';
|
import columnType from './columnType';
|
||||||
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
||||||
|
|
|
@ -19,11 +19,11 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
|
import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
|
||||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
import { OptionControlLabel } from 'src/explore/components/controls/OptionControls';
|
||||||
|
import { DndItemType } from 'src/explore/components/DndItemType';
|
||||||
import columnType from './columnType';
|
import columnType from './columnType';
|
||||||
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
||||||
import AdhocFilter from './AdhocFilter';
|
import AdhocFilter from './AdhocFilter';
|
||||||
import { DndItemType } from '../../DndItemType';
|
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
adhocFilter: PropTypes.instanceOf(AdhocFilter).isRequired,
|
adhocFilter: PropTypes.instanceOf(AdhocFilter).isRequired,
|
||||||
|
|
|
@ -18,12 +18,12 @@
|
||||||
*/
|
*/
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
import { OptionControlLabel } from 'src/explore/components/controls/OptionControls';
|
||||||
|
import { DndItemType } from 'src/explore/components/DndItemType';
|
||||||
import columnType from './columnType';
|
import columnType from './columnType';
|
||||||
import AdhocMetric from './AdhocMetric';
|
import AdhocMetric from './AdhocMetric';
|
||||||
import savedMetricType from './savedMetricType';
|
import savedMetricType from './savedMetricType';
|
||||||
import AdhocMetricPopoverTrigger from './AdhocMetricPopoverTrigger';
|
import AdhocMetricPopoverTrigger from './AdhocMetricPopoverTrigger';
|
||||||
import { DndItemType } from '../../DndItemType';
|
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
adhocMetric: PropTypes.instanceOf(AdhocMetric),
|
adhocMetric: PropTypes.instanceOf(AdhocMetric),
|
||||||
|
|
|
@ -32,7 +32,7 @@ import {
|
||||||
AddControlLabel,
|
AddControlLabel,
|
||||||
HeaderContainer,
|
HeaderContainer,
|
||||||
LabelsContainer,
|
LabelsContainer,
|
||||||
} from 'src/explore/components/OptionControls';
|
} from 'src/explore/components/controls/OptionControls';
|
||||||
import columnType from './columnType';
|
import columnType from './columnType';
|
||||||
import MetricDefinitionOption from './MetricDefinitionOption';
|
import MetricDefinitionOption from './MetricDefinitionOption';
|
||||||
import MetricDefinitionValue from './MetricDefinitionValue';
|
import MetricDefinitionValue from './MetricDefinitionValue';
|
||||||
|
|
|
@ -0,0 +1,143 @@
|
||||||
|
/**
|
||||||
|
* Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
* or more contributor license agreements. See the NOTICE file
|
||||||
|
* distributed with this work for additional information
|
||||||
|
* regarding copyright ownership. The ASF licenses this file
|
||||||
|
* to you under the Apache License, Version 2.0 (the
|
||||||
|
* "License"); you may not use this file except in compliance
|
||||||
|
* with the License. You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
import React from 'react';
|
||||||
|
import { render, screen, fireEvent } from 'spec/helpers/testing-library';
|
||||||
|
import { DndProvider } from 'react-dnd';
|
||||||
|
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||||
|
import {
|
||||||
|
OptionControlLabel,
|
||||||
|
DragContainer,
|
||||||
|
OptionControlContainer,
|
||||||
|
Label,
|
||||||
|
CaretContainer,
|
||||||
|
CloseContainer,
|
||||||
|
HeaderContainer,
|
||||||
|
LabelsContainer,
|
||||||
|
DndLabelsContainer,
|
||||||
|
AddControlLabel,
|
||||||
|
AddIconButton,
|
||||||
|
} from 'src/explore/components/controls/OptionControls';
|
||||||
|
|
||||||
|
const defaultProps = {
|
||||||
|
label: <span>Test label</span>,
|
||||||
|
onRemove: jest.fn(),
|
||||||
|
onMoveLabel: jest.fn(),
|
||||||
|
onDropLabel: jest.fn(),
|
||||||
|
type: 'test',
|
||||||
|
index: 0,
|
||||||
|
};
|
||||||
|
|
||||||
|
const setup = (overrides?: Record<string, any>) =>
|
||||||
|
render(
|
||||||
|
<DndProvider backend={HTML5Backend}>
|
||||||
|
<OptionControlLabel {...defaultProps} {...overrides} />
|
||||||
|
</DndProvider>,
|
||||||
|
);
|
||||||
|
|
||||||
|
test('should render', () => {
|
||||||
|
const { container } = setup();
|
||||||
|
expect(container).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should display a label', () => {
|
||||||
|
setup();
|
||||||
|
expect(screen.getByText('Test label')).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should display a certification icon if saved metric is certified', () => {
|
||||||
|
const { container } = setup({
|
||||||
|
savedMetric: {
|
||||||
|
metric_name: 'test_metric',
|
||||||
|
is_certified: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
screen.getByText('test_metric');
|
||||||
|
expect(screen.queryByText('Test label')).toBeFalsy();
|
||||||
|
expect(container.querySelector('.metric-option > svg')).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('triggers onMoveLabel on drop', () => {
|
||||||
|
render(
|
||||||
|
<DndProvider backend={HTML5Backend}>
|
||||||
|
<OptionControlLabel
|
||||||
|
{...defaultProps}
|
||||||
|
index={1}
|
||||||
|
label={<span>Label 1</span>}
|
||||||
|
/>
|
||||||
|
<OptionControlLabel
|
||||||
|
{...defaultProps}
|
||||||
|
index={2}
|
||||||
|
label={<span>Label 2</span>}
|
||||||
|
/>
|
||||||
|
</DndProvider>,
|
||||||
|
);
|
||||||
|
fireEvent.dragStart(screen.getByText('Label 1'));
|
||||||
|
fireEvent.drop(screen.getByText('Label 2'));
|
||||||
|
expect(defaultProps.onMoveLabel).toHaveBeenCalled();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders DragContainer', () => {
|
||||||
|
const { container } = render(<DragContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders OptionControlContainer', () => {
|
||||||
|
const { container } = render(<OptionControlContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders Label', () => {
|
||||||
|
const { container } = render(<Label />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders CaretContainer', () => {
|
||||||
|
const { container } = render(<CaretContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders CloseContainer', () => {
|
||||||
|
const { container } = render(<CloseContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders HeaderContainer', () => {
|
||||||
|
const { container } = render(<HeaderContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders LabelsContainer', () => {
|
||||||
|
const { container } = render(<LabelsContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders DndLabelsContainer', () => {
|
||||||
|
const { container } = render(<DndLabelsContainer />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders AddControlLabel', () => {
|
||||||
|
const { container } = render(<AddControlLabel />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('renders AddIconButton', () => {
|
||||||
|
const { container } = render(<AddIconButton />);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
});
|
|
@ -26,7 +26,7 @@ import {
|
||||||
import { Tooltip } from 'src/common/components/Tooltip';
|
import { Tooltip } from 'src/common/components/Tooltip';
|
||||||
import Icon from 'src/components/Icon';
|
import Icon from 'src/components/Icon';
|
||||||
import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
|
import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
|
||||||
import AdhocMetric from './controls/MetricControl/AdhocMetric';
|
import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
|
||||||
|
|
||||||
export const DragContainer = styled.div`
|
export const DragContainer = styled.div`
|
||||||
margin-bottom: ${({ theme }) => theme.gridUnit}px;
|
margin-bottom: ${({ theme }) => theme.gridUnit}px;
|
Loading…
Reference in New Issue