From da63b4b0eaef621201999f3f33eeb7b7d1d7e88b Mon Sep 17 00:00:00 2001 From: simchaNielsen <56388545+simchaNielsen@users.noreply.github.com> Date: Tue, 26 Jan 2021 14:23:07 +0200 Subject: [PATCH] test(native-filters): scoping tree in native filters modal (#12655) * test: add test to scoping tree in native filters * test: rename mocks --- .../spec/fixtures/mockDashboardLayout.js | 43 +++++++ superset-frontend/spec/fixtures/mockStore.js | 17 ++- .../nativeFilters/FilterScope_spec.tsx | 110 ++++++++++++++++++ .../nativeFilters/ScopingTree_spec.tsx | 61 ---------- 4 files changed, 169 insertions(+), 62 deletions(-) create mode 100644 superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterScope_spec.tsx delete mode 100644 superset-frontend/spec/javascripts/dashboard/components/nativeFilters/ScopingTree_spec.tsx diff --git a/superset-frontend/spec/fixtures/mockDashboardLayout.js b/superset-frontend/spec/fixtures/mockDashboardLayout.js index 6e2862639..bd1f4d186 100644 --- a/superset-frontend/spec/fixtures/mockDashboardLayout.js +++ b/superset-frontend/spec/fixtures/mockDashboardLayout.js @@ -189,6 +189,49 @@ export const dashboardLayoutWithTabs = { future: [], }; +export const dashboardLayoutWithChartsInTabsAndRoot = { + ...dashboardLayoutWithTabs, + present: { + ...dashboardLayoutWithTabs.present, + [DASHBOARD_ROOT_ID]: { + type: DASHBOARD_ROOT_TYPE, + id: DASHBOARD_ROOT_ID, + children: ['TABS_ID', 'ROW_ID3'], + }, + + ROW_ID3: { + ...newComponentFactory(ROW_TYPE), + id: 'ROW_ID3', + children: ['CHART_ID3'], + parents: ['ROOT_ID'], + }, + + CHART_ID2: { + ...newComponentFactory(CHART_TYPE), + id: 'CHART_ID2', + parents: ['ROOT_ID', 'TABS_ID', 'TAB_ID2', 'ROW_ID2'], + meta: { + chartId: 20, + width: 3, + height: 10, + chartName: 'Mock chart name 2', + }, + }, + + CHART_ID3: { + ...newComponentFactory(CHART_TYPE), + id: 'CHART_ID3', + parents: ['ROOT_ID', 'ROW_ID3'], + meta: { + chartId: 19, + width: 3, + height: 10, + chartName: 'Mock chart name', + }, + }, + }, +}; + export const filterComponent = { ...newComponentFactory(CHART_TYPE), id: 'CHART-rwDfbGqeEn', diff --git a/superset-frontend/spec/fixtures/mockStore.js b/superset-frontend/spec/fixtures/mockStore.js index faf083389..f4aad15b4 100644 --- a/superset-frontend/spec/fixtures/mockStore.js +++ b/superset-frontend/spec/fixtures/mockStore.js @@ -22,7 +22,10 @@ import thunk from 'redux-thunk'; import rootReducer from 'src/dashboard/reducers/index'; import mockState from './mockState'; -import { dashboardLayoutWithTabs } from './mockDashboardLayout'; +import { + dashboardLayoutWithTabs, + dashboardLayoutWithChartsInTabsAndRoot, +} from './mockDashboardLayout'; import { sliceId } from './mockChartQueries'; import { dashboardFilters } from './mockDashboardFilters'; import { nativeFilters } from './mockNativeFilters'; @@ -47,7 +50,19 @@ export const getMockStoreWithTabs = () => compose(applyMiddleware(thunk)), ); +export const getMockStoreWithChartsInTabsAndRoot = () => + createStore( + rootReducer, + { + ...mockState, + dashboardLayout: dashboardLayoutWithChartsInTabsAndRoot, + dashboardFilters: {}, + }, + compose(applyMiddleware(thunk)), + ); + export const mockStoreWithTabs = getMockStoreWithTabs(); +export const mockStoreWithChartsInTabsAndRoot = getMockStoreWithChartsInTabsAndRoot(); export const sliceIdWithAppliedFilter = sliceId + 1; export const sliceIdWithRejectedFilter = sliceId + 2; diff --git a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterScope_spec.tsx b/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterScope_spec.tsx new file mode 100644 index 000000000..2d3eb3e07 --- /dev/null +++ b/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/FilterScope_spec.tsx @@ -0,0 +1,110 @@ +/** + * 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 { Provider } from 'react-redux'; +import { render, screen, fireEvent } from 'spec/helpers/testing-library'; +import { mockStoreWithChartsInTabsAndRoot } from 'spec/fixtures/mockStore'; +import { Form, FormInstance } from 'src/common/components'; +import { NativeFiltersForm } from 'src/dashboard/components/nativeFilters/types'; +import FilterConfigForm from 'src/dashboard/components/nativeFilters/FilterConfigForm'; + +describe('FilterScope', () => { + const save = jest.fn(); + let form: FormInstance; + const mockedProps = { + filterId: 'DefaultFilterId', + restore: jest.fn(), + parentFilters: [], + save, + }; + + const MockModal = ({ scope }: { scope: object | undefined }) => { + const [newForm] = Form.useForm(); + form = newForm; + if (scope) { + form.setFieldsValue({ + filters: { + [mockedProps.filterId]: { + scope, + }, + }, + }); + } + return ( + +
+ + +
+ ); + }; + + const getWrapper = (scope?: object) => { + render(); + }; + + const getTreeSwitcher = (order = 0) => + document.querySelectorAll('.ant-tree-switcher')[order]; + + it('renders "apply to all" filter scope', () => { + getWrapper(); + expect(screen.queryByRole('tree')).toBe(null); + }); + + it('select tree values with 1 excluded', () => { + getWrapper(); + fireEvent.click(screen.getByLabelText('Apply to specific panels')); + expect(screen.getByRole('tree')).not.toBe(null); + fireEvent.click(getTreeSwitcher(2)); + fireEvent.click(screen.getByText('CHART_ID2')); + expect(form.getFieldValue('filters')?.[mockedProps.filterId].scope).toEqual( + { + excluded: [20], + rootPath: ['ROOT_ID'], + }, + ); + }); + + it('select 1 value only', () => { + getWrapper(); + fireEvent.click(screen.getByLabelText('Apply to specific panels')); + expect(screen.getByRole('tree')).not.toBe(null); + fireEvent.click(getTreeSwitcher(2)); + fireEvent.click(screen.getByText('CHART_ID2')); + fireEvent.click(screen.getByText('tab1')); + expect(form.getFieldValue('filters')?.[mockedProps.filterId].scope).toEqual( + { + excluded: [18, 20], + rootPath: ['ROOT_ID'], + }, + ); + }); + + it('correct init tree with values', () => { + getWrapper({ + rootPath: ['TAB_ID'], + excluded: [], + }); + fireEvent.click(screen.getByLabelText('Apply to specific panels')); + expect(screen.getByRole('tree')).not.toBe(null); + expect(document.querySelectorAll('.ant-tree-checkbox-checked').length).toBe( + 1, + ); + }); +}); diff --git a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/ScopingTree_spec.tsx b/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/ScopingTree_spec.tsx deleted file mode 100644 index e26305855..000000000 --- a/superset-frontend/spec/javascripts/dashboard/components/nativeFilters/ScopingTree_spec.tsx +++ /dev/null @@ -1,61 +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 { Provider } from 'react-redux'; -import ScopingTree from 'src/dashboard/components/nativeFilters/ScopingTree'; -import { styledMount as mount } from 'spec/helpers/theming'; -import { mockStore } from 'spec/fixtures/mockStore'; -import { FormInstance } from 'src/common/components'; -import { NativeFiltersForm } from 'src/dashboard/components/nativeFilters/types'; -import { getDefaultScopeValue } from 'src/dashboard/components/nativeFilters/FilterScope'; - -describe('ScopingTree', () => { - const filterId = '1'; - const form = { - getFieldValue: () => ({ - [filterId]: { - scope: getDefaultScopeValue(), - }, - }), - }; - const wrapper = mount( - - } - /> - , - ); - it('is valid', () => { - expect( - React.isValidElement( - } - />, - ), - ).toBe(true); - }); - - it('renders a tree', () => { - expect(wrapper.find('TreeNode')).toExist(); - }); -}); -- GitLab