Skip to content

Commit

Permalink
[Lens] Removing updateVisualizationState updater (#113779)
Browse files Browse the repository at this point in the history 
* make editVisualizationAction separate action to get rid of updater

* add insertLayer to remove updater when inserting new Layer

* wip

* removeLayers before merging into one function

* chart switch refactor to single updater

* replace updater with newState

* check onEditAction

* remove layer remove updater

* addLayer updater

* set Layer Default Dimension

* wip

* mocks divided

* visualization mock lint fix

* add tests for layers

* further divide

* rename ts to tsx

* Rename index.tsx to index.ts

* Update x-pack/plugins/lens/public/state_management/index.ts

* Revert "[Lens] cleanup divide mock file to smaller pieces"

This reverts commit 1bb2e1a.

Co-authored-by: Kibana Machine <[email protected]>
  • Loading branch information
@mbondyra @kibanamachine
mbondyra and kibanamachine authored Nov 3, 2021
1 parent e1bf92c commit 2ad1f91
Show file tree
Hide file tree
Showing 14 changed files with 680 additions and 715 deletions.
203 changes: 85 additions & 118 deletions .../plugins/lens/public/editor_frame_service/editor_frame/config_panel/config_panel.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,13 @@

import React from 'react';
import { act } from 'react-dom/test-utils';
import { createMockFramePublicAPI, visualizationMap, datasourceMap } from '../../../mocks';
import {
createMockFramePublicAPI,
mockVisualizationMap,
mockDatasourceMap,
mockStoreDeps,
MountStoreProps,
} from '../../../mocks';
import { Visualization } from '../../../types';
import { LayerPanels } from './config_panel';
import { LayerPanel } from './layer_panel';
Expand All @@ -16,6 +22,7 @@ import { generateId } from '../../../id_generator';
import { mountWithProvider } from '../../../mocks';
import { layerTypes } from '../../../../common';
import { ReactWrapper } from 'enzyme';
import { addLayer } from '../../../state_management';

jest.mock('../../../id_generator');

Expand All @@ -39,8 +46,40 @@ afterEach(() => {

describe('ConfigPanel', () => {
const frame = createMockFramePublicAPI();

function getDefaultProps() {
function prepareAndMountComponent(
props: ReturnType<typeof getDefaultProps>,
customStoreProps?: Partial<MountStoreProps>
) {
(generateId as jest.Mock).mockReturnValue(`newId`);
return mountWithProvider(
<LayerPanels {...props} />,
{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
activeDatasourceId: 'testDatasource',
},
storeDeps: mockStoreDeps({
datasourceMap: props.datasourceMap,
visualizationMap: props.visualizationMap,
}),
...customStoreProps,
},
{
attachTo: container,
}
);
}
function getDefaultProps(
{ datasourceMap = mockDatasourceMap(), visualizationMap = mockVisualizationMap() } = {
datasourceMap: mockDatasourceMap(),
visualizationMap: mockVisualizationMap(),
}
) {
frame.datasourceLayers = {
first: datasourceMap.testDatasource.publicAPIMock,
};
Expand Down Expand Up @@ -75,22 +114,13 @@ describe('ConfigPanel', () => {
it('should fail to render layerPanels if the public API is out of date', async () => {
const props = getDefaultProps();
props.framePublicAPI.datasourceLayers = {};
const { instance } = await mountWithProvider(<LayerPanels {...props} />);
const { instance } = await prepareAndMountComponent(props);
expect(instance.find(LayerPanel).exists()).toBe(false);
});

it('allow datasources and visualizations to use setters', async () => {
const props = getDefaultProps();
const { instance, lensStore } = await mountWithProvider(<LayerPanels {...props} />, {
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
},
});
const { instance, lensStore } = await prepareAndMountComponent(props);
const { updateDatasource, updateAll } = instance.find(LayerPanel).props();

const updater = () => 'updated';
Expand All @@ -116,22 +146,7 @@ describe('ConfigPanel', () => {

describe('focus behavior when adding or removing layers', () => {
it('should focus the only layer when resetting the layer', async () => {
const { instance } = await mountWithProvider(
<LayerPanels {...getDefaultProps()} />,
{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
},
},
{
attachTo: container,
}
);
const { instance } = await prepareAndMountComponent(getDefaultProps());
const firstLayerFocusable = instance
.find(LayerPanel)
.first()
Expand All @@ -146,29 +161,15 @@ describe('ConfigPanel', () => {
});

it('should focus the second layer when removing the first layer', async () => {
const defaultProps = getDefaultProps();
const datasourceMap = mockDatasourceMap();
const defaultProps = getDefaultProps({ datasourceMap });
// overwriting datasourceLayers to test two layers
frame.datasourceLayers = {
first: datasourceMap.testDatasource.publicAPIMock,
second: datasourceMap.testDatasource.publicAPIMock,
};
const { instance } = await mountWithProvider(
<LayerPanels {...defaultProps} />,
{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
},
},
{
attachTo: container,
}
);

const { instance } = await prepareAndMountComponent(defaultProps);
const secondLayerFocusable = instance
.find(LayerPanel)
.at(1)
Expand All @@ -183,28 +184,14 @@ describe('ConfigPanel', () => {
});

it('should focus the first layer when removing the second layer', async () => {
const defaultProps = getDefaultProps();
const datasourceMap = mockDatasourceMap();
const defaultProps = getDefaultProps({ datasourceMap });
// overwriting datasourceLayers to test two layers
frame.datasourceLayers = {
first: datasourceMap.testDatasource.publicAPIMock,
second: datasourceMap.testDatasource.publicAPIMock,
};
const { instance } = await mountWithProvider(
<LayerPanels {...defaultProps} />,
{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
},
},
{
attachTo: container,
}
);
const { instance } = await prepareAndMountComponent(defaultProps);
const firstLayerFocusable = instance
.find(LayerPanel)
.first()
Expand All @@ -219,31 +206,22 @@ describe('ConfigPanel', () => {
});

it('should focus the added layer', async () => {
(generateId as jest.Mock).mockReturnValue(`second`);
const datasourceMap = mockDatasourceMap();
frame.datasourceLayers = {
first: datasourceMap.testDatasource.publicAPIMock,
newId: datasourceMap.testDatasource.publicAPIMock,
};

const { instance } = await mountWithProvider(
<LayerPanels {...getDefaultProps()} />,
const defaultProps = getDefaultProps({ datasourceMap });

const { instance } = await prepareAndMountComponent(defaultProps, {
dispatch: jest.fn((x) => {
if (x.type === addLayer.type) {
frame.datasourceLayers.newId = datasourceMap.testDatasource.publicAPIMock;
}
}),
});

{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
activeDatasourceId: 'testDatasource',
},
dispatch: jest.fn((x) => {
if (x.payload.subType === 'ADD_LAYER') {
frame.datasourceLayers.second = datasourceMap.testDatasource.publicAPIMock;
}
}),
},
{
attachTo: container,
}
);
act(() => {
instance.find('[data-test-subj="lnsLayerAddButton"]').first().simulate('click');
});
Expand All @@ -253,26 +231,6 @@ describe('ConfigPanel', () => {
});

describe('initial default value', () => {
function prepareAndMountComponent(props: ReturnType<typeof getDefaultProps>) {
(generateId as jest.Mock).mockReturnValue(`newId`);
return mountWithProvider(
<LayerPanels {...props} />,
{
preloadedState: {
datasourceStates: {
testDatasource: {
isLoading: false,
state: 'state',
},
},
activeDatasourceId: 'testDatasource',
},
},
{
attachTo: container,
}
);
}
function clickToAddLayer(instance: ReactWrapper) {
act(() => {
instance.find('[data-test-subj="lnsLayerAddButton"]').first().simulate('click');
Expand All @@ -297,15 +255,18 @@ describe('ConfigPanel', () => {
}

it('should not add an initial dimension when not specified', async () => {
const props = getDefaultProps();
props.activeVisualization.getSupportedLayers = jest.fn(() => [
const datasourceMap = mockDatasourceMap();
const visualizationMap = mockVisualizationMap();

visualizationMap.testVis.getSupportedLayers = jest.fn(() => [
{ type: layerTypes.DATA, label: 'Data Layer' },
{
type: layerTypes.REFERENCELINE,
label: 'Reference layer',
},
]);
datasourceMap.testDatasource.initializeDimension = jest.fn();
const props = getDefaultProps({ datasourceMap, visualizationMap });

const { instance, lensStore } = await prepareAndMountComponent(props);
await clickToAddLayer(instance);
Expand All @@ -315,8 +276,11 @@ describe('ConfigPanel', () => {
});

it('should not add an initial dimension when initialDimensions are not available for the given layer type', async () => {
const props = getDefaultProps();
props.activeVisualization.getSupportedLayers = jest.fn(() => [
const datasourceMap = mockDatasourceMap();
const visualizationMap = mockVisualizationMap();
datasourceMap.testDatasource.initializeDimension = jest.fn();

visualizationMap.testVis.getSupportedLayers = jest.fn(() => [
{
type: layerTypes.DATA,
label: 'Data Layer',
Expand All @@ -335,8 +299,7 @@ describe('ConfigPanel', () => {
label: 'Reference layer',
},
]);
datasourceMap.testDatasource.initializeDimension = jest.fn();

const props = getDefaultProps({ datasourceMap, visualizationMap });
const { instance, lensStore } = await prepareAndMountComponent(props);
await clickToAddLayer(instance);

Expand All @@ -345,8 +308,9 @@ describe('ConfigPanel', () => {
});

it('should use group initial dimension value when adding a new layer if available', async () => {
const props = getDefaultProps();
props.activeVisualization.getSupportedLayers = jest.fn(() => [
const datasourceMap = mockDatasourceMap();
const visualizationMap = mockVisualizationMap();
visualizationMap.testVis.getSupportedLayers = jest.fn(() => [
{ type: layerTypes.DATA, label: 'Data Layer' },
{
type: layerTypes.REFERENCELINE,
Expand All @@ -363,6 +327,7 @@ describe('ConfigPanel', () => {
},
]);
datasourceMap.testDatasource.initializeDimension = jest.fn();
const props = getDefaultProps({ datasourceMap, visualizationMap });

const { instance, lensStore } = await prepareAndMountComponent(props);
await clickToAddLayer(instance);
Expand All @@ -378,8 +343,10 @@ describe('ConfigPanel', () => {
});

it('should add an initial dimension value when clicking on the empty dimension button', async () => {
const props = getDefaultProps();
props.activeVisualization.getSupportedLayers = jest.fn(() => [
const datasourceMap = mockDatasourceMap();

const visualizationMap = mockVisualizationMap();
visualizationMap.testVis.getSupportedLayers = jest.fn(() => [
{
type: layerTypes.DATA,
label: 'Data Layer',
Expand All @@ -395,7 +362,7 @@ describe('ConfigPanel', () => {
},
]);
datasourceMap.testDatasource.initializeDimension = jest.fn();

const props = getDefaultProps({ visualizationMap, datasourceMap });
const { instance, lensStore } = await prepareAndMountComponent(props);

await clickToAddDimension(instance);
Expand Down
Loading

0 comments on commit 2ad1f91

Please sign in to comment.