2021-10-28 06:27:35 -04:00
|
|
|
/*
|
|
|
|
* 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.
|
|
|
|
*/
|
|
|
|
|
2022-05-04 08:55:22 -04:00
|
|
|
import { Behavior, ChartProps, supersetTheme } from '@superset-ui/core';
|
2018-11-06 17:45:50 -05:00
|
|
|
|
|
|
|
const RAW_FORM_DATA = {
|
|
|
|
some_field: 1,
|
|
|
|
};
|
|
|
|
|
|
|
|
const RAW_DATASOURCE = {
|
2020-04-20 21:03:10 -04:00
|
|
|
column_formats: { test: '%s' },
|
2018-11-06 17:45:50 -05:00
|
|
|
};
|
|
|
|
|
2020-04-20 21:03:10 -04:00
|
|
|
const QUERY_DATA = { data: {} };
|
2020-12-29 05:10:39 -05:00
|
|
|
const QUERIES_DATA = [QUERY_DATA];
|
2024-01-31 20:40:44 -05:00
|
|
|
const BEHAVIORS = [Behavior.NativeFilter, Behavior.InteractiveChart];
|
2018-12-11 14:58:02 -05:00
|
|
|
|
2018-11-06 17:45:50 -05:00
|
|
|
describe('ChartProps', () => {
|
|
|
|
it('exists', () => {
|
|
|
|
expect(ChartProps).toBeDefined();
|
|
|
|
});
|
|
|
|
describe('new ChartProps({})', () => {
|
|
|
|
it('returns new instance', () => {
|
2018-12-11 14:58:02 -05:00
|
|
|
const props = new ChartProps({
|
|
|
|
width: 800,
|
|
|
|
height: 600,
|
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-12-11 14:58:02 -05:00
|
|
|
});
|
2018-11-06 17:45:50 -05:00
|
|
|
expect(props).toBeInstanceOf(ChartProps);
|
|
|
|
});
|
2018-12-11 14:58:02 -05:00
|
|
|
it('processes formData and datasource to convert field names to camelCase', () => {
|
|
|
|
const props = new ChartProps({
|
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
2020-04-30 16:50:06 -04:00
|
|
|
expect(props.formData.someField as number).toEqual(1);
|
2021-11-09 07:42:28 -05:00
|
|
|
expect(props.datasource.columnFormats).toEqual(
|
|
|
|
RAW_DATASOURCE.column_formats,
|
|
|
|
);
|
2018-11-06 17:45:50 -05:00
|
|
|
expect(props.rawFormData).toEqual(RAW_FORM_DATA);
|
|
|
|
expect(props.rawDatasource).toEqual(RAW_DATASOURCE);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
describe('ChartProps.createSelector()', () => {
|
|
|
|
const selector = ChartProps.createSelector();
|
|
|
|
it('returns a selector function', () => {
|
|
|
|
expect(selector).toBeInstanceOf(Function);
|
|
|
|
});
|
|
|
|
it('selector returns previous chartProps if all input fields do not change', () => {
|
|
|
|
const props1 = selector({
|
2018-12-11 14:58:02 -05:00
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2021-05-18 11:59:51 -04:00
|
|
|
behaviors: BEHAVIORS,
|
|
|
|
isRefreshing: false,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
|
|
|
const props2 = selector({
|
2018-12-11 14:58:02 -05:00
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2021-05-18 11:59:51 -04:00
|
|
|
behaviors: BEHAVIORS,
|
|
|
|
isRefreshing: false,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
|
|
|
expect(props1).toBe(props2);
|
|
|
|
});
|
2021-05-18 11:59:51 -04:00
|
|
|
it('selector returns a new chartProps if the 13th field changes', () => {
|
|
|
|
/** this test is here to test for selectors that exceed 12 arguments (
|
|
|
|
* isRefreshing is the 13th argument, which is missing TS declarations).
|
|
|
|
* See: https://github.com/reduxjs/reselect/issues/378
|
|
|
|
*/
|
|
|
|
|
|
|
|
const props1 = selector({
|
|
|
|
width: 800,
|
|
|
|
height: 600,
|
|
|
|
datasource: RAW_DATASOURCE,
|
|
|
|
formData: RAW_FORM_DATA,
|
|
|
|
queriesData: QUERIES_DATA,
|
|
|
|
behaviors: BEHAVIORS,
|
|
|
|
isRefreshing: false,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2021-05-18 11:59:51 -04:00
|
|
|
});
|
|
|
|
const props2 = selector({
|
|
|
|
width: 800,
|
|
|
|
height: 600,
|
|
|
|
datasource: RAW_DATASOURCE,
|
|
|
|
formData: RAW_FORM_DATA,
|
|
|
|
queriesData: QUERIES_DATA,
|
|
|
|
behaviors: BEHAVIORS,
|
|
|
|
isRefreshing: true,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2021-05-18 11:59:51 -04:00
|
|
|
});
|
|
|
|
expect(props1).not.toBe(props2);
|
|
|
|
});
|
2018-11-06 17:45:50 -05:00
|
|
|
it('selector returns a new chartProps if some input fields change', () => {
|
|
|
|
const props1 = selector({
|
2018-12-11 14:58:02 -05:00
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
|
|
|
const props2 = selector({
|
2018-12-11 14:58:02 -05:00
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: { new_field: 3 },
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
|
|
|
const props3 = selector({
|
2018-12-11 14:58:02 -05:00
|
|
|
width: 800,
|
|
|
|
height: 600,
|
2018-11-06 17:45:50 -05:00
|
|
|
datasource: RAW_DATASOURCE,
|
2018-12-11 14:58:02 -05:00
|
|
|
formData: RAW_FORM_DATA,
|
2020-12-29 05:10:39 -05:00
|
|
|
queriesData: QUERIES_DATA,
|
2022-05-04 08:55:22 -04:00
|
|
|
theme: supersetTheme,
|
2018-11-06 17:45:50 -05:00
|
|
|
});
|
|
|
|
expect(props1).not.toBe(props2);
|
|
|
|
expect(props1).not.toBe(props3);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|