diff --git a/package.json b/package.json
index ed256a13a8433..a9dd8a32322e0 100644
--- a/package.json
+++ b/package.json
@@ -107,7 +107,7 @@
"@elastic/charts": "^14.0.0",
"@elastic/datemath": "5.0.2",
"@elastic/ems-client": "1.0.5",
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"@elastic/filesaver": "1.1.2",
"@elastic/good": "8.1.1-kibana2",
"@elastic/numeral": "2.3.3",
diff --git a/src/legacy/core_plugins/data/public/filter/filter_bar/filter_editor/index.tsx b/src/legacy/core_plugins/data/public/filter/filter_bar/filter_editor/index.tsx
index 5dd5c05647789..74b9a75350229 100644
--- a/src/legacy/core_plugins/data/public/filter/filter_bar/filter_editor/index.tsx
+++ b/src/legacy/core_plugins/data/public/filter/filter_bar/filter_editor/index.tsx
@@ -30,6 +30,7 @@ import {
EuiPopoverTitle,
EuiSpacer,
EuiSwitch,
+ EuiSwitchEvent,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
@@ -431,7 +432,7 @@ class FilterEditorUI extends Component {
this.setState({ selectedOperator, params });
};
- private onCustomLabelSwitchChange = (event: React.ChangeEvent) => {
+ private onCustomLabelSwitchChange = (event: EuiSwitchEvent) => {
const useCustomLabel = event.target.checked;
const customLabel = event.target.checked ? '' : null;
this.setState({ useCustomLabel, customLabel });
diff --git a/src/legacy/core_plugins/input_control_vis/public/components/editor/list_control_editor.test.js b/src/legacy/core_plugins/input_control_vis/public/components/editor/list_control_editor.test.js
index 96c0802d3772a..ea029af9e4890 100644
--- a/src/legacy/core_plugins/input_control_vis/public/components/editor/list_control_editor.test.js
+++ b/src/legacy/core_plugins/input_control_vis/public/components/editor/list_control_editor.test.js
@@ -236,7 +236,7 @@ test('handleCheckboxOptionChange - multiselect', async () => {
component.update();
const checkbox = findTestSubject(component, 'listControlMultiselectInput');
- checkbox.simulate('change', { target: { checked: true } });
+ checkbox.simulate('click');
sinon.assert.notCalled(handleFieldNameChange);
sinon.assert.notCalled(handleIndexPatternChange);
sinon.assert.notCalled(handleNumberOptionChange);
@@ -247,7 +247,9 @@ test('handleCheckboxOptionChange - multiselect', async () => {
expectedControlIndex,
expectedOptionName,
sinon.match((evt) => {
- if (evt.target.checked === true) {
+ // Synthetic `evt.target.checked` does not get altered by EuiSwitch,
+ // but its aria attribute is correctly updated
+ if (evt.target.getAttribute('aria-checked') === 'true') {
return true;
}
return false;
diff --git a/src/legacy/core_plugins/input_control_vis/public/components/editor/options_tab.test.js b/src/legacy/core_plugins/input_control_vis/public/components/editor/options_tab.test.js
index 39f5f6a50a5a6..8784f0e79ca8d 100644
--- a/src/legacy/core_plugins/input_control_vis/public/components/editor/options_tab.test.js
+++ b/src/legacy/core_plugins/input_control_vis/public/components/editor/options_tab.test.js
@@ -47,8 +47,8 @@ describe('OptionsTab', () => {
it('should update updateFiltersOnChange', () => {
const component = mountWithIntl();
- const checkbox = component.find('[data-test-subj="inputControlEditorUpdateFiltersOnChangeCheckbox"] input[type="checkbox"]');
- checkbox.simulate('change', { target: { checked: true } });
+ const checkbox = component.find('[data-test-subj="inputControlEditorUpdateFiltersOnChangeCheckbox"] button');
+ checkbox.simulate('click');
expect(props.setValue).toHaveBeenCalledTimes(1);
expect(props.setValue).toHaveBeenCalledWith('updateFiltersOnChange', true);
@@ -56,8 +56,8 @@ describe('OptionsTab', () => {
it('should update useTimeFilter', () => {
const component = mountWithIntl();
- const checkbox = component.find('[data-test-subj="inputControlEditorUseTimeFilterCheckbox"] input[type="checkbox"]');
- checkbox.simulate('change', { target: { checked: true } });
+ const checkbox = component.find('[data-test-subj="inputControlEditorUseTimeFilterCheckbox"] button');
+ checkbox.simulate('click');
expect(props.setValue).toHaveBeenCalledTimes(1);
expect(props.setValue).toHaveBeenCalledWith('useTimeFilter', true);
@@ -65,8 +65,8 @@ describe('OptionsTab', () => {
it('should update pinFilters', () => {
const component = mountWithIntl();
- const checkbox = component.find('[data-test-subj="inputControlEditorPinFiltersCheckbox"] input[type="checkbox"]');
- checkbox.simulate('change', { target: { checked: true } });
+ const checkbox = component.find('[data-test-subj="inputControlEditorPinFiltersCheckbox"] button');
+ checkbox.simulate('click');
expect(props.setValue).toHaveBeenCalledTimes(1);
expect(props.setValue).toHaveBeenCalledWith('pinFilters', true);
diff --git a/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.test.tsx b/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.test.tsx
index badfbb4b14a4c..5054f7b4bdad1 100644
--- a/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.test.tsx
+++ b/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.test.tsx
@@ -121,7 +121,7 @@ describe('DiscoverFieldSearch', () => {
// @ts-ignore
(aggregtableButtonGroup.props() as EuiButtonGroupProps).onChange('aggregatable-true', null);
});
- missingSwitch.simulate('change', { target: { value: false } });
+ missingSwitch.simulate('click');
expect(onChange).toBeCalledTimes(2);
});
diff --git a/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.tsx b/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.tsx
index 3d93487d9e6cc..d5f6b63d12199 100644
--- a/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.tsx
+++ b/src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field_search.tsx
@@ -29,6 +29,7 @@ import {
EuiPopoverTitle,
EuiSelect,
EuiSwitch,
+ EuiSwitchEvent,
EuiForm,
EuiFormRow,
EuiButtonGroup,
@@ -154,7 +155,7 @@ export function DiscoverFieldSearch({ onChange, value, types }: Props) {
setActiveFiltersCount(activeFiltersCount + diff);
};
- const handleMissingChange = (e: React.ChangeEvent) => {
+ const handleMissingChange = (e: EuiSwitchEvent) => {
const missingValue = e.target.checked;
handleValueChange('missing', missingValue);
};
diff --git a/src/legacy/core_plugins/telemetry/public/components/__snapshots__/telemetry_form.test.js.snap b/src/legacy/core_plugins/telemetry/public/components/__snapshots__/telemetry_form.test.js.snap
index b96313fd700ac..3340197fda513 100644
--- a/src/legacy/core_plugins/telemetry/public/components/__snapshots__/telemetry_form.test.js.snap
+++ b/src/legacy/core_plugins/telemetry/public/components/__snapshots__/telemetry_form.test.js.snap
@@ -34,6 +34,7 @@ exports[`TelemetryForm renders as expected when allows to change optIn status 1`
save={[Function]}
setting={
Object {
+ "ariaName": "Provide usage statistics",
"defVal": false,
"description":
diff --git a/src/legacy/core_plugins/telemetry/public/components/telemetry_form.js b/src/legacy/core_plugins/telemetry/public/components/telemetry_form.js
index 80eb2da59c47e..aff830334d577 100644
--- a/src/legacy/core_plugins/telemetry/public/components/telemetry_form.js
+++ b/src/legacy/core_plugins/telemetry/public/components/telemetry_form.js
@@ -33,6 +33,7 @@ import { getConfigTelemetryDesc, PRIVACY_STATEMENT_URL } from '../../common/cons
import { OptInExampleFlyout } from './opt_in_details_component';
import { Field } from 'ui/management';
import { FormattedMessage } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
const SEARCH_TERMS = ['telemetry', 'usage', 'data', 'usage data'];
@@ -117,6 +118,7 @@ export class TelemetryForm extends Component {
value: telemetryOptInProvider.getOptIn() || false,
description: this.renderDescription(),
defVal: false,
+ ariaName: i18n.translate('telemetry.provideUsageStatisticsLabel', { defaultMessage: 'Provide usage statistics' })
}}
save={this.toggleOptIn}
clear={this.toggleOptIn}
diff --git a/src/legacy/ui/public/vis/editors/default/controls/auto_precision.tsx b/src/legacy/ui/public/vis/editors/default/controls/auto_precision.tsx
index 3b6aebe8c2b0c..53f74465e90a5 100644
--- a/src/legacy/ui/public/vis/editors/default/controls/auto_precision.tsx
+++ b/src/legacy/ui/public/vis/editors/default/controls/auto_precision.tsx
@@ -23,7 +23,7 @@ import { EuiSwitch, EuiFormRow } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { AggParamEditorProps } from '..';
-function AutoPrecisionParamEditor({ value, setValue }: AggParamEditorProps) {
+function AutoPrecisionParamEditor({ value = false, setValue }: AggParamEditorProps) {
const label = i18n.translate('common.ui.aggTypes.changePrecisionLabel', {
defaultMessage: 'Change precision on map zoom',
});
diff --git a/src/legacy/ui/public/vis/editors/default/controls/switch.tsx b/src/legacy/ui/public/vis/editors/default/controls/switch.tsx
index a5fc9682bd954..de675386d9100 100644
--- a/src/legacy/ui/public/vis/editors/default/controls/switch.tsx
+++ b/src/legacy/ui/public/vis/editors/default/controls/switch.tsx
@@ -30,7 +30,7 @@ interface SwitchParamEditorProps extends AggParamEditorProps {
}
function SwitchParamEditor({
- value,
+ value = false,
setValue,
dataTestSubj,
displayToolTip,
diff --git a/src/legacy/ui/public/vis/editors/default/controls/use_geocentroid.tsx b/src/legacy/ui/public/vis/editors/default/controls/use_geocentroid.tsx
index 6da32690912e7..932a4d19b495c 100644
--- a/src/legacy/ui/public/vis/editors/default/controls/use_geocentroid.tsx
+++ b/src/legacy/ui/public/vis/editors/default/controls/use_geocentroid.tsx
@@ -23,7 +23,7 @@ import { EuiSwitch, EuiFormRow } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { AggParamEditorProps } from '..';
-function UseGeocentroidParamEditor({ value, setValue }: AggParamEditorProps) {
+function UseGeocentroidParamEditor({ value = false, setValue }: AggParamEditorProps) {
const label = i18n.translate('common.ui.aggTypes.placeMarkersOffGridLabel', {
defaultMessage: 'Place markers off grid (use geocentroid)',
});
diff --git a/src/plugins/embeddable/public/tests/customize_panel_modal.test.tsx b/src/plugins/embeddable/public/tests/customize_panel_modal.test.tsx
index b11bd167e15f2..70d7c99d3fb9d 100644
--- a/src/plugins/embeddable/public/tests/customize_panel_modal.test.tsx
+++ b/src/plugins/embeddable/public/tests/customize_panel_modal.test.tsx
@@ -173,7 +173,7 @@ test('Can set title to an empty string', async () => {
);
const inputField = findTestSubject(component, 'customizePanelHideTitle');
- inputField.simulate('change');
+ inputField.simulate('click');
findTestSubject(component, 'saveNewTitleButton').simulate('click');
expect(inputField.props().value).toBeUndefined();
diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx
index 417f3436a2c63..0c075c497a4d0 100644
--- a/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx
+++ b/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx
@@ -18,7 +18,7 @@
*/
import React from 'react';
-import { EuiFormRow, EuiSwitch } from '@elastic/eui';
+import { EuiFormRow, EuiSwitch, EuiSwitchEvent } from '@elastic/eui';
import { FieldHook } from '../../hook_form_lib';
import { getFieldValidityAndErrorMessage } from '../helpers';
@@ -33,6 +33,14 @@ interface Props {
export const ToggleField = ({ field, euiFieldProps = {}, ...rest }: Props) => {
const { isInvalid, errorMessage } = getFieldValidityAndErrorMessage(field);
+ // Shim for sufficient overlap between EuiSwitchEvent and FieldHook[onChange] event
+ const onChange = (e: EuiSwitchEvent) => {
+ const event = ({ ...e, value: `${e.target.checked}` } as unknown) as React.ChangeEvent<{
+ value: string;
+ }>;
+ field.onChange(event);
+ };
+
return (
{
diff --git a/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
index e1e7f1c536342..bab710cdca595 100644
--- a/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
+++ b/src/plugins/kibana_react/public/saved_objects/saved_object_save_modal.tsx
@@ -32,6 +32,7 @@ import {
EuiOverlayMask,
EuiSpacer,
EuiSwitch,
+ EuiSwitchEvent,
EuiTextArea,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
@@ -227,7 +228,7 @@ export class SavedObjectSaveModal extends React.Component {
});
};
- private onCopyOnSaveChange = (event: React.ChangeEvent) => {
+ private onCopyOnSaveChange = (event: EuiSwitchEvent) => {
this.setState({
copyOnSave: event.target.checked,
});
diff --git a/test/functional/apps/visualize/input_control_vis/input_control_options.js b/test/functional/apps/visualize/input_control_vis/input_control_options.js
index b659d29b158b7..4088ab6193a59 100644
--- a/test/functional/apps/visualize/input_control_vis/input_control_options.js
+++ b/test/functional/apps/visualize/input_control_vis/input_control_options.js
@@ -133,13 +133,13 @@ export default function ({ getService, getPageObjects }) {
describe('updateFiltersOnChange is true', () => {
before(async () => {
await PageObjects.visualize.clickVisEditorTab('options');
- await PageObjects.visualize.checkCheckbox('inputControlEditorUpdateFiltersOnChangeCheckbox');
+ await PageObjects.visualize.checkSwitch('inputControlEditorUpdateFiltersOnChangeCheckbox');
await PageObjects.visualize.clickGo();
});
after(async () => {
await PageObjects.visualize.clickVisEditorTab('options');
- await PageObjects.visualize.uncheckCheckbox('inputControlEditorUpdateFiltersOnChangeCheckbox');
+ await PageObjects.visualize.uncheckSwitch('inputControlEditorUpdateFiltersOnChangeCheckbox');
await PageObjects.visualize.clickGo();
});
diff --git a/test/functional/page_objects/dashboard_page.js b/test/functional/page_objects/dashboard_page.js
index ca141114f976d..af3a15e9b3015 100644
--- a/test/functional/page_objects/dashboard_page.js
+++ b/test/functional/page_objects/dashboard_page.js
@@ -347,7 +347,7 @@ export function DashboardPageProvider({ getService, getPageObjects }) {
async clickSave() {
log.debug('DashboardPage.clickSave');
- await testSubjects.clickWhenNotDisabled('confirmSaveSavedObjectButton');
+ await testSubjects.click('confirmSaveSavedObjectButton');
}
async pressEnterKey() {
@@ -543,9 +543,10 @@ export function DashboardPageProvider({ getService, getPageObjects }) {
async setSaveAsNewCheckBox(checked) {
log.debug('saveAsNewCheckbox: ' + checked);
const saveAsNewCheckbox = await testSubjects.find('saveAsNewCheckbox');
- const isAlreadyChecked = (await saveAsNewCheckbox.getAttribute('checked') === 'true');
+ const isAlreadyChecked = (await saveAsNewCheckbox.getAttribute('aria-checked') === 'true');
if (isAlreadyChecked !== checked) {
log.debug('Flipping save as new checkbox');
+ const saveAsNewCheckbox = await testSubjects.find('saveAsNewCheckbox');
await retry.try(() => saveAsNewCheckbox.click());
}
}
@@ -553,9 +554,10 @@ export function DashboardPageProvider({ getService, getPageObjects }) {
async setStoreTimeWithDashboard(checked) {
log.debug('Storing time with dashboard: ' + checked);
const storeTimeCheckbox = await testSubjects.find('storeTimeWithDashboard');
- const isAlreadyChecked = (await storeTimeCheckbox.getAttribute('checked') === 'true');
+ const isAlreadyChecked = (await storeTimeCheckbox.getAttribute('aria-checked') === 'true');
if (isAlreadyChecked !== checked) {
log.debug('Flipping store time checkbox');
+ const storeTimeCheckbox = await testSubjects.find('storeTimeWithDashboard');
await retry.try(() => storeTimeCheckbox.click());
}
}
diff --git a/test/functional/page_objects/visualize_page.js b/test/functional/page_objects/visualize_page.js
index f3a90f20b6686..81d26a4b69478 100644
--- a/test/functional/page_objects/visualize_page.js
+++ b/test/functional/page_objects/visualize_page.js
@@ -372,6 +372,28 @@ export function VisualizePageProvider({ getService, getPageObjects, updateBaseli
}
}
+ async isSwitchChecked(selector) {
+ const checkbox = await testSubjects.find(selector);
+ const isChecked = await checkbox.getAttribute('aria-checked');
+ return isChecked === 'true';
+ }
+
+ async checkSwitch(selector) {
+ const isChecked = await this.isSwitchChecked(selector);
+ if (!isChecked) {
+ log.debug(`checking switch ${selector}`);
+ await testSubjects.click(selector);
+ }
+ }
+
+ async uncheckSwitch(selector) {
+ const isChecked = await this.isSwitchChecked(selector);
+ if (isChecked) {
+ log.debug(`unchecking switch ${selector}`);
+ await testSubjects.click(selector);
+ }
+ }
+
async setSelectByOptionText(selectId, optionText) {
const selectField = await find.byCssSelector(`#${selectId}`);
const options = await find.allByCssSelector(`#${selectId} > option`);
@@ -1009,7 +1031,7 @@ export function VisualizePageProvider({ getService, getPageObjects, updateBaseli
async setIsFilteredByCollarCheckbox(value = true) {
await retry.try(async () => {
- const isChecked = await this.isChecked('isFilteredByCollarCheckbox');
+ const isChecked = await this.isSwitchChecked('isFilteredByCollarCheckbox');
if (isChecked !== value) {
await testSubjects.click('isFilteredByCollarCheckbox');
throw new Error('isFilteredByCollar not set correctly');
diff --git a/test/functional/services/saved_query_management_component.ts b/test/functional/services/saved_query_management_component.ts
index f134fde028e09..d6de0be0c172e 100644
--- a/test/functional/services/saved_query_management_component.ts
+++ b/test/functional/services/saved_query_management_component.ts
@@ -118,15 +118,17 @@ export function SavedQueryManagementComponentProvider({ getService }: FtrProvide
await testSubjects.setValue('saveQueryFormDescription', description);
const currentIncludeFiltersValue =
- (await testSubjects.getAttribute('saveQueryFormIncludeFiltersOption', 'checked')) ===
+ (await testSubjects.getAttribute('saveQueryFormIncludeFiltersOption', 'aria-checked')) ===
'true';
if (currentIncludeFiltersValue !== includeFilters) {
await testSubjects.click('saveQueryFormIncludeFiltersOption');
}
const currentIncludeTimeFilterValue =
- (await testSubjects.getAttribute('saveQueryFormIncludeTimeFilterOption', 'checked')) ===
- 'true';
+ (await testSubjects.getAttribute(
+ 'saveQueryFormIncludeTimeFilterOption',
+ 'aria-checked'
+ )) === 'true';
if (currentIncludeTimeFilterValue !== includeTimeFilter) {
await testSubjects.click('saveQueryFormIncludeTimeFilterOption');
}
diff --git a/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json b/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
index 766e6168002c2..da1bb597f5730 100644
--- a/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
+++ b/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
@@ -7,7 +7,7 @@
},
"license": "Apache-2.0",
"dependencies": {
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"react": "^16.8.0",
"react-dom": "^16.8.0"
}
diff --git a/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json b/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
index 7c5b6f6be58af..4d0444265825a 100644
--- a/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
@@ -7,7 +7,7 @@
},
"license": "Apache-2.0",
"dependencies": {
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"react": "^16.8.0"
}
}
diff --git a/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json b/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
index ef472b4026957..196e64af39985 100644
--- a/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
@@ -8,7 +8,7 @@
},
"license": "Apache-2.0",
"dependencies": {
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"react": "^16.8.0"
},
"scripts": {
diff --git a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
index 277bb09ac745c..33e60128d0806 100644
--- a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
@@ -8,7 +8,7 @@
},
"license": "Apache-2.0",
"dependencies": {
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"react": "^16.8.0"
},
"scripts": {
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/simple_template.examples.storyshot b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/simple_template.examples.storyshot
index bf68d217f18ab..0b9358714e71c 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/simple_template.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/simple_template.examples.storyshot
@@ -13,23 +13,26 @@ exports[`Storyshots arguments/AxisConfig simple 1`] = `
-
-
-
-
+ className="euiSwitch__body"
+ >
+
+
+
+
`;
@@ -47,23 +50,26 @@ exports[`Storyshots arguments/AxisConfig/components simple template 1`] = `
-
-
-
-
+ className="euiSwitch__body"
+ >
+
+
+
+
`;
diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/simple_template.tsx b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/simple_template.tsx
index eb32881bc1f6d..068854866dc1b 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/simple_template.tsx
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/simple_template.tsx
@@ -19,6 +19,8 @@ export const SimpleTemplate: FunctionComponent = ({ onValueChange, argVal
compressed
checked={Boolean(argValue)}
onChange={() => onValueChange(!Boolean(argValue))}
+ showLabel={false}
+ label=""
/>
);
};
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/components/__tests__/app.test.tsx b/x-pack/legacy/plugins/canvas/shareable_runtime/components/__tests__/app.test.tsx
index db0aac34336ea..9cf2ddc3a22e3 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/components/__tests__/app.test.tsx
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/components/__tests__/app.test.tsx
@@ -111,7 +111,7 @@ describe('', () => {
wrapper.update();
expect(footer(wrapper).prop('isHidden')).toEqual(false);
expect(footer(wrapper).prop('isAutohide')).toEqual(false);
- toolbarCheck(wrapper).simulate('change');
+ toolbarCheck(wrapper).simulate('click');
expect(footer(wrapper).prop('isAutohide')).toEqual(true);
canvas(wrapper).simulate('mouseEnter');
expect(footer(wrapper).prop('isHidden')).toEqual(false);
@@ -132,7 +132,7 @@ describe('', () => {
.simulate('click');
await tick(20);
wrapper.update();
- toolbarCheck(wrapper).simulate('change');
+ toolbarCheck(wrapper).simulate('click');
await tick(20);
// Simulate the mouse leaving the container
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__examples__/__snapshots__/autoplay_settings.examples.storyshot b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__examples__/__snapshots__/autoplay_settings.examples.storyshot
index b159e6499ed9f..1e66e19b3c0e1 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__examples__/__snapshots__/autoplay_settings.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__examples__/__snapshots__/autoplay_settings.examples.storyshot
@@ -25,49 +25,52 @@ exports[`Storyshots shareables/Footer/Settings/AutoplaySettings component: off,
-
-
-
-
-
+
+
+
+
-
-
+
-
-
-
-
-
+
+
+
+
-
-
+
-
-
-
-
-
+
+
+
+
-
-
+
-
-
-
-
-
+
+
+
+
-
-
+
-
-
-
-
-
+
+
+
+
-
-
+
-
-
-
-
-
+
+
+
+
-
-
+
can navigate Autoplay Settings 1`] = `
data-focus-lock-disabled="disabled"
>
can navigate Autoplay Settings 2`] = `
data-focus-lock-disabled="disabled"
>
can navigate Autoplay Settings 2`] = `
-
-
-
-
+
-
-
-
+
+
+
-
-
+
can navigate Toolbar Settings, closes when activated 1`] =
data-focus-lock-disabled="disabled"
>
can navigate Toolbar Settings, closes when activated 1`] =
`;
-exports[` can navigate Toolbar Settings, closes when activated 2`] = `""`;
+exports[` can navigate Toolbar Settings, closes when activated 2`] = `""`;
-exports[` can navigate Toolbar Settings, closes when activated 3`] = `""`;
+exports[` can navigate Toolbar Settings, closes when activated 3`] = `""`;
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/autoplay_settings.test.tsx b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/autoplay_settings.test.tsx
index 04b0de57ad3c1..9da88755e6fd7 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/autoplay_settings.test.tsx
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/autoplay_settings.test.tsx
@@ -24,15 +24,15 @@ describe('', () => {
);
test('renders as expected', () => {
- expect(checkbox(wrapper).props().checked).toEqual(false);
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(false);
expect(input(wrapper).props().value).toBe('5s');
});
test('activates and deactivates', () => {
- checkbox(wrapper).simulate('change');
- expect(checkbox(wrapper).props().checked).toEqual(true);
- checkbox(wrapper).simulate('change');
- expect(checkbox(wrapper).props().checked).toEqual(false);
+ checkbox(wrapper).simulate('click');
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(true);
+ checkbox(wrapper).simulate('click');
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(false);
});
test('changes properly with input', () => {
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/settings.test.tsx b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/settings.test.tsx
index 5ebb30d79e046..6957e8599c0fd 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/settings.test.tsx
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/settings.test.tsx
@@ -85,8 +85,8 @@ describe('', () => {
// Click the Hide Toolbar switch
portal(wrapper)
- .find('input[data-test-subj="hideToolbarSwitch"]')
- .simulate('change');
+ .find('button[data-test-subj="hideToolbarSwitch"]')
+ .simulate('click');
// Wait for the animation and DOM update
await tick(20);
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/toolbar_settings.test.tsx b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/toolbar_settings.test.tsx
index 56d11056edfc9..67016eed7c11d 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/toolbar_settings.test.tsx
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/components/footer/settings/__tests__/toolbar_settings.test.tsx
@@ -20,13 +20,13 @@ describe('', () => {
);
test('renders as expected', () => {
- expect(checkbox(wrapper).props().checked).toEqual(false);
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(false);
});
test('activates and deactivates', () => {
- checkbox(wrapper).simulate('change');
- expect(checkbox(wrapper).props().checked).toEqual(true);
- checkbox(wrapper).simulate('change');
- expect(checkbox(wrapper).props().checked).toEqual(false);
+ checkbox(wrapper).simulate('click');
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(true);
+ checkbox(wrapper).simulate('click');
+ expect(checkbox(wrapper).props()['aria-checked']).toEqual(false);
});
});
diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/test/selectors.ts b/x-pack/legacy/plugins/canvas/shareable_runtime/test/selectors.ts
index a52050f4ee5d8..852c4ec9aadac 100644
--- a/x-pack/legacy/plugins/canvas/shareable_runtime/test/selectors.ts
+++ b/x-pack/legacy/plugins/canvas/shareable_runtime/test/selectors.ts
@@ -21,7 +21,7 @@ export const getToolbarPanel = (wrapper: ReactWrapper) =>
export const getToolbarCheckbox = (wrapper: ReactWrapper) =>
getToolbarPanel(wrapper)
.find('EuiSwitch')
- .find('input[type="checkbox"]');
+ .find('button');
export const getAutoplayPanel = (wrapper: ReactWrapper) =>
wrapper.find('AutoplaySettings > AutoplaySettingsComponent');
@@ -29,7 +29,7 @@ export const getAutoplayPanel = (wrapper: ReactWrapper) =>
export const getAutoplayCheckbox = (wrapper: ReactWrapper) =>
getAutoplayPanel(wrapper)
.find('EuiSwitch')
- .find('input[type="checkbox"]');
+ .find('button');
export const getAutoplayTextField = (wrapper: ReactWrapper) =>
getAutoplayPanel(wrapper)
diff --git a/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_add.helpers.js b/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_add.helpers.js
index bb8c882bf490f..f46a983c75308 100644
--- a/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_add.helpers.js
+++ b/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_add.helpers.js
@@ -27,7 +27,7 @@ export const setup = (props) => {
};
const toggleAdvancedSettings = () => {
- testBed.form.selectCheckBox('advancedSettingsToggle');
+ testBed.form.toggleEuiSwitch('advancedSettingsToggle');
};
return {
diff --git a/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_edit.helpers.js b/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_edit.helpers.js
index 41fa2bba40dba..337328187cfee 100644
--- a/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_edit.helpers.js
+++ b/x-pack/legacy/plugins/cross_cluster_replication/__jest__/client_integration/helpers/follower_index_edit.helpers.js
@@ -34,7 +34,7 @@ export const setup = (props) => {
};
const toggleAdvancedSettings = () => {
- testBed.form.selectCheckBox('advancedSettingsToggle');
+ testBed.form.toggleEuiSwitch('advancedSettingsToggle');
};
return {
diff --git a/x-pack/legacy/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js b/x-pack/legacy/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js
index 2b19669e288f8..a97296e94042d 100644
--- a/x-pack/legacy/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js
+++ b/x-pack/legacy/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js
@@ -66,7 +66,7 @@ window.TextEncoder = null;
let component;
const activatePhase = (rendered, phase) => {
const testSubject = `enablePhaseSwitch-${phase}`;
- findTestSubject(rendered, testSubject).simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, testSubject).simulate('click');
rendered.update();
};
const expectedErrorMessages = (rendered, expectedErrorMessages) => {
@@ -83,7 +83,7 @@ const expectedErrorMessages = (rendered, expectedErrorMessages) => {
});
};
const noRollover = (rendered) => {
- findTestSubject(rendered, 'rolloverSwitch').simulate('change', { target: { checked: false } });
+ findTestSubject(rendered, 'rolloverSwitch').simulate('click');
rendered.update();
};
const getNodeAttributeSelect = (rendered, phase) => {
@@ -155,7 +155,7 @@ describe('edit policy', () => {
);
const rendered = mountWithIntl(component);
- findTestSubject(rendered, 'saveAsNewSwitch').simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, 'saveAsNewSwitch').simulate('click');
rendered.update();
setPolicyName(rendered, 'testy0');
save(rendered);
@@ -275,7 +275,7 @@ describe('edit policy', () => {
noRollover(rendered);
setPolicyName(rendered, 'mypolicy');
activatePhase(rendered, 'warm');
- findTestSubject(rendered, 'shrinkSwitch').simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, 'shrinkSwitch').simulate('click');
rendered.update();
setPhaseAfter(rendered, 'warm', 1);
const shrinkInput = rendered.find('input#warm-selectedPrimaryShardCount');
@@ -290,7 +290,7 @@ describe('edit policy', () => {
setPolicyName(rendered, 'mypolicy');
activatePhase(rendered, 'warm');
setPhaseAfter(rendered, 'warm', 1);
- findTestSubject(rendered, 'shrinkSwitch').simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, 'shrinkSwitch').simulate('click');
rendered.update();
const shrinkInput = rendered.find('input#warm-selectedPrimaryShardCount');
shrinkInput.simulate('change', { target: { value: '-1' } });
@@ -304,7 +304,7 @@ describe('edit policy', () => {
setPolicyName(rendered, 'mypolicy');
activatePhase(rendered, 'warm');
setPhaseAfter(rendered, 'warm', 1);
- findTestSubject(rendered, 'forceMergeSwitch').simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, 'forceMergeSwitch').simulate('click');
rendered.update();
const shrinkInput = rendered.find('input#warm-selectedForceMergeSegments');
shrinkInput.simulate('change', { target: { value: '0' } });
@@ -318,7 +318,7 @@ describe('edit policy', () => {
setPolicyName(rendered, 'mypolicy');
activatePhase(rendered, 'warm');
setPhaseAfter(rendered, 'warm', 1);
- findTestSubject(rendered, 'forceMergeSwitch').simulate('change', { target: { checked: true } });
+ findTestSubject(rendered, 'forceMergeSwitch').simulate('click');
rendered.update();
const shrinkInput = rendered.find('input#warm-selectedForceMergeSegments');
shrinkInput.simulate('change', { target: { value: '-1' } });
diff --git a/x-pack/legacy/plugins/index_management/__jest__/components/index_table.test.js b/x-pack/legacy/plugins/index_management/__jest__/components/index_table.test.js
index 278ec918100d9..5ab1f3552320b 100644
--- a/x-pack/legacy/plugins/index_management/__jest__/components/index_table.test.js
+++ b/x-pack/legacy/plugins/index_management/__jest__/components/index_table.test.js
@@ -182,8 +182,8 @@ describe('index table', () => {
)
.map(span => span.text())
);
- const switchControl = rendered.find('.euiSwitch__input');
- switchControl.simulate('change', { target: { checked: true } });
+ const switchControl = rendered.find('.euiSwitch__button');
+ switchControl.simulate('click');
snapshot(
rendered
.find(
diff --git a/x-pack/legacy/plugins/infra/public/components/waffle/legend_controls.tsx b/x-pack/legacy/plugins/infra/public/components/waffle/legend_controls.tsx
index dc4860355651a..f6e4a65eead24 100644
--- a/x-pack/legacy/plugins/infra/public/components/waffle/legend_controls.tsx
+++ b/x-pack/legacy/plugins/infra/public/components/waffle/legend_controls.tsx
@@ -16,6 +16,7 @@ import {
EuiPopoverTitle,
EuiSpacer,
EuiSwitch,
+ EuiSwitchEvent,
EuiText,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
@@ -48,8 +49,8 @@ export const LegendControls = ({ autoBounds, boundsOverride, onChange, dataBound
/>
);
- const handleAutoChange = (e: SyntheticEvent) => {
- setDraftAuto(e.currentTarget.checked);
+ const handleAutoChange = (e: EuiSwitchEvent) => {
+ setDraftAuto(e.target.checked);
};
const createBoundsHandler = (name: string) => (e: SyntheticEvent) => {
diff --git a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.test.tsx b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.test.tsx
index d19493d579b64..a50d3371f47cf 100644
--- a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.test.tsx
+++ b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.test.tsx
@@ -8,7 +8,7 @@ import React from 'react';
import { DateHistogramIndexPatternColumn } from './date_histogram';
import { dateHistogramOperation } from '.';
import { shallow } from 'enzyme';
-import { EuiSwitch } from '@elastic/eui';
+import { EuiSwitch, EuiSwitchEvent } from '@elastic/eui';
import {
UiSettingsClientContract,
SavedObjectsClientContract,
@@ -423,7 +423,7 @@ describe('date_histogram', () => {
);
instance.find(EuiSwitch).prop('onChange')!({
target: { checked: true },
- } as React.ChangeEvent);
+ } as EuiSwitchEvent);
expect(setStateSpy).toHaveBeenCalled();
const newState = setStateSpy.mock.calls[0][0];
expect(newState).toHaveProperty('layers.third.columns.col1.params.interval', '30d');
diff --git a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.tsx b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.tsx
index 017dccab64607..944a23c9af193 100644
--- a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.tsx
+++ b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/operations/definitions/date_histogram.tsx
@@ -15,6 +15,7 @@ import {
EuiForm,
EuiFormRow,
EuiSwitch,
+ EuiSwitchEvent,
EuiFieldNumber,
EuiSelect,
EuiFlexItem,
@@ -154,7 +155,7 @@ export const dateHistogramOperation: OperationDefinition) {
+ function onChangeAutoInterval(ev: EuiSwitchEvent) {
const value = ev.target.checked ? autoIntervalFromDateRange(dateRange) : autoInterval;
setState(updateColumnParam({ state, layerId, currentColumn, paramName: 'interval', value }));
}
diff --git a/x-pack/legacy/plugins/ml/public/data_frame_analytics/pages/analytics_management/components/create_analytics_form/create_analytics_form.test.tsx b/x-pack/legacy/plugins/ml/public/data_frame_analytics/pages/analytics_management/components/create_analytics_form/create_analytics_form.test.tsx
index b1e7ec33c88ba..1371eacef799b 100644
--- a/x-pack/legacy/plugins/ml/public/data_frame_analytics/pages/analytics_management/components/create_analytics_form/create_analytics_form.test.tsx
+++ b/x-pack/legacy/plugins/ml/public/data_frame_analytics/pages/analytics_management/components/create_analytics_form/create_analytics_form.test.tsx
@@ -56,6 +56,6 @@ describe('Data Frame Analytics: ', () => {
expect(options.at(2).props().value).toBe('regression');
const row2 = euiFormRows.at(1);
- expect(row2.find('label').text()).toBe('Enable advanced editor');
+ expect(row2.find('p').text()).toBe('Enable advanced editor');
});
});
diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/dedicated_index/dedicated_index_switch.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/dedicated_index/dedicated_index_switch.tsx
index 13c835952e251..5c8f346d71baf 100644
--- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/dedicated_index/dedicated_index_switch.tsx
+++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/dedicated_index/dedicated_index_switch.tsx
@@ -5,6 +5,7 @@
*/
import React, { FC, useState, useContext, useEffect } from 'react';
+import { i18n } from '@kbn/i18n';
import { EuiSwitch } from '@elastic/eui';
import { JobCreatorContext } from '../../../../../job_creator_context';
import { Description } from './description';
@@ -29,6 +30,13 @@ export const DedicatedIndexSwitch: FC = () => {
checked={useDedicatedIndex}
onChange={toggleModelPlot}
data-test-subj="mlJobWizardSwitchUseDedicatedIndex"
+ showLabel={false}
+ label={i18n.translate(
+ 'xpack.ml.newJob.wizard.jobDetailsStep.advancedSection.useDedicatedIndex.title',
+ {
+ defaultMessage: 'Use dedicated index',
+ }
+ )}
/>
);
diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/model_plot/model_plot_switch.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/model_plot/model_plot_switch.tsx
index 963730f4279b8..41ac4311b71ce 100644
--- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/model_plot/model_plot_switch.tsx
+++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/advanced_section/components/model_plot/model_plot_switch.tsx
@@ -5,6 +5,7 @@
*/
import React, { FC, useState, useContext, useEffect } from 'react';
+import { i18n } from '@kbn/i18n';
import { EuiSwitch } from '@elastic/eui';
import { JobCreatorContext } from '../../../../../job_creator_context';
import { Description } from './description';
@@ -29,6 +30,13 @@ export const ModelPlotSwitch: FC = () => {
checked={modelPlotEnabled}
onChange={toggleModelPlot}
data-test-subj="mlJobWizardSwitchModelPlot"
+ showLabel={false}
+ label={i18n.translate(
+ 'xpack.ml.newJob.wizard.jobDetailsStep.advancedSection.enableModelPlot.title',
+ {
+ defaultMessage: 'Enable model plot',
+ }
+ )}
/>
);
diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/sparse_data/sparse_data_switch.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/sparse_data/sparse_data_switch.tsx
index 9586110639917..3f2c45f0c62bd 100644
--- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/sparse_data/sparse_data_switch.tsx
+++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/sparse_data/sparse_data_switch.tsx
@@ -5,6 +5,7 @@
*/
import React, { FC, useState, useContext, useEffect } from 'react';
+import { i18n } from '@kbn/i18n';
import { EuiSwitch } from '@elastic/eui';
import { JobCreatorContext } from '../../../job_creator_context';
import { Description } from './description';
@@ -43,6 +44,10 @@ export const SparseDataSwitch: FC = () => {
checked={sparseData}
onChange={toggleSparseData}
data-test-subj="mlJobWizardSwitchSparseData"
+ showLabel={false}
+ label={i18n.translate('xpack.ml.newJob.wizard.pickFieldsStep.sparseData.title', {
+ defaultMessage: 'Sparse data',
+ })}
/>
);
diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/recognize/components/job_settings_form.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/recognize/components/job_settings_form.tsx
index bab45a7d77a3d..8dda1415a0ab8 100644
--- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/recognize/components/job_settings_form.tsx
+++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/recognize/components/job_settings_form.tsx
@@ -247,6 +247,10 @@ export const JobSettingsForm: FC = ({
useDedicatedIndex: checked,
});
}}
+ showLabel={false}
+ label={i18n.translate('xpack.ml.newJob.recognize.useDedicatedIndexLabel', {
+ defaultMessage: 'Use dedicated index',
+ })}
/>
diff --git a/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_add.test.js b/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_add.test.js
index 1e64435da63dd..ec9ec87cd2823 100644
--- a/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_add.test.js
+++ b/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_add.test.js
@@ -42,11 +42,11 @@ describe('Create Remote cluster', () => {
expect(exists('remoteClusterFormSkipUnavailableFormToggle')).toBe(true);
// By default it should be set to "false"
- expect(find('remoteClusterFormSkipUnavailableFormToggle').props().checked).toBe(false);
+ expect(find('remoteClusterFormSkipUnavailableFormToggle').props()['aria-checked']).toBe(false);
form.toggleEuiSwitch('remoteClusterFormSkipUnavailableFormToggle');
- expect(find('remoteClusterFormSkipUnavailableFormToggle').props().checked).toBe(true);
+ expect(find('remoteClusterFormSkipUnavailableFormToggle').props()['aria-checked']).toBe(true);
});
test('should display errors and disable the save button when clicking "save" without filling the form', () => {
diff --git a/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_edit.test.js b/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_edit.test.js
index bdd5dd3cc4c30..c4ac689b7ddc0 100644
--- a/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_edit.test.js
+++ b/x-pack/legacy/plugins/remote_clusters/__jest__/client_integration/remote_clusters_edit.test.js
@@ -64,7 +64,7 @@ describe('Edit Remote cluster', () => {
test('should populate the form fields with the values from the remote cluster loaded', () => {
expect(find('remoteClusterFormNameInput').props().value).toBe(REMOTE_CLUSTER_EDIT_NAME);
expect(find('remoteClusterFormSeedsInput').text()).toBe(REMOTE_CLUSTER_EDIT.seeds.join(''));
- expect(find('remoteClusterFormSkipUnavailableFormToggle').props().checked).toBe(REMOTE_CLUSTER_EDIT.skipUnavailable);
+ expect(find('remoteClusterFormSkipUnavailableFormToggle').props()['aria-checked']).toBe(REMOTE_CLUSTER_EDIT.skipUnavailable);
});
test('should disable the form name input', () => {
diff --git a/x-pack/legacy/plugins/remote_clusters/public/app/sections/components/remote_cluster_form/__snapshots__/remote_cluster_form.test.js.snap b/x-pack/legacy/plugins/remote_clusters/public/app/sections/components/remote_cluster_form/__snapshots__/remote_cluster_form.test.js.snap
index 517a99583a54d..cf8cf37d2e4ee 100644
--- a/x-pack/legacy/plugins/remote_clusters/public/app/sections/components/remote_cluster_form/__snapshots__/remote_cluster_form.test.js.snap
+++ b/x-pack/legacy/plugins/remote_clusters/public/app/sections/components/remote_cluster_form/__snapshots__/remote_cluster_form.test.js.snap
@@ -247,45 +247,49 @@ Array [
-
-
-
-
-
+
+
+
+
-
-
+
@@ -502,45 +506,49 @@ Array [
-
-
-
-
-
+
+
+
+
-
-
+
,
diff --git a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/__snapshots__/job_switch.test.tsx.snap b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/__snapshots__/job_switch.test.tsx.snap
index 7f7c63504f317..3cbfd1fa024de 100644
--- a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/__snapshots__/job_switch.test.tsx.snap
+++ b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/__snapshots__/job_switch.test.tsx.snap
@@ -11,7 +11,9 @@ exports[`JobSwitch renders correctly against snapshot 1`] = `
checked={false}
data-test-subj="job-switch"
disabled={false}
+ label=""
onChange={[Function]}
+ showLabel={false}
/>
diff --git a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.test.tsx b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.test.tsx
index 2e869cce9ddf7..de703ca819388 100644
--- a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.test.tsx
@@ -42,9 +42,9 @@ describe('JobSwitch', () => {
);
wrapper
- .find('[data-test-subj="job-switch"] input')
+ .find('button[data-test-subj="job-switch"]')
.first()
- .simulate('change', {
+ .simulate('click', {
target: { checked: true },
});
diff --git a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.tsx b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.tsx
index b62478acaf197..30e7aa368e74f 100644
--- a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/job_switch.tsx
@@ -59,6 +59,8 @@ export const JobSwitch = React.memo(
setIsLoading(true);
onJobStateChange(job, job.latestTimestampMs || 0, e.target.checked);
}}
+ showLabel={false}
+ label=""
/>
)}
diff --git a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/jobs_table.test.tsx b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/jobs_table.test.tsx
index 5bd1660d2db48..10c9587ea10ad 100644
--- a/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/jobs_table.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/ml_popover/jobs_table/jobs_table.test.tsx
@@ -59,9 +59,9 @@ describe('JobsTable', () => {
);
wrapper
- .find('[data-test-subj="job-switch"] input')
+ .find('button[data-test-subj="job-switch"]')
.first()
- .simulate('change', {
+ .simulate('click', {
target: { checked: true },
});
expect(onJobStateChangeMock.mock.calls[0]).toEqual([siemJobs[0], 1571022859393, true]);
diff --git a/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/is_ptr_included.test.tsx b/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/is_ptr_included.test.tsx
index 03c0d2485c41b..e39723f57f0b0 100644
--- a/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/is_ptr_included.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/is_ptr_included.test.tsx
@@ -31,9 +31,9 @@ describe('NetworkTopNFlow Select direction', () => {
const wrapper = mount();
wrapper
- .find('input')
+ .find('button')
.first()
- .simulate('change', event);
+ .simulate('click', event);
wrapper.update();
diff --git a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/enabled_features/feature_table.tsx b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/enabled_features/feature_table.tsx
index e40bd161b68b2..91f14cf228c55 100644
--- a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/enabled_features/feature_table.tsx
+++ b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/enabled_features/feature_table.tsx
@@ -102,9 +102,8 @@ export class FeatureTable extends Component {
id={record.feature.id}
checked={checked}
onChange={this.onChange(record.feature.id) as any}
- aria-label={
- checked ? `${record.feature.name} visible` : `${record.feature.name} disabled`
- }
+ label={`${record.feature.name} visible`}
+ showLabel={false}
/>
);
},
diff --git a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/manage_space_page.test.tsx b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/manage_space_page.test.tsx
index 1763107b407ed..ffcf11d76ac88 100644
--- a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/manage_space_page.test.tsx
+++ b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/manage_space_page.test.tsx
@@ -233,8 +233,8 @@ function toggleFeature(wrapper: ReactWrapper) {
wrapper
.find(EuiSwitch)
- .find('input')
- .simulate('change', { target: { checked: false } });
+ .find('button')
+ .simulate('click');
wrapper.update();
}
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/deprecation_logging_toggle.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/deprecation_logging_toggle.tsx
index 12b2bfb1e8ce4..8d107331eb65f 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/deprecation_logging_toggle.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/deprecation_logging_toggle.tsx
@@ -47,7 +47,7 @@ export class DeprecationLoggingToggleUI extends React.Component<
id="xpack.upgradeAssistant.overviewTab.steps.deprecationLogsStep.enableDeprecationLoggingToggleSwitch"
data-test-subj="upgradeAssistantDeprecationToggle"
label={this.renderLoggingState()}
- checked={loggingEnabled}
+ checked={loggingEnabled || false}
onChange={this.toggleLogging}
disabled={loadingState === LoadingState.Loading || loadingState === LoadingState.Error}
/>
diff --git a/x-pack/package.json b/x-pack/package.json
index cc5b465385785..d26211a059224 100644
--- a/x-pack/package.json
+++ b/x-pack/package.json
@@ -183,7 +183,7 @@
"@elastic/ctags-langserver": "^0.1.11",
"@elastic/datemath": "5.0.2",
"@elastic/ems-client": "1.0.5",
- "@elastic/eui": "14.8.0",
+ "@elastic/eui": "14.9.0",
"@elastic/filesaver": "1.1.2",
"@elastic/javascript-typescript-langserver": "^0.3.3",
"@elastic/lsp-extension": "^0.1.2",
diff --git a/x-pack/test/functional/page_objects/gis_page.js b/x-pack/test/functional/page_objects/gis_page.js
index 2da9b1d8e874c..ef93a936ead19 100644
--- a/x-pack/test/functional/page_objects/gis_page.js
+++ b/x-pack/test/functional/page_objects/gis_page.js
@@ -310,14 +310,13 @@ export function GisPageProvider({ getService, getPageObjects }) {
}
async disableApplyGlobalQuery() {
- const element = await testSubjects.find('mapLayerPanelApplyGlobalQueryCheckbox');
- const isSelected = await element.isSelected();
- if(isSelected) {
+ const isSelected = await testSubjects.getAttribute('mapLayerPanelApplyGlobalQueryCheckbox', 'aria-checked');
+ if(isSelected === 'true') {
await retry.try(async () => {
log.debug(`disabling applyGlobalQuery`);
await testSubjects.click('mapLayerPanelApplyGlobalQueryCheckbox');
- const isStillSelected = await element.isSelected();
- if (isStillSelected) {
+ const isStillSelected = await testSubjects.getAttribute('mapLayerPanelApplyGlobalQueryCheckbox', 'aria-checked');
+ if (isStillSelected === 'true') {
throw new Error('applyGlobalQuery not disabled');
}
});
diff --git a/x-pack/test/functional/page_objects/upgrade_assistant.js b/x-pack/test/functional/page_objects/upgrade_assistant.js
index af9d5ea55cec6..c6977b2150840 100644
--- a/x-pack/test/functional/page_objects/upgrade_assistant.js
+++ b/x-pack/test/functional/page_objects/upgrade_assistant.js
@@ -45,7 +45,7 @@ export function UpgradeAssistantProvider({ getService, getPageObjects }) {
async expectDeprecationLoggingLabel(labelText) {
return await retry.try(async () => {
log.debug('expectDeprecationLoggingLabel()');
- const label = await find.byCssSelector('[data-test-subj="upgradeAssistantDeprecationToggle"] ~ label');
+ const label = await find.byCssSelector('[data-test-subj="upgradeAssistantDeprecationToggle"] ~ p');
const value = await label.getVisibleText();
expect(value).to.equal(labelText);
});
diff --git a/x-pack/test/functional/services/machine_learning/job_wizard_common.ts b/x-pack/test/functional/services/machine_learning/job_wizard_common.ts
index 3a71f96fa3fbd..0ebc4cb959412 100644
--- a/x-pack/test/functional/services/machine_learning/job_wizard_common.ts
+++ b/x-pack/test/functional/services/machine_learning/job_wizard_common.ts
@@ -181,11 +181,12 @@ export function MachineLearningJobWizardCommonProvider({ getService }: FtrProvid
sectionOptions: SectionOptions = { withAdvancedSection: true }
): Promise {
let subj = 'mlJobWizardSwitchModelPlot';
+ const isSelected = await testSubjects.getAttribute(subj, 'aria-checked');
if (sectionOptions.withAdvancedSection === true) {
await this.ensureAdvancedSectionOpen();
subj = advancedSectionSelector(subj);
}
- return await testSubjects.isSelected(subj);
+ return isSelected === 'true';
},
async assertModelPlotSwitchCheckedState(
@@ -213,11 +214,12 @@ export function MachineLearningJobWizardCommonProvider({ getService }: FtrProvid
sectionOptions: SectionOptions = { withAdvancedSection: true }
): Promise {
let subj = 'mlJobWizardSwitchUseDedicatedIndex';
+ const isSelected = await testSubjects.getAttribute(subj, 'aria-checked');
if (sectionOptions.withAdvancedSection === true) {
await this.ensureAdvancedSectionOpen();
subj = advancedSectionSelector(subj);
}
- return await testSubjects.isSelected(subj);
+ return isSelected === 'true';
},
async assertDedicatedIndexSwitchCheckedState(
diff --git a/x-pack/test_utils/testbed/testbed.ts b/x-pack/test_utils/testbed/testbed.ts
index 83a94cfe42f18..f32fb42a8a8b0 100644
--- a/x-pack/test_utils/testbed/testbed.ts
+++ b/x-pack/test_utils/testbed/testbed.ts
@@ -174,7 +174,13 @@ export const registerTestBed = (
checkBox.simulate('change', { target: { checked: isChecked } });
};
- const toggleEuiSwitch: TestBed['form']['toggleEuiSwitch'] = selectCheckBox; // Same API as "selectCheckBox"
+ const toggleEuiSwitch: TestBed['form']['toggleEuiSwitch'] = testSubject => {
+ const checkBox = find(testSubject);
+ if (!checkBox.length) {
+ throw new Error(`"${testSubject}" was not found.`);
+ }
+ checkBox.simulate('click');
+ };
const setComboBoxValue: TestBed['form']['setComboBoxValue'] = (
comboBoxTestSubject,
diff --git a/yarn.lock b/yarn.lock
index dd265189a12f3..05311eee9f2e9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1151,10 +1151,10 @@
tabbable "^1.1.0"
uuid "^3.1.0"
-"@elastic/eui@14.8.0":
- version "14.8.0"
- resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-14.8.0.tgz#777d29852998e52e8fc6dfb1869a4b32d74c72bb"
- integrity sha512-p6TZv6Z+ENzw6JnCyXVQtvEOo7eEct8Qb/S4aS4EXK1WIyGB35Ra/a/pb3bLQbbZ2mSZtCr1sk+XVUq0qDpytw==
+"@elastic/eui@14.9.0":
+ version "14.9.0"
+ resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-14.9.0.tgz#934ab8d51c56671635dc17ac20ec325f43ceda75"
+ integrity sha512-0ZztvfRO3SNgHtS8a+4i6CSG3Yc+C0Kodzc7obY5wkOzissrnbwLZdU79hU/H6DHYCt/zYDdGcrDp6BeD67RtQ==
dependencies:
"@types/lodash" "^4.14.116"
"@types/numeral" "^0.0.25"