diff --git a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterBar_spec.tsx b/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterBar_spec.tsx deleted file mode 100644 index ccd29e198a225..0000000000000 --- a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterBar_spec.tsx +++ /dev/null @@ -1,50 +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 { styledMount as mount } from 'spec/helpers/theming'; -import { Provider } from 'react-redux'; -import FilterBar from 'src/dashboard/components/nativeFilters/FilterBar/FilterBar'; -import Button from 'src/components/Button'; -import { mockStore } from 'spec/fixtures/mockStore'; - -describe('FilterBar', () => { - const props = { - filtersOpen: false, - toggleFiltersBar: jest.fn(), - }; - - const wrapper = mount( - - - , - ); - - it('is a valid', () => { - expect(React.isValidElement()).toBe(true); - }); - it('has filter and collapse icons', () => { - expect(wrapper.find({ name: 'filter' })).toExist(); - expect(wrapper.find({ name: 'collapse' })).toExist(); - }); - it('has apply and clear all buttons', () => { - expect(wrapper.find(Button).length).toBe(2); - expect(wrapper.find(Button).at(0)).toHaveProp('buttonStyle', 'tertiary'); - expect(wrapper.find(Button).at(1)).toHaveProp('buttonStyle', 'primary'); - }); -}); diff --git a/superset-frontend/spec/javascripts/dashboard/fixtures/mockNativeFilters.ts b/superset-frontend/spec/javascripts/dashboard/fixtures/mockNativeFilters.ts index aaef255674f62..e598560083c0b 100644 --- a/superset-frontend/spec/javascripts/dashboard/fixtures/mockNativeFilters.ts +++ b/superset-frontend/spec/javascripts/dashboard/fixtures/mockNativeFilters.ts @@ -19,8 +19,28 @@ import { DataMaskStateWithId, DataMaskType } from 'src/dataMask/types'; import { NativeFiltersState } from 'src/dashboard/reducers/types'; +export const mockDataMaskInfo: DataMaskStateWithId = { + [DataMaskType.CrossFilters]: {}, + [DataMaskType.OwnFilters]: {}, + [DataMaskType.NativeFilters]: { + DefaultsID: { + id: 'DefaultId', + currentState: { + value: [], + }, + }, + }, +}; + export const nativeFiltersInfo: NativeFiltersState = { - filterSets: {}, + filterSets: { + 'set-id': { + id: 'DefaultsID', + name: 'Set name', + nativeFilters: {}, + dataMask: mockDataMaskInfo, + }, + }, filters: { DefaultsID: { cascadeParentIds: [], @@ -49,16 +69,3 @@ export const nativeFiltersInfo: NativeFiltersState = { }, }, }; - -export const mockDataMaskInfo: DataMaskStateWithId = { - [DataMaskType.CrossFilters]: {}, - [DataMaskType.OwnFilters]: {}, - [DataMaskType.NativeFilters]: { - DefaultsID: { - id: 'DefaultId', - currentState: { - value: [], - }, - }, - }, -}; diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx index b532b3b449d0d..463a7700fd2a8 100644 --- a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx +++ b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx @@ -49,7 +49,7 @@ import { DASHBOARD_ROOT_DEPTH, DashboardStandaloneMode, } from 'src/dashboard/util/constants'; -import FilterBar from '../nativeFilters/FilterBar/FilterBar'; +import FilterBar from 'src/dashboard/components/nativeFilters/FilterBar'; import { StickyVerticalBar } from '../StickyVerticalBar'; import { shouldFocusTabs, getRootLevelTabsComponent } from './utils'; import { useFilters } from '../nativeFilters/FilterBar/state'; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterBar.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterBar.test.tsx new file mode 100644 index 0000000000000..a942e2516af2d --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterBar.test.tsx @@ -0,0 +1,86 @@ +/** + * 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 } from 'spec/helpers/testing-library'; +import userEvent from '@testing-library/user-event'; +import { mockStore } from 'spec/fixtures/mockStore'; +import { Provider } from 'react-redux'; +import FilterBar, { FiltersBarProps } from '.'; + +const createProps = () => ({ + filtersOpen: false, + toggleFiltersBar: jest.fn(), +}); + +const setup = (props: FiltersBarProps) => ( + + + +); + +test('should render', () => { + const mockedProps = createProps(); + const { container } = render(setup(mockedProps)); + expect(container).toBeInTheDocument(); +}); + +test('should render the "Filters" heading', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Filters')).toBeInTheDocument(); +}); + +test('should render the "Clear all" option', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Clear all')).toBeInTheDocument(); +}); + +test('should render the "Apply" option', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Apply')).toBeInTheDocument(); +}); + +test('should render the collapse icon', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByRole('img', { name: 'collapse' })).toBeInTheDocument(); +}); + +test('should render the filter icon', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByRole('img', { name: 'filter' })).toBeInTheDocument(); +}); + +test('should render the filter control name', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('test')).toBeInTheDocument(); +}); + +test('should toggle', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + const collapse = screen.getByRole('img', { name: 'collapse' }); + expect(mockedProps.toggleFiltersBar).not.toHaveBeenCalled(); + userEvent.click(collapse); + expect(mockedProps.toggleFiltersBar).toHaveBeenCalled(); +}); diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/FilterConfigurationLink.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/FilterConfigurationLink.test.tsx new file mode 100644 index 0000000000000..363a30f423f31 --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/FilterConfigurationLink.test.tsx @@ -0,0 +1,49 @@ +/** + * 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 } from 'spec/helpers/testing-library'; +import userEvent from '@testing-library/user-event'; +import FilterConfigurationLink from '.'; + +test('should render', () => { + const { container } = render( + Config link, + { + useRedux: true, + }, + ); + expect(container).toBeInTheDocument(); +}); + +test('should render the config link text', () => { + render(Config link, { + useRedux: true, + }); + expect(screen.getByText('Config link')).toBeInTheDocument(); +}); + +test('should render the modal on click', () => { + render(Config link, { + useRedux: true, + }); + const configLink = screen.getByText('Config link'); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + userEvent.click(configLink); + expect(screen.getByRole('dialog')).toBeInTheDocument(); +}); diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/index.tsx similarity index 89% rename from superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink.tsx rename to superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/index.tsx index 875cbfc1aee77..db125d7960929 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink/index.tsx @@ -19,8 +19,8 @@ import React, { useState } from 'react'; import { useDispatch } from 'react-redux'; import { setFilterConfiguration } from 'src/dashboard/actions/nativeFilters'; -import { FilterConfiguration } from '../types'; -import { FiltersConfigModal } from '../FiltersConfigModal/FiltersConfigModal'; +import { FilterConfiguration } from 'src/dashboard/components/nativeFilters/types'; +import { FiltersConfigModal } from 'src/dashboard/components/nativeFilters/FiltersConfigModal/FiltersConfigModal'; export interface FCBProps { createNewOnOpen?: boolean; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.test.tsx new file mode 100644 index 0000000000000..d98bbe774388e --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.test.tsx @@ -0,0 +1,113 @@ +/** + * 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 } from 'spec/helpers/testing-library'; +import userEvent from '@testing-library/user-event'; +import { mockStore } from 'spec/fixtures/mockStore'; +import { Provider } from 'react-redux'; +import EditSection, { EditSectionProps } from './EditSection'; + +const createProps = () => ({ + filterSetId: 'set-id', + dataMaskSelected: { + DefaultsID: { + currentState: { + value: 'value', + }, + }, + }, + onCancel: jest.fn(), + disabled: false, +}); + +const setup = (props: EditSectionProps) => ( + + + +); + +test('should render', () => { + const mockedProps = createProps(); + const { container } = render(setup(mockedProps)); + expect(container).toBeInTheDocument(); +}); + +test('should render the title', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Editing filter set:')).toBeInTheDocument(); +}); + +test('should render the set name', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Set name')).toBeInTheDocument(); +}); + +test('should render a textbox', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByRole('textbox')).toBeInTheDocument(); +}); + +test('should change the set name', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + const textbox = screen.getByRole('textbox'); + userEvent.clear(textbox); + userEvent.type(textbox, 'New name'); + expect(textbox).toHaveValue('New name'); +}); + +test('should render the enter icon', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByRole('img', { name: 'enter' })).toBeInTheDocument(); +}); + +test('should render the Cancel button', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Cancel')).toBeInTheDocument(); +}); + +test('should cancel', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + const cancelBtn = screen.getByText('Cancel'); + expect(mockedProps.onCancel).not.toHaveBeenCalled(); + userEvent.click(cancelBtn); + expect(mockedProps.onCancel).toHaveBeenCalled(); +}); + +test('should render the Save button', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Save')).toBeInTheDocument(); +}); + +test('should render the Save button as disabled', () => { + const mockedProps = createProps(); + const saveDisabledProps = { + ...mockedProps, + disabled: true, + }; + render(setup(saveDisabledProps)); + expect(screen.getByText('Save').parentElement).toBeDisabled(); +}); diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.tsx index 60f42a203d336..5ab5a03337b98 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/EditSection.tsx @@ -58,7 +58,7 @@ const ActionButton = styled.div<{ disabled?: boolean }>` } `; -type EditSectionProps = { +export type EditSectionProps = { filterSetId: string; dataMaskSelected: DataMaskUnit; onCancel: HandlerFunction; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.test.tsx new file mode 100644 index 0000000000000..a5e34432cd7f1 --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.test.tsx @@ -0,0 +1,100 @@ +/** + * 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 } from 'spec/helpers/testing-library'; +import { mockStore } from 'spec/fixtures/mockStore'; +import { Provider } from 'react-redux'; +import userEvent from '@testing-library/user-event'; +import FilterSetUnit, { FilterSetUnitProps } from './FilterSetUnit'; + +const createProps = () => ({ + editMode: true, + setFilterSetName: jest.fn(), + onDelete: jest.fn(), + onEdit: jest.fn(), + onRebuild: jest.fn(), +}); + +function openDropdown() { + const dropdownIcon = screen.getByRole('img', { name: 'ellipsis' }); + userEvent.click(dropdownIcon); +} + +const setup = (props: FilterSetUnitProps) => ( + + + +); + +test('should render', () => { + const mockedProps = createProps(); + const { container } = render(setup(mockedProps)); + expect(container).toBeInTheDocument(); +}); + +test('should render the edit button', () => { + const mockedProps = createProps(); + const editModeOffProps = { + ...mockedProps, + editMode: false, + }; + render(setup(editModeOffProps)); + expect(screen.getByRole('button', { name: 'Edit' })).toBeInTheDocument(); +}); + +test('should render the menu', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + openDropdown(); + expect(screen.getByRole('menu')).toBeInTheDocument(); + expect(screen.getAllByRole('menuitem')).toHaveLength(3); + expect(screen.getByText('Edit')).toBeInTheDocument(); + expect(screen.getByText('Rebuild')).toBeInTheDocument(); + expect(screen.getByText('Delete')).toBeInTheDocument(); +}); + +test('should edit', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + openDropdown(); + const editBtn = screen.getByText('Edit'); + expect(mockedProps.onEdit).not.toHaveBeenCalled(); + userEvent.click(editBtn); + expect(mockedProps.onEdit).toHaveBeenCalled(); +}); + +test('should delete', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + openDropdown(); + const deleteBtn = screen.getByText('Delete'); + expect(mockedProps.onDelete).not.toHaveBeenCalled(); + userEvent.click(deleteBtn); + expect(mockedProps.onDelete).toHaveBeenCalled(); +}); + +test('should rebuild', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + openDropdown(); + const rebuildBtn = screen.getByText('Rebuild'); + expect(mockedProps.onRebuild).not.toHaveBeenCalled(); + userEvent.click(rebuildBtn); + expect(mockedProps.onRebuild).toHaveBeenCalled(); +}); diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx index 344cef091f367..6181205ab8069 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx @@ -40,7 +40,7 @@ const IconsBlock = styled.div` } `; -type FilterSetUnitProps = { +export type FilterSetUnitProps = { editMode?: boolean; isApplied?: boolean; filterSet?: FilterSet; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSets.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSets.test.tsx new file mode 100644 index 0000000000000..104fb7aebdcff --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSets.test.tsx @@ -0,0 +1,67 @@ +/** + * 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 } from 'spec/helpers/testing-library'; +import { mockStore } from 'spec/fixtures/mockStore'; +import { Provider } from 'react-redux'; +import FilterSets, { FilterSetsProps } from '.'; + +const createProps = () => ({ + disabled: false, + isFilterSetChanged: false, + dataMaskSelected: { + DefaultsID: { + currentState: { + value: 'value', + }, + }, + }, + onEditFilterSet: jest.fn(), + onFilterSelectionChange: jest.fn(), +}); + +const setup = (props: FilterSetsProps) => ( + + + +); + +test('should render', () => { + const mockedProps = createProps(); + const { container } = render(setup(mockedProps)); + expect(container).toBeInTheDocument(); +}); + +test('should render the default title', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('New filter set')).toBeInTheDocument(); +}); + +test('should render the right number of filters', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Filters (1)')).toBeInTheDocument(); +}); + +test('should render the filters', () => { + const mockedProps = createProps(); + render(setup(mockedProps)); + expect(screen.getByText('Set name')).toBeInTheDocument(); +}); diff --git a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterConfigurationLink_spec.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.test.tsx similarity index 52% rename from superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterConfigurationLink_spec.tsx rename to superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.test.tsx index 5382ec5cf2d0e..7e40e5625a6b1 100644 --- a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterConfigurationLink_spec.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.test.tsx @@ -17,29 +17,38 @@ * under the License. */ import React from 'react'; -import { styledMount as mount } from 'spec/helpers/theming'; -import { Provider } from 'react-redux'; -import FilterConfigurationLink from 'src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink'; +import { render, screen } from 'spec/helpers/testing-library'; import { mockStore } from 'spec/fixtures/mockStore'; +import { Provider } from 'react-redux'; +import FiltersHeader, { FiltersHeaderProps } from './FiltersHeader'; + +const mockedProps = { + dataMask: { + DefaultsID: { + currentState: { + value: 'value', + }, + }, + }, +}; +const setup = (props: FiltersHeaderProps) => ( + + + +); + +test('should render', () => { + const { container } = render(setup(mockedProps)); + expect(container).toBeInTheDocument(); +}); + +test('should render the right number of filters', () => { + render(setup(mockedProps)); + expect(screen.getByText('Filters (1)')).toBeInTheDocument(); +}); -describe('FilterConfigurationButton', () => { - const mockedProps = { - createNewOnOpen: false, - }; - it('is valid', () => { - expect( - React.isValidElement(), - ).toBe(true); - }); - it('takes in children', () => { - const wrapper = mount( - - - {' '} - Test - - , - ); - expect(wrapper.find('span')).toHaveLength(1); - }); +test('should render the name and value', () => { + render(setup(mockedProps)); + expect(screen.getByText('test:')).toBeInTheDocument(); + expect(screen.getByText('value')).toBeInTheDocument(); }); diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.tsx index fb5a66d51878c..04cd86b1de063 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FiltersHeader.tsx @@ -54,7 +54,7 @@ const StyledCollapse = styled(Collapse)` } `; -type FiltersHeaderProps = { +export type FiltersHeaderProps = { dataMask?: DataMaskUnit; filterSet?: FilterSet; }; @@ -93,8 +93,9 @@ const FiltersHeader: FC = ({ dataMask, filterSet }) => { t('Filter metadata changed in dashboard. It will not be applied.')) } placement="bottomLeft" + key={id} > -
+
{name}:  diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/Footer.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/Footer.test.tsx new file mode 100644 index 0000000000000..b1a2638e7e004 --- /dev/null +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/Footer.test.tsx @@ -0,0 +1,94 @@ +/** + * 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 userEvent from '@testing-library/user-event'; +import { render, screen } from 'spec/helpers/testing-library'; +import Footer from './Footer'; + +const createProps = () => ({ + filterSetName: 'Set name', + disabled: false, + editMode: false, + onCancel: jest.fn(), + onEdit: jest.fn(), + onCreate: jest.fn(), +}); + +const editModeProps = { + ...createProps(), + editMode: true, +}; + +test('should render', () => { + const mockedProps = createProps(); + const { container } = render(