Skip to content

Commit 0693aff

Browse files
committed
Address PR comments
1 parent 51f8fcc commit 0693aff

7 files changed

Lines changed: 325 additions & 243 deletions

File tree

x-pack/plugins/lens/public/shared_components/legend_location_settings.test.tsx

Lines changed: 80 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -6,72 +6,127 @@
66
*/
77

88
import React from 'react';
9-
import { VerticalAlignment, HorizontalAlignment } from '@elastic/charts';
9+
import { Position } from '@elastic/charts';
1010
import { shallowWithIntl as shallow, mountWithIntl as mount } from '@kbn/test/jest';
1111
import { LegendLocationSettings, LegendLocationSettingsProps } from './legend_location_settings';
1212

1313
describe('Legend Location Settings', () => {
1414
let props: LegendLocationSettingsProps;
1515
beforeEach(() => {
1616
props = {
17-
location: 'inside',
1817
onLocationChange: jest.fn(),
18+
onPositionChange: jest.fn(),
1919
};
2020
});
2121

22-
it('should have selected the given location', () => {
22+
it('should have default the Position to right when no position is given', () => {
23+
const component = shallow(<LegendLocationSettings {...props} />);
24+
expect(
25+
component.find('[data-test-subj="lens-legend-position-btn"]').prop('idSelected')
26+
).toEqual(Position.Right);
27+
});
28+
29+
it('should have called the onPositionChange function on ButtonGroup change', () => {
2330
const component = shallow(<LegendLocationSettings {...props} />);
31+
component.find('[data-test-subj="lens-legend-position-btn"]').simulate('change');
32+
expect(props.onPositionChange).toHaveBeenCalled();
33+
});
34+
35+
it('should disable the position group if isDisabled prop is true', () => {
36+
const component = shallow(<LegendLocationSettings {...props} isDisabled />);
37+
expect(
38+
component.find('[data-test-subj="lens-legend-position-btn"]').prop('isDisabled')
39+
).toEqual(true);
40+
});
41+
42+
it('should hide the position button group if location inside is given', () => {
43+
const newProps = {
44+
...props,
45+
location: 'inside',
46+
} as LegendLocationSettingsProps;
47+
const component = shallow(<LegendLocationSettings {...newProps} />);
48+
expect(component.find('[data-test-subj="lens-legend-position-btn"]').length).toEqual(0);
49+
});
50+
51+
it('should render the location settings if location inside is given', () => {
52+
const newProps = {
53+
...props,
54+
location: 'inside',
55+
} as LegendLocationSettingsProps;
56+
const component = shallow(<LegendLocationSettings {...newProps} />);
57+
expect(component.find('[data-test-subj="lens-legend-location-btn"]').length).toEqual(1);
58+
});
59+
60+
it('should have selected the given location', () => {
61+
const newProps = {
62+
...props,
63+
location: 'inside',
64+
} as LegendLocationSettingsProps;
65+
const component = shallow(<LegendLocationSettings {...newProps} />);
2466
expect(
2567
component.find('[data-test-subj="lens-legend-location-btn"]').prop('idSelected')
2668
).toEqual('xy_location_inside');
2769
});
2870

2971
it('should have called the onLocationChange function on ButtonGroup change', () => {
30-
const component = shallow(<LegendLocationSettings {...props} />);
72+
const newProps = {
73+
...props,
74+
location: 'inside',
75+
} as LegendLocationSettingsProps;
76+
const component = shallow(<LegendLocationSettings {...newProps} />);
3177
component
3278
.find('[data-test-subj="lens-legend-location-btn"]')
3379
.simulate('change', 'xy_location_outside');
3480
expect(props.onLocationChange).toHaveBeenCalled();
3581
});
3682

37-
it('should have default the Vertical alignment to top when no value is given', () => {
38-
const component = shallow(<LegendLocationSettings {...props} />);
39-
expect(
40-
component.find('[data-test-subj="lens-legend-inside-valign-btn"]').prop('idSelected')
41-
).toEqual(VerticalAlignment.Top);
42-
});
43-
44-
it('should have default the Horizontal alignment to right when no value is given', () => {
45-
const component = shallow(<LegendLocationSettings {...props} />);
83+
it('should default the alignment to top right when no value is given', () => {
84+
const newProps = {
85+
...props,
86+
location: 'inside',
87+
} as LegendLocationSettingsProps;
88+
const component = shallow(<LegendLocationSettings {...newProps} />);
4689
expect(
47-
component.find('[data-test-subj="lens-legend-inside-halign-btn"]').prop('idSelected')
48-
).toEqual(HorizontalAlignment.Right);
90+
component.find('[data-test-subj="lens-legend-inside-alignment-btn"]').prop('idSelected')
91+
).toEqual('xy_location_alignment_top_right');
4992
});
5093

5194
it('should have called the onAlignmentChange function on ButtonGroup change', () => {
52-
const newProps = { ...props, onAlignmentChange: jest.fn() };
95+
const newProps = {
96+
...props,
97+
onAlignmentChange: jest.fn(),
98+
location: 'inside',
99+
} as LegendLocationSettingsProps;
53100
const component = shallow(<LegendLocationSettings {...newProps} />);
54-
component.find('[data-test-subj="lens-legend-inside-halign-btn"]').simulate('change');
101+
component
102+
.find('[data-test-subj="lens-legend-inside-alignment-btn"]')
103+
.simulate('change', 'xy_location_alignment_top_left');
55104
expect(newProps.onAlignmentChange).toHaveBeenCalled();
56105
});
57106

58-
it('should have default the columns slider to 1 when no value is given', () => {
59-
const component = mount(<LegendLocationSettings {...props} />);
107+
it('should have default the columns input to 1 when no value is given', () => {
108+
const newProps = {
109+
...props,
110+
location: 'inside',
111+
} as LegendLocationSettingsProps;
112+
const component = mount(<LegendLocationSettings {...newProps} />);
60113
expect(
61-
component.find('[data-test-subj="lens-legend-location-columns-slider"]').at(0).prop('value')
114+
component.find('[data-test-subj="lens-legend-location-columns-input"]').at(0).prop('value')
62115
).toEqual(1);
63116
});
64117

65118
it('should disable the components when is Disabled is true', () => {
66-
const component = shallow(<LegendLocationSettings {...props} isDisabled={true} />);
119+
const newProps = {
120+
...props,
121+
location: 'inside',
122+
isDisabled: true,
123+
} as LegendLocationSettingsProps;
124+
const component = shallow(<LegendLocationSettings {...newProps} />);
67125
expect(
68126
component.find('[data-test-subj="lens-legend-location-btn"]').prop('isDisabled')
69127
).toEqual(true);
70128
expect(
71-
component.find('[data-test-subj="lens-legend-inside-valign-btn"]').prop('isDisabled')
72-
).toEqual(true);
73-
expect(
74-
component.find('[data-test-subj="lens-legend-inside-halign-btn"]').prop('isDisabled')
129+
component.find('[data-test-subj="lens-legend-inside-alignment-btn"]').prop('isDisabled')
75130
).toEqual(true);
76131
});
77132
});

0 commit comments

Comments
 (0)