From 6fd62e3f7e9c0250001c371e09421e8098a3ce51 Mon Sep 17 00:00:00 2001 From: "Michael S. Molina" <70410625+michael-s-molina@users.noreply.github.com> Date: Wed, 31 Mar 2021 22:07:22 -0300 Subject: [PATCH] test: Adds tests to the OptionControls component (#13729) --- .../components/AdhocFilterControl_spec.jsx | 2 +- .../components/MetricsControl_spec.jsx | 2 +- .../components/OptionControls_spec.tsx | 69 --------- .../DndColumnSelectControl/DndSelectLabel.tsx | 2 +- .../components/Option.tsx | 2 +- .../components/OptionWrapper.tsx | 4 +- .../FilterControl/AdhocFilterControl.jsx | 2 +- .../FilterControl/AdhocFilterOption.jsx | 4 +- .../MetricControl/AdhocMetricOption.jsx | 4 +- .../controls/MetricControl/MetricsControl.jsx | 2 +- .../OptionControls/OptionControls.test.tsx | 143 ++++++++++++++++++ .../OptionControls/index.tsx} | 2 +- 12 files changed, 156 insertions(+), 82 deletions(-) delete mode 100644 superset-frontend/spec/javascripts/explore/components/OptionControls_spec.tsx create mode 100644 superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx rename superset-frontend/src/explore/components/{OptionControls.tsx => controls/OptionControls/index.tsx} (99%) diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx index 9b310bda9e6b1..0ca726d8583d7 100644 --- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx +++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx @@ -26,7 +26,7 @@ import AdhocFilter, { EXPRESSION_TYPES, CLAUSES, } 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 AdhocFilterControl from 'src/explore/components/controls/FilterControl/AdhocFilterControl'; import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric'; diff --git a/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx index 60017e26a8566..1536313759fcd 100644 --- a/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx +++ b/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx @@ -22,7 +22,7 @@ import sinon from 'sinon'; import { shallow } from 'enzyme'; 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 MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl'; import AdhocMetric, { diff --git a/superset-frontend/spec/javascripts/explore/components/OptionControls_spec.tsx b/superset-frontend/spec/javascripts/explore/components/OptionControls_spec.tsx deleted file mode 100644 index a19ba9241c926..0000000000000 --- a/superset-frontend/spec/javascripts/explore/components/OptionControls_spec.tsx +++ /dev/null @@ -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) => { - const props = { - label: Test label, - onRemove: noOp, - onMoveLabel: noOp, - onDropLabel: noOp, - type: 'test', - index: 0, - ...overrides, - }; - return render( - - - - - , - ); -}; - -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(); - }); -}); diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx index c316d5c5750ee..9589d2e725f41 100644 --- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx +++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx @@ -24,7 +24,7 @@ import { AddControlLabel, DndLabelsContainer, HeaderContainer, -} from 'src/explore/components/OptionControls'; +} from 'src/explore/components/controls/OptionControls'; import { DatasourcePanelDndItem } from 'src/explore/components/DatasourcePanel/types'; import Icon from 'src/components/Icon'; import { DndColumnSelectProps } from './types'; diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/Option.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/Option.tsx index ce7cba099eefb..7afd96cc0173c 100644 --- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/Option.tsx +++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/Option.tsx @@ -24,7 +24,7 @@ import { CloseContainer, OptionControlContainer, Label, -} from 'src/explore/components/OptionControls'; +} from 'src/explore/components/controls/OptionControls'; import { OptionProps } from '../types'; export default function Option(props: OptionProps) { diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/OptionWrapper.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/OptionWrapper.tsx index be700bfbe2ce8..f1520aa3a41b1 100644 --- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/OptionWrapper.tsx +++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/components/OptionWrapper.tsx @@ -23,10 +23,10 @@ import { DropTargetMonitor, DragSourceMonitor, } 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 { OptionProps, OptionItemInterface } from '../types'; -import { DndItemType } from '../../../DndItemType'; export default function OptionWrapper( props: OptionProps & { type: DndItemType }, diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx index a487a543d27f8..cea9ffed6dcc9 100644 --- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx +++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx @@ -37,7 +37,7 @@ import { AddIconButton, HeaderContainer, LabelsContainer, -} from 'src/explore/components/OptionControls'; +} from 'src/explore/components/controls/OptionControls'; import Icon from 'src/components/Icon'; import columnType from './columnType'; import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger'; diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx index d593c0369eaed..4c866875b170b 100644 --- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx +++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx @@ -19,11 +19,11 @@ import React from 'react'; import PropTypes from 'prop-types'; 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 AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger'; import AdhocFilter from './AdhocFilter'; -import { DndItemType } from '../../DndItemType'; const propTypes = { adhocFilter: PropTypes.instanceOf(AdhocFilter).isRequired, diff --git a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx index cf390d5c6a0fc..9a9fd2002a93a 100644 --- a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx +++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx @@ -18,12 +18,12 @@ */ import React from 'react'; 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 AdhocMetric from './AdhocMetric'; import savedMetricType from './savedMetricType'; import AdhocMetricPopoverTrigger from './AdhocMetricPopoverTrigger'; -import { DndItemType } from '../../DndItemType'; const propTypes = { adhocMetric: PropTypes.instanceOf(AdhocMetric), diff --git a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx index d40a114ea3f91..fbf04152cf3b2 100644 --- a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx +++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx @@ -32,7 +32,7 @@ import { AddControlLabel, HeaderContainer, LabelsContainer, -} from 'src/explore/components/OptionControls'; +} from 'src/explore/components/controls/OptionControls'; import columnType from './columnType'; import MetricDefinitionOption from './MetricDefinitionOption'; import MetricDefinitionValue from './MetricDefinitionValue'; diff --git a/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx b/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx new file mode 100644 index 0000000000000..9e3a91bf96f27 --- /dev/null +++ b/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx @@ -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: Test label, + onRemove: jest.fn(), + onMoveLabel: jest.fn(), + onDropLabel: jest.fn(), + type: 'test', + index: 0, +}; + +const setup = (overrides?: Record) => + render( + + + , + ); + +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( + + Label 1} + /> + Label 2} + /> + , + ); + fireEvent.dragStart(screen.getByText('Label 1')); + fireEvent.drop(screen.getByText('Label 2')); + expect(defaultProps.onMoveLabel).toHaveBeenCalled(); +}); + +test('renders DragContainer', () => { + const { container } = render(); + expect(container).toBeInTheDocument(); +}); + +test('renders OptionControlContainer', () => { + const { container } = render(); + expect(container).toBeInTheDocument(); +}); + +test('renders Label', () => { + const { container } = render(