github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 09:19:04 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Lens] replace react specific props events with html events (#113156)

Browse source
This commit is contained in:
Marta Bondyra 2021-09-28 10:55:41 +02:00 • committed by GitHub
parent c4ddb01d77
commit 618d1e5e99
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 175 additions and 194 deletions
Download patch file Download diff file Expand all files Collapse all files

14
x-pack/plugins/lens/public/datatable_visualization/components/dimension_editor.test.tsx
View file

@ -205,14 +205,12 @@ describe('data table dimension editor', () => {
state.columns[0].colorMode = 'cell';
const instance = mountWithIntl(<TableDimensionEditor {...props} />);
act(() =>
(
instance
.find('[data-test-subj="lnsDatatable_dynamicColoring_trigger"]')
.first()
.prop('onClick') as () => void
)?.()
);
act(() => {
instance
.find('[data-test-subj="lnsDatatable_dynamicColoring_trigger"]')
.first()
.simulate('click');
});
expect(instance.find(PalettePanelContainer).exists()).toBe(true);
});

71
x-pack/plugins/lens/public/indexpattern_datasource/datapanel.test.tsx
View file

@ -5,7 +5,9 @@
* 2.0.
*/
import React, { ChangeEvent, ReactElement } from 'react';
import React from 'react';
import { waitFor } from '@testing-library/react';
import ReactDOM from 'react-dom';
import { createMockedDragDropContext } from './mocks';
import { dataPluginMock } from '../../../../../src/plugins/data/public/mocks';
import { InnerIndexPatternDataPanel, IndexPatternDataPanel, MemoizedDataPanel } from './datapanel';
@ -240,6 +242,9 @@ const initialState: IndexPatternPrivateState = {
const dslQuery = { bool: { must: [], filter: [], should: [], must_not: [] } };
// @ts-expect-error Portal mocks are notoriously difficult to type
ReactDOM.createPortal = jest.fn((element) => element);
describe('IndexPattern Data Panel', () => {
let defaultProps: Parameters<typeof InnerIndexPatternDataPanel>[0] & {
showNoDataPopover: () => void;
@ -752,14 +757,13 @@ describe('IndexPattern Data Panel', () => {
it('should filter down by name', () => {
const wrapper = mountWithIntl(<InnerIndexPatternDataPanel {...props} />);
act(() => {
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').prop('onChange')!({
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').simulate('change', {
target: { value: 'me' },
} as ChangeEvent<HTMLInputElement>);
});
});
wrapper
.find('[data-test-subj="lnsIndexPatternEmptyFields"]')
.find('button')
.find('[data-test-subj="lnsIndexPatternEmptyFields"] button')
.first()
.simulate('click');
@ -772,9 +776,9 @@ describe('IndexPattern Data Panel', () => {
it('should announce filter in live region', () => {
const wrapper = mountWithIntl(<InnerIndexPatternDataPanel {...props} />);
act(() => {
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').prop('onChange')!({
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').simulate('change', {
target: { value: 'me' },
} as ChangeEvent<HTMLInputElement>);
});
});
wrapper
@ -832,9 +836,9 @@ describe('IndexPattern Data Panel', () => {
it('should filter down by type and by name', () => {
const wrapper = mountWithIntl(<InnerIndexPatternDataPanel {...props} />);
act(() => {
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').prop('onChange')!({
wrapper.find('[data-test-subj="lnsIndexPatternFieldSearch"]').simulate('change', {
target: { value: 'me' },
} as ChangeEvent<HTMLInputElement>);
});
});
wrapper.find('[data-test-subj="lnsIndexPatternFiltersToggle"]').first().simulate('click');
@ -856,24 +860,26 @@ describe('IndexPattern Data Panel', () => {
);
const wrapper = mountWithIntl(<InnerIndexPatternDataPanel {...props} />);
act(() => {
(
wrapper
.find('[data-test-subj="lnsIndexPatternActions-popover"]')
.first()
.prop('children') as ReactElement
).props.items[0].props.onClick();
const popoverTrigger = wrapper.find(
'[data-test-subj="lnsIndexPatternActions-popover"] button'
);
popoverTrigger.simulate('click');
});
wrapper.update();
act(() => {
wrapper.find('[data-test-subj="indexPattern-add-field"]').first().simulate('click');
});
// wait for indx pattern to be loaded
await act(async () => await new Promise((r) => setTimeout(r, 0)));
expect(props.indexPatternFieldEditor.openEditor).toHaveBeenCalledWith(
expect.objectContaining({
ctx: expect.objectContaining({
indexPattern: mockIndexPattern,
}),
})
);
await waitFor(() => {
expect(props.indexPatternFieldEditor.openEditor).toHaveBeenCalledWith(
expect.objectContaining({
ctx: expect.objectContaining({
indexPattern: mockIndexPattern,
}),
})
);
});
});
it('should reload index pattern if callback gets called', async () => {
@ -891,14 +897,19 @@ describe('IndexPattern Data Panel', () => {
Promise.resolve(mockIndexPattern)
);
const wrapper = mountWithIntl(<InnerIndexPatternDataPanel {...props} />);
act(() => {
(
wrapper
.find('[data-test-subj="lnsIndexPatternActions-popover"]')
.first()
.prop('children') as ReactElement
).props.items[0].props.onClick();
const popoverTrigger = wrapper.find(
'[data-test-subj="lnsIndexPatternActions-popover"] button'
);
popoverTrigger.simulate('click');
});
wrapper.update();
act(() => {
wrapper.find('[data-test-subj="indexPattern-add-field"]').first().simulate('click');
});
// wait for indx pattern to be loaded
await act(async () => await new Promise((r) => setTimeout(r, 0)));

30
x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/bucket_nesting_editor.test.tsx
View file

@ -99,8 +99,10 @@ describe('BucketNestingEditor', () => {
/>
);
const nestingSwitch = component.find('[data-test-subj="indexPattern-nesting-switch"]').first();
(nestingSwitch.prop('onChange') as () => {})();
component
.find('[data-test-subj="indexPattern-nesting-switch"] button')
.first()
.simulate('click');
expect(setColumns).toHaveBeenCalledTimes(1);
expect(setColumns).toHaveBeenCalledWith(['a', 'b', 'c']);
@ -117,12 +119,10 @@ describe('BucketNestingEditor', () => {
},
});
(
component
.find('[data-test-subj="indexPattern-nesting-switch"]')
.first()
.prop('onChange') as () => {}
)();
component
.find('[data-test-subj="indexPattern-nesting-switch"] button')
.first()
.simulate('click');
expect(setColumns).toHaveBeenCalledTimes(2);
expect(setColumns).toHaveBeenLastCalledWith(['b', 'a', 'c']);
@ -212,8 +212,8 @@ describe('BucketNestingEditor', () => {
/>
);
const control = component.find('[data-test-subj="indexPattern-nesting-select"]').first();
(control.prop('onChange') as (e: unknown) => {})({
const control = component.find('[data-test-subj="indexPattern-nesting-select"] select').first();
control.simulate('change', {
target: { value: 'b' },
});
@ -239,10 +239,8 @@ describe('BucketNestingEditor', () => {
/>
);
const control = component.find('[data-test-subj="indexPattern-nesting-select"]').first();
(control.prop('onChange') as (e: unknown) => {})({
target: { value: '' },
});
const control = component.find('[data-test-subj="indexPattern-nesting-select"] select').first();
control.simulate('change', { target: { value: '' } });
expect(setColumns).toHaveBeenCalledWith(['a', 'c', 'b']);
});
@ -266,8 +264,8 @@ describe('BucketNestingEditor', () => {
/>
);
const control = component.find('[data-test-subj="indexPattern-nesting-select"]').first();
(control.prop('onChange') as (e: unknown) => {})({
const control = component.find('[data-test-subj="indexPattern-nesting-select"] select').first();
control.simulate('change', {
target: { value: '' },
});

49
x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/dimension_panel.test.tsx
View file

@ -7,7 +7,7 @@
import { ReactWrapper, ShallowWrapper } from 'enzyme';
import 'jest-canvas-mock';
import React, { ChangeEvent, MouseEvent } from 'react';
import React from 'react';
import { act } from 'react-dom/test-utils';
import {
EuiComboBox,
@ -1213,15 +1213,14 @@ describe('IndexPatternDimensionEditorPanel', () => {
const props = getProps({ timeScale: 's', label: 'Count of records per second' });
wrapper = mount(<IndexPatternDimensionEditorComponent {...props} />);
wrapper
.find('[data-test-subj="indexPattern-advanced-popover"]')
.find('button[data-test-subj="indexPattern-advanced-popover"]')
.hostNodes()
.simulate('click');
wrapper
.find('[data-test-subj="indexPattern-time-scaling-unit"]')
.find(EuiSelect)
.prop('onChange')!({
wrapper.find('[data-test-subj="indexPattern-time-scaling-unit"] select').simulate('change', {
target: { value: 'h' },
} as unknown as ChangeEvent<HTMLSelectElement>);
});
expect(setState.mock.calls[0]).toEqual([expect.any(Function), { isDimensionComplete: true }]);
expect(setState.mock.calls[0][0](props.state)).toEqual({
...props.state,
@ -1243,12 +1242,9 @@ describe('IndexPatternDimensionEditorPanel', () => {
it('should not adjust label if it is custom', () => {
const props = getProps({ timeScale: 's', customLabel: true, label: 'My label' });
wrapper = mount(<IndexPatternDimensionEditorComponent {...props} />);
wrapper
.find('[data-test-subj="indexPattern-time-scaling-unit"]')
.find(EuiSelect)
.prop('onChange')!({
wrapper.find('[data-test-subj="indexPattern-time-scaling-unit"] select').simulate('change', {
target: { value: 'h' },
} as unknown as ChangeEvent<HTMLSelectElement>);
});
expect(setState.mock.calls[0]).toEqual([expect.any(Function), { isDimensionComplete: true }]);
expect(setState.mock.calls[0][0](props.state)).toEqual({
...props.state,
@ -1270,13 +1266,7 @@ describe('IndexPatternDimensionEditorPanel', () => {
it('should allow to remove time scaling', () => {
const props = getProps({ timeScale: 's', label: 'Count of records per second' });
wrapper = mount(<IndexPatternDimensionEditorComponent {...props} />);
wrapper
.find('[data-test-subj="indexPattern-time-scaling-remove"]')
.find(EuiButtonIcon)
.prop('onClick')!(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
{} as any
);
wrapper.find('[data-test-subj="indexPattern-time-scaling-remove"] button').simulate('click');
expect(setState.mock.calls[0]).toEqual([expect.any(Function), { isDimensionComplete: true }]);
expect(setState.mock.calls[0][0](props.state)).toEqual({
...props.state,
@ -1391,7 +1381,7 @@ describe('IndexPatternDimensionEditorPanel', () => {
.find(AdvancedOptions)
.dive()
.find('[data-test-subj="indexPattern-time-shift-enable"]')
.prop('onClick')!({} as MouseEvent);
.simulate('click');
expect((props.setState as jest.Mock).mock.calls[0][0](props.state)).toEqual({
...props.state,
layers: {
@ -1465,10 +1455,7 @@ describe('IndexPatternDimensionEditorPanel', () => {
wrapper
.find('[data-test-subj="indexPattern-time-shift-remove"]')
.find(EuiButtonIcon)
.prop('onClick')!(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
{} as any
);
.simulate('click');
expect((props.setState as jest.Mock).mock.calls[0][0](props.state)).toEqual({
...props.state,
layers: {
@ -1657,10 +1644,8 @@ describe('IndexPatternDimensionEditorPanel', () => {
wrapper
.find('[data-test-subj="indexPattern-filter-by-remove"]')
.find(EuiButtonIcon)
.prop('onClick')!(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
{} as any
);
.simulate('click');
expect(setState.mock.calls[0]).toEqual([expect.any(Function), { isDimensionComplete: true }]);
expect(setState.mock.calls[0][0](props.state)).toEqual({
...props.state,
@ -1963,11 +1948,11 @@ describe('IndexPatternDimensionEditorPanel', () => {
wrapper = mount(
<IndexPatternDimensionEditorComponent {...defaultProps} state={initialState} />
);
act(() => {
wrapper.find('[data-test-subj="lns-indexPatternDimension-min"]').first().prop('onClick')!(
{} as MouseEvent
);
wrapper
.find('button[data-test-subj="lns-indexPatternDimension-min"]')
.first()
.simulate('click');
});
expect(replaceColumn).toHaveBeenCalledWith(

4
x-pack/plugins/lens/public/indexpattern_datasource/field_item.test.tsx
View file

@ -5,7 +5,7 @@
* 2.0.
*/
import React, { MouseEvent, ReactElement } from 'react';
import React, { ReactElement } from 'react';
import { ReactWrapper } from 'enzyme';
import { act } from 'react-dom/test-utils';
import { EuiLoadingSpinner, EuiPopover } from '@elastic/eui';
@ -139,7 +139,7 @@ describe('IndexPattern Field Item', () => {
mountWithIntl(popoverContent as ReactElement)
.find('[data-test-subj="lnsFieldListPanelEdit"]')
.first()
.prop('onClick')!({} as MouseEvent);
.simulate('click');
});
expect(editFieldSpy).toHaveBeenCalledWith('bytes');
});

18
x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/date_histogram.test.tsx
View file

@ -9,7 +9,7 @@ import React from 'react';
import type { DateHistogramIndexPatternColumn } from './date_histogram';
import { dateHistogramOperation } from './index';
import { shallow } from 'enzyme';
import { EuiSwitch, EuiSwitchEvent } from '@elastic/eui';
import { EuiSwitch } from '@elastic/eui';
import type { IUiSettingsClient, SavedObjectsClientContract, HttpSetup } from 'kibana/public';
import type { IStorageWrapper } from 'src/plugins/kibana_utils/public';
import { UI_SETTINGS } from '../../../../../../../src/plugins/data/public';
@ -415,9 +415,9 @@ describe('date_histogram', () => {
currentColumn={thirdLayer.columns.col1 as DateHistogramIndexPatternColumn}
/>
);
instance.find(EuiSwitch).prop('onChange')!({
instance.find(EuiSwitch).simulate('change', {
target: { checked: true },
} as EuiSwitchEvent);
});
expect(updateLayerSpy).toHaveBeenCalled();
const newLayer = updateLayerSpy.mock.calls[0][0];
expect(newLayer).toHaveProperty('columns.col1.params.interval', '30d');
@ -434,11 +434,11 @@ describe('date_histogram', () => {
currentColumn={layer.columns.col1 as DateHistogramIndexPatternColumn}
/>
);
instance.find('[data-test-subj="lensDateHistogramValue"]').prop('onChange')!({
instance.find('[data-test-subj="lensDateHistogramValue"]').simulate('change', {
target: {
value: '2',
},
} as React.ChangeEvent<HTMLInputElement>);
});
expect(updateLayerSpy).toHaveBeenCalledWith(layerWithInterval('1w'));
});
@ -498,11 +498,11 @@ describe('date_histogram', () => {
currentColumn={layer.columns.col1 as DateHistogramIndexPatternColumn}
/>
);
instance.find('[data-test-subj="lensDateHistogramUnit"]').prop('onChange')!({
instance.find('[data-test-subj="lensDateHistogramUnit"]').simulate('change', {
target: {
value: 'd',
},
} as React.ChangeEvent<HTMLInputElement>);
});
expect(updateLayerSpy).toHaveBeenCalledWith(layerWithInterval('42d'));
});
@ -519,11 +519,11 @@ describe('date_histogram', () => {
currentColumn={testLayer.columns.col1 as DateHistogramIndexPatternColumn}
/>
);
instance.find('[data-test-subj="lensDateHistogramValue"]').prop('onChange')!({
instance.find('[data-test-subj="lensDateHistogramValue"]').simulate('change', {
target: {
value: '9',
},
} as React.ChangeEvent<HTMLInputElement>);
});
expect(updateLayerSpy).toHaveBeenCalledWith(layerWithInterval('9d'));
});

18
x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/percentile.test.tsx
View file

@ -286,12 +286,12 @@ describe('percentile', () => {
jest.runAllTimers();
const input = instance
.find('[data-test-subj="lns-indexPattern-percentile-input"]')
.find(EuiFieldNumber);
const input = instance.find(
'[data-test-subj="lns-indexPattern-percentile-input"] input[type="number"]'
);
await act(async () => {
input.prop('onChange')!({ target: { value: '27' } } as React.ChangeEvent<HTMLInputElement>);
input.simulate('change', { target: { value: '27' } });
});
instance.update();
@ -327,14 +327,12 @@ describe('percentile', () => {
jest.runAllTimers();
const input = instance
.find('[data-test-subj="lns-indexPattern-percentile-input"]')
.find(EuiFieldNumber);
const input = instance.find(
'[data-test-subj="lns-indexPattern-percentile-input"] input[type="number"]'
);
await act(async () => {
input.prop('onChange')!({
target: { value: '12.12' },
} as React.ChangeEvent<HTMLInputElement>);
input.simulate('change', { target: { value: '12.12' } });
});
instance.update();

86
x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/ranges/ranges.test.tsx
View file

@ -8,14 +8,7 @@
import React from 'react';
import { mount } from 'enzyme';
import { act } from 'react-dom/test-utils';
import {
EuiFieldNumber,
EuiRange,
EuiButtonEmpty,
EuiLink,
EuiText,
EuiFieldText,
} from '@elastic/eui';
import { EuiFieldNumber, EuiRange, EuiButtonEmpty, EuiLink, EuiText } from '@elastic/eui';
import { IUiSettingsClient, SavedObjectsClientContract, HttpSetup } from 'kibana/public';
import { IStorageWrapper } from 'src/plugins/kibana_utils/public';
import type { IndexPatternLayer, IndexPattern } from '../../../types';
@ -73,9 +66,6 @@ dataPluginMockValue.fieldFormats.deserialize = jest.fn().mockImplementation(({ p
};
});
type ReactMouseEvent = React.MouseEvent<HTMLAnchorElement, MouseEvent> &
React.MouseEvent<HTMLButtonElement, MouseEvent>;
// need this for MAX_HISTOGRAM value
const uiSettingsMock = {
get: jest.fn().mockReturnValue(100),
@ -419,7 +409,7 @@ describe('ranges', () => {
instance
.find('[data-test-subj="lns-indexPattern-range-maxBars-minus"]')
.find('button')
.prop('onClick')!({} as ReactMouseEvent);
.simulate('click');
jest.advanceTimersByTime(TYPING_DEBOUNCE_TIME * 4);
instance.update();
});
@ -443,7 +433,7 @@ describe('ranges', () => {
instance
.find('[data-test-subj="lns-indexPattern-range-maxBars-plus"]')
.find('button')
.prop('onClick')!({} as ReactMouseEvent);
.simulate('click');
jest.advanceTimersByTime(TYPING_DEBOUNCE_TIME * 4);
instance.update();
});
@ -501,7 +491,7 @@ describe('ranges', () => {
// This series of act closures are made to make it work properly the update flush
act(() => {
instance.find(EuiButtonEmpty).prop('onClick')!({} as ReactMouseEvent);
instance.find(EuiButtonEmpty).simulate('click');
});
act(() => {
@ -511,11 +501,15 @@ describe('ranges', () => {
expect(instance.find(RangePopover)).toHaveLength(2);
// edit the range and check
instance.find(RangePopover).find(EuiFieldNumber).first().prop('onChange')!({
target: {
value: '50',
},
} as React.ChangeEvent<HTMLInputElement>);
instance
.find('RangePopover input[type="number"]')
.first()
.simulate('change', {
target: {
value: '50',
},
});
jest.advanceTimersByTime(TYPING_DEBOUNCE_TIME * 4);
expect(updateLayerSpy).toHaveBeenCalledWith({
@ -552,7 +546,7 @@ describe('ranges', () => {
// This series of act closures are made to make it work properly the update flush
act(() => {
instance.find(EuiButtonEmpty).prop('onClick')!({} as ReactMouseEvent);
instance.find(EuiButtonEmpty).simulate('click');
});
act(() => {
@ -562,11 +556,15 @@ describe('ranges', () => {
expect(instance.find(RangePopover)).toHaveLength(2);
// edit the label and check
instance.find(RangePopover).find(EuiFieldText).first().prop('onChange')!({
target: {
value: 'customlabel',
},
} as React.ChangeEvent<HTMLInputElement>);
instance
.find('RangePopover input[type="text"]')
.first()
.simulate('change', {
target: {
value: 'customlabel',
},
});
jest.advanceTimersByTime(TYPING_DEBOUNCE_TIME * 4);
expect(updateLayerSpy).toHaveBeenCalledWith({
@ -603,19 +601,20 @@ describe('ranges', () => {
// This series of act closures are made to make it work properly the update flush
act(() => {
instance.find(RangePopover).find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
instance.find(RangePopover).find(EuiLink).simulate('click');
});
act(() => {
// need another wrapping for this in order to work
instance.update();
// edit the range "to" field
instance.find(RangePopover).find(EuiFieldNumber).last().prop('onChange')!({
target: {
value: '50',
},
} as React.ChangeEvent<HTMLInputElement>);
instance
.find('RangePopover input[type="number"]')
.last()
.simulate('change', {
target: {
value: '50',
},
});
jest.advanceTimersByTime(TYPING_DEBOUNCE_TIME * 4);
expect(updateLayerSpy).toHaveBeenCalledWith({
@ -649,7 +648,7 @@ describe('ranges', () => {
// This series of act closures are made to make it work properly the update flush
act(() => {
instance.find(RangePopover).find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
instance.find(RangePopover).find(EuiLink).simulate('click');
});
act(() => {
@ -657,11 +656,14 @@ describe('ranges', () => {
instance.update();
// edit the range "to" field
instance.find(RangePopover).find(EuiFieldNumber).last().prop('onChange')!({
target: {
value: '-1',
},
} as React.ChangeEvent<HTMLInputElement>);
instance
.find('RangePopover input[type="number"]')
.last()
.simulate('change', {
target: {
value: '-1',
},
});
});
act(() => {
@ -701,7 +703,7 @@ describe('ranges', () => {
instance
.find('[data-test-subj="lns-customBucketContainer-remove"]')
.last()
.prop('onClick')!({} as ReactMouseEvent);
.simulate('click');
});
act(() => {
@ -733,7 +735,7 @@ describe('ranges', () => {
);
act(() => {
instance.find(RangePopover).last().find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
instance.find(RangePopover).last().find(EuiLink).simulate('click');
});
act(() => {
@ -840,7 +842,7 @@ describe('ranges', () => {
// This series of act closures are made to make it work properly the update flush
act(() => {
instance.find(EuiLink).first().prop('onClick')!({} as ReactMouseEvent);
instance.find(EuiLink).first().simulate('click');
});
expect(updateLayerSpy.mock.calls[0][0].columns.col1.params.format).toEqual({

32
x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/terms/terms.test.tsx
View file

@ -8,7 +8,7 @@
import React from 'react';
import { act } from 'react-dom/test-utils';
import { shallow, mount } from 'enzyme';
import { EuiFieldNumber, EuiSelect, EuiSwitch, EuiSwitchEvent } from '@elastic/eui';
import { EuiFieldNumber, EuiSelect, EuiSwitch } from '@elastic/eui';
import type {
IUiSettingsClient,
SavedObjectsClientContract,
@ -813,11 +813,11 @@ describe('terms', () => {
instance
.find('[data-test-subj="indexPattern-terms-other-bucket"]')
.find(EuiSwitch)
.prop('onChange')!({
target: {
checked: true,
},
} as EuiSwitchEvent);
.simulate('change', {
target: {
checked: true,
},
});
expect(updateLayerSpy).toHaveBeenCalledWith({
...layer,
@ -871,11 +871,11 @@ describe('terms', () => {
instance
.find(EuiSelect)
.find('[data-test-subj="indexPattern-terms-orderBy"]')
.prop('onChange')!({
target: {
value: 'column$$$col2',
},
} as React.ChangeEvent<HTMLSelectElement>);
.simulate('change', {
target: {
value: 'column$$$col2',
},
});
expect(updateLayerSpy).toHaveBeenCalledWith({
...layer,
@ -931,11 +931,11 @@ describe('terms', () => {
instance
.find('[data-test-subj="indexPattern-terms-orderDirection"]')
.find(EuiSelect)
.prop('onChange')!({
target: {
value: 'desc',
},
} as React.ChangeEvent<HTMLSelectElement>);
.simulate('change', {
target: {
value: 'desc',
},
});
expect(updateLayerSpy).toHaveBeenCalledWith({
...layer,

18
x-pack/plugins/lens/public/indexpattern_datasource/operations/definitions/terms/values_input.test.tsx
View file

@ -32,9 +32,7 @@ describe('Values', () => {
const onChangeSpy = jest.fn();
const instance = shallow(<ValuesInput value={5} onChange={onChangeSpy} />);
act(() => {
instance.find(EuiFieldNumber).prop('onChange')!({
currentTarget: { value: '7' },
} as React.ChangeEvent<HTMLInputElement>);
instance.find(EuiFieldNumber).simulate('change', { currentTarget: { value: '7' } });
});
expect(instance.find(EuiFieldNumber).prop('value')).toEqual('7');
expect(onChangeSpy.mock.calls.length).toBe(1);
@ -45,9 +43,7 @@ describe('Values', () => {
const onChangeSpy = jest.fn();
const instance = shallow(<ValuesInput value={5} onChange={onChangeSpy} />);
act(() => {
instance.find(EuiFieldNumber).prop('onChange')!({
currentTarget: { value: '1007' },
} as React.ChangeEvent<HTMLInputElement>);
instance.find(EuiFieldNumber).simulate('change', { currentTarget: { value: '1007' } });
});
instance.update();
expect(instance.find(EuiFieldNumber).prop('value')).toEqual('1007');
@ -64,9 +60,7 @@ describe('Values', () => {
);
act(() => {
instance.find(EuiFieldNumber).prop('onChange')!({
currentTarget: { value: '1007' },
} as React.ChangeEvent<HTMLInputElement>);
instance.find(EuiFieldNumber).simulate('change', { currentTarget: { value: '1007' } });
});
instance.update();
@ -81,13 +75,13 @@ describe('Values', () => {
function changeAndBlur(newValue: string) {
act(() => {
instance.find(EuiFieldNumber).prop('onChange')!({
instance.find(EuiFieldNumber).simulate('change', {
currentTarget: { value: newValue },
} as React.ChangeEvent<HTMLInputElement>);
});
});
instance.update();
act(() => {
instance.find(EuiFieldNumber).prop('onBlur')!({} as React.FocusEvent<HTMLInputElement>);
instance.find(EuiFieldNumber).simulate('blur');
});
instance.update();
}

29
x-pack/plugins/lens/public/shared_components/coloring/color_stops.test.tsx
View file

@ -64,7 +64,7 @@ describe('Color Stops component', () => {
.find('[data-test-subj="my-test_dynamicColoring_addStop"]')
.first();
act(() => {
addStopButton.prop('onClick')!({} as React.MouseEvent);
addStopButton.simulate('click');
});
component = component.update();
@ -119,7 +119,7 @@ describe('Color Stops component', () => {
component
.find('[data-test-subj="my-test_dynamicColoring_stop_color_0"]')
.first()
.prop('onBlur')!({} as React.FocusEvent);
.simulate('blur');
});
component = component.update();
expect(
@ -134,35 +134,30 @@ describe('Color Stops component', () => {
it('should sort stops value on whole component blur', () => {
let component = mount(<CustomStops {...props} />);
let firstStopValueInput = component
.find('[data-test-subj="my-test_dynamicColoring_stop_value_0"]')
.first();
let firstStopValueInput = component.find(
'[data-test-subj="my-test_dynamicColoring_stop_value_0"] input[type="number"]'
);
act(() => {
firstStopValueInput.prop('onChange')!({
target: { value: ' 90' },
} as unknown as React.ChangeEvent);
firstStopValueInput.simulate('change', { target: { value: ' 90' } });
});
component = component.update();
act(() => {
component
.find('[data-test-subj="my-test_dynamicColoring_stop_row_0"]')
.first()
.prop('onBlur')!({} as React.FocusEvent);
.simulate('blur');
});
component = component.update();
// retrieve again the input
firstStopValueInput = component
.find('[data-test-subj="my-test_dynamicColoring_stop_value_0"]')
.first();
firstStopValueInput = component.find(
'[data-test-subj="my-test_dynamicColoring_stop_value_0"] input[type="number"]'
);
expect(firstStopValueInput.prop('value')).toBe('40');
// the previous one move at the bottom
expect(
component
.find('[data-test-subj="my-test_dynamicColoring_stop_value_2"]')
.first()
.find('[data-test-subj="my-test_dynamicColoring_stop_value_2"] input[type="number"]')
.prop('value')
).toBe('90');
});