From 0390251f6972009b11d178041456240d6187b81b Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Fri, 20 Mar 2020 21:29:06 -0700 Subject: [PATCH] Fixed UI/UX issues: alerts delete confirmation, combobox behaviors (#60703) * Fixed UI/UX issues: alerts delete confirmation * Fixed 4. Popover disappears when clearing the field selector * Fixed tests * Fixed due to comments * fixed tests * Fixed test --- .../components/delete_connectors_modal.tsx | 91 --------------- .../components/delete_modal_confirmation.tsx | 105 ++++++++++++++++++ .../public/application/lib/alert_api.test.ts | 16 +-- .../public/application/lib/alert_api.ts | 18 ++- .../components/actions_connectors_list.tsx | 53 +++++---- .../alerts_list/components/alerts_list.tsx | 46 +++++++- .../components/collapsed_item_actions.tsx | 8 +- .../components/alert_quick_edit_buttons.tsx | 5 +- .../with_bulk_alert_api_operations.test.tsx | 4 +- .../with_bulk_alert_api_operations.tsx | 17 ++- .../public/common/expression_items/of.tsx | 4 +- .../apps/triggers_actions_ui/alerts.ts | 21 +++- .../apps/triggers_actions_ui/connectors.ts | 12 +- 13 files changed, 242 insertions(+), 158 deletions(-) delete mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/delete_connectors_modal.tsx create mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/delete_modal_confirmation.tsx diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/delete_connectors_modal.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/delete_connectors_modal.tsx deleted file mode 100644 index b7d1a4ffe2966..0000000000000 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/delete_connectors_modal.tsx +++ /dev/null @@ -1,91 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ -import { EuiConfirmModal, EuiOverlayMask } from '@elastic/eui'; -import { i18n } from '@kbn/i18n'; -import React from 'react'; -import { useAppDependencies } from '../app_context'; -import { deleteActions } from '../lib/action_connector_api'; - -export const DeleteConnectorsModal = ({ - connectorsToDelete, - callback, -}: { - connectorsToDelete: string[]; - callback: (deleted?: string[]) => void; -}) => { - const { http, toastNotifications } = useAppDependencies(); - const numConnectorsToDelete = connectorsToDelete.length; - if (!numConnectorsToDelete) { - return null; - } - const confirmModalText = i18n.translate( - 'xpack.triggersActionsUI.deleteSelectedConnectorsConfirmModal.descriptionText', - { - defaultMessage: - "You can't recover {numConnectorsToDelete, plural, one {a deleted connector} other {deleted connectors}}.", - values: { numConnectorsToDelete }, - } - ); - const confirmButtonText = i18n.translate( - 'xpack.triggersActionsUI.deleteSelectedConnectorsConfirmModal.deleteButtonLabel', - { - defaultMessage: - 'Delete {numConnectorsToDelete, plural, one {connector} other {# connectors}} ', - values: { numConnectorsToDelete }, - } - ); - const cancelButtonText = i18n.translate( - 'xpack.triggersActionsUI.deleteSelectedConnectorsConfirmModal.cancelButtonLabel', - { - defaultMessage: 'Cancel', - } - ); - return ( - - callback()} - onConfirm={async () => { - const { successes, errors } = await deleteActions({ ids: connectorsToDelete, http }); - const numSuccesses = successes.length; - const numErrors = errors.length; - callback(successes); - if (numSuccesses > 0) { - toastNotifications.addSuccess( - i18n.translate( - 'xpack.triggersActionsUI.sections.connectorsList.deleteSelectedConnectorsSuccessNotification.descriptionText', - { - defaultMessage: - 'Deleted {numSuccesses, number} {numSuccesses, plural, one {connector} other {connectors}}', - values: { numSuccesses }, - } - ) - ); - } - - if (numErrors > 0) { - toastNotifications.addDanger( - i18n.translate( - 'xpack.triggersActionsUI.sections.connectorsList.deleteSelectedConnectorsErrorNotification.descriptionText', - { - defaultMessage: - 'Failed to delete {numErrors, number} {numErrors, plural, one {connector} other {connectors}}', - values: { numErrors }, - } - ) - ); - } - }} - cancelButtonText={cancelButtonText} - confirmButtonText={confirmButtonText} - > - {confirmModalText} - - - ); -}; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/delete_modal_confirmation.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/delete_modal_confirmation.tsx new file mode 100644 index 0000000000000..80b59e15644ec --- /dev/null +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/delete_modal_confirmation.tsx @@ -0,0 +1,105 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ +import { EuiConfirmModal, EuiOverlayMask } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; +import React from 'react'; +import { HttpSetup } from 'kibana/public'; +import { useAppDependencies } from '../app_context'; + +export const DeleteModalConfirmation = ({ + idsToDelete, + apiDeleteCall, + onDeleted, + onCancel, + singleTitle, + multipleTitle, +}: { + idsToDelete: string[]; + apiDeleteCall: ({ + ids, + http, + }: { + ids: string[]; + http: HttpSetup; + }) => Promise<{ successes: string[]; errors: string[] }>; + onDeleted: (deleted: string[]) => void; + onCancel: () => void; + singleTitle: string; + multipleTitle: string; +}) => { + const { http, toastNotifications } = useAppDependencies(); + const numIdsToDelete = idsToDelete.length; + if (!numIdsToDelete) { + return null; + } + const confirmModalText = i18n.translate( + 'xpack.triggersActionsUI.deleteSelectedIdsConfirmModal.descriptionText', + { + defaultMessage: + "You can't recover {numIdsToDelete, plural, one {a deleted {singleTitle}} other {deleted {multipleTitle}}}.", + values: { numIdsToDelete, singleTitle, multipleTitle }, + } + ); + const confirmButtonText = i18n.translate( + 'xpack.triggersActionsUI.deleteSelectedIdsConfirmModal.deleteButtonLabel', + { + defaultMessage: + 'Delete {numIdsToDelete, plural, one {{singleTitle}} other {# {multipleTitle}}} ', + values: { numIdsToDelete, singleTitle, multipleTitle }, + } + ); + const cancelButtonText = i18n.translate( + 'xpack.triggersActionsUI.deleteSelectedIdsConfirmModal.cancelButtonLabel', + { + defaultMessage: 'Cancel', + } + ); + return ( + + onCancel()} + onConfirm={async () => { + const { successes, errors } = await apiDeleteCall({ ids: idsToDelete, http }); + const numSuccesses = successes.length; + const numErrors = errors.length; + onDeleted(successes); + if (numSuccesses > 0) { + toastNotifications.addSuccess( + i18n.translate( + 'xpack.triggersActionsUI.components.deleteSelectedIdsSuccessNotification.descriptionText', + { + defaultMessage: + 'Deleted {numSuccesses, number} {numSuccesses, plural, one {{singleTitle}} other {{multipleTitle}}}', + values: { numSuccesses, singleTitle, multipleTitle }, + } + ) + ); + } + + if (numErrors > 0) { + toastNotifications.addDanger( + i18n.translate( + 'xpack.triggersActionsUI.components.deleteSelectedIdsErrorNotification.descriptionText', + { + defaultMessage: + 'Failed to delete {numErrors, number} {numErrors, plural, one {{singleTitle}} other {{multipleTitle}}}', + values: { numErrors, singleTitle, multipleTitle }, + } + ) + ); + } + }} + cancelButtonText={cancelButtonText} + confirmButtonText={confirmButtonText} + > + {confirmModalText} + + + ); +}; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.test.ts b/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.test.ts index 0555823d0245e..453fbc4a9eb4f 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.test.ts +++ b/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.test.ts @@ -8,7 +8,6 @@ import { Alert, AlertType } from '../../types'; import { httpServiceMock } from '../../../../../../src/core/public/mocks'; import { createAlert, - deleteAlert, deleteAlerts, disableAlerts, enableAlerts, @@ -347,24 +346,11 @@ describe('loadAlerts', () => { }); }); -describe('deleteAlert', () => { - test('should call delete API for alert', async () => { - const id = '1'; - const result = await deleteAlert({ http, id }); - expect(result).toEqual(undefined); - expect(http.delete.mock.calls[0]).toMatchInlineSnapshot(` - Array [ - "/api/alert/1", - ] - `); - }); -}); - describe('deleteAlerts', () => { test('should call delete API for each alert', async () => { const ids = ['1', '2', '3']; const result = await deleteAlerts({ http, ids }); - expect(result).toEqual(undefined); + expect(result).toEqual({ errors: [], successes: [undefined, undefined, undefined] }); expect(http.delete.mock.calls).toMatchInlineSnapshot(` Array [ Array [ diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.ts b/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.ts index 1b18460ba11cb..359c48850549a 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.ts +++ b/x-pack/plugins/triggers_actions_ui/public/application/lib/alert_api.ts @@ -93,18 +93,24 @@ export async function loadAlerts({ }); } -export async function deleteAlert({ id, http }: { id: string; http: HttpSetup }): Promise { - await http.delete(`${BASE_ALERT_API_PATH}/${id}`); -} - export async function deleteAlerts({ ids, http, }: { ids: string[]; http: HttpSetup; -}): Promise { - await Promise.all(ids.map(id => deleteAlert({ http, id }))); +}): Promise<{ successes: string[]; errors: string[] }> { + const successes: string[] = []; + const errors: string[] = []; + await Promise.all(ids.map(id => http.delete(`${BASE_ALERT_API_PATH}/${id}`))).then( + function(fulfilled) { + successes.push(...fulfilled); + }, + function(rejected) { + errors.push(...rejected); + } + ); + return { successes, errors }; } export async function createAlert({ diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index c023f9087d70e..8c2565538f718 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -20,10 +20,10 @@ import { import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { useAppDependencies } from '../../../app_context'; -import { loadAllActions, loadActionTypes } from '../../../lib/action_connector_api'; +import { loadAllActions, loadActionTypes, deleteActions } from '../../../lib/action_connector_api'; import { ConnectorAddFlyout, ConnectorEditFlyout } from '../../action_connector_form'; import { hasDeleteActionsCapability, hasSaveActionsCapability } from '../../../lib/capabilities'; -import { DeleteConnectorsModal } from '../../../components/delete_connectors_modal'; +import { DeleteModalConfirmation } from '../../../components/delete_modal_confirmation'; import { ActionsConnectorsContextProvider } from '../../../context/actions_connectors_context'; import { checkActionTypeEnabled } from '../../../lib/check_action_type_enabled'; import './actions_connectors_list.scss'; @@ -378,29 +378,38 @@ export const ActionsConnectorsList: React.FunctionComponent = () => { return (
- { - if (deleted) { - if (selectedItems.length === 0 || selectedItems.length === deleted.length) { - const updatedActions = actions.filter( - action => action.id && !connectorsToDelete.includes(action.id) - ); - setActions(updatedActions); - setSelectedItems([]); - } else { - toastNotifications.addDanger({ - title: i18n.translate( - 'xpack.triggersActionsUI.sections.actionsConnectorsList.failedToDeleteActionsMessage', - { defaultMessage: 'Failed to delete action(s)' } - ), - }); - // Refresh the actions from the server, some actions may have beend deleted - loadActions(); - } + { + if (selectedItems.length === 0 || selectedItems.length === deleted.length) { + const updatedActions = actions.filter( + action => action.id && !connectorsToDelete.includes(action.id) + ); + setActions(updatedActions); + setSelectedItems([]); } setConnectorsToDelete([]); }} - connectorsToDelete={connectorsToDelete} + onCancel={async () => { + toastNotifications.addDanger({ + title: i18n.translate( + 'xpack.triggersActionsUI.sections.actionsConnectorsList.failedToDeleteActionsMessage', + { defaultMessage: 'Failed to delete action(s)' } + ), + }); + // Refresh the actions from the server, some actions may have beend deleted + await loadActions(); + setConnectorsToDelete([]); + }} + apiDeleteCall={deleteActions} + idsToDelete={connectorsToDelete} + singleTitle={i18n.translate( + 'xpack.triggersActionsUI.sections.actionsConnectorsList.singleTitle', + { defaultMessage: 'connector' } + )} + multipleTitle={i18n.translate( + 'xpack.triggersActionsUI.sections.actionsConnectorsList.multipleTitle', + { defaultMessage: 'connectors' } + )} /> {/* Render the view based on if there's data or if they can save */} diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx index 18e79a1d93a10..84e4d5794859c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx @@ -31,10 +31,11 @@ import { AlertQuickEditButtonsWithApi as AlertQuickEditButtons } from '../../com import { CollapsedItemActionsWithApi as CollapsedItemActions } from './collapsed_item_actions'; import { TypeFilter } from './type_filter'; import { ActionTypeFilter } from './action_type_filter'; -import { loadAlerts, loadAlertTypes } from '../../../lib/alert_api'; +import { loadAlerts, loadAlertTypes, deleteAlerts } from '../../../lib/alert_api'; import { loadActionTypes } from '../../../lib/action_connector_api'; import { hasDeleteAlertsCapability, hasSaveAlertsCapability } from '../../../lib/capabilities'; import { routeToAlertDetails, DEFAULT_SEARCH_PAGE_SIZE } from '../../../constants'; +import { DeleteModalConfirmation } from '../../../components/delete_modal_confirmation'; const ENTER_KEY = 13; @@ -85,6 +86,7 @@ export const AlertsList: React.FunctionComponent = () => { }); const [editedAlertItem, setEditedAlertItem] = useState(undefined); const [editFlyoutVisible, setEditFlyoutVisibility] = useState(false); + const [alertsToDelete, setAlertsToDelete] = useState([]); useEffect(() => { loadAlertsData(); @@ -242,7 +244,12 @@ export const AlertsList: React.FunctionComponent = () => { width: '40px', render(item: AlertTableItem) { return ( - loadAlertsData()} /> + loadAlertsData()} + setAlertsToDelete={setAlertsToDelete} + /> ); }, }, @@ -338,6 +345,7 @@ export const AlertsList: React.FunctionComponent = () => { loadAlertsData(); setIsPerformingAction(false); }} + setAlertsToDelete={setAlertsToDelete} /> @@ -422,6 +430,40 @@ export const AlertsList: React.FunctionComponent = () => { return (
+ { + if (selectedIds.length === 0 || selectedIds.length === deleted.length) { + const updatedAlerts = alertsState.data.filter( + alert => alert.id && !alertsToDelete.includes(alert.id) + ); + setAlertsState({ + isLoading: false, + data: updatedAlerts, + totalItemCount: alertsState.totalItemCount - deleted.length, + }); + setSelectedIds([]); + } + setAlertsToDelete([]); + }} + onCancel={async () => { + toastNotifications.addDanger({ + title: i18n.translate( + 'xpack.triggersActionsUI.sections.alertsList.failedToDeleteAlertsMessage', + { defaultMessage: 'Failed to delete alert(s)' } + ), + }); + // Refresh the alerts from the server, some alerts may have beend deleted + await loadAlertsData(); + }} + apiDeleteCall={deleteAlerts} + idsToDelete={alertsToDelete} + singleTitle={i18n.translate('xpack.triggersActionsUI.sections.alertsList.singleTitle', { + defaultMessage: 'alert', + })} + multipleTitle={i18n.translate('xpack.triggersActionsUI.sections.alertsList.multipleTitle', { + defaultMessage: 'alerts', + })} + /> {loadedItems.length || isFilterApplied ? ( table diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/collapsed_item_actions.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/collapsed_item_actions.tsx index 2bac159ed79ed..694f99251d26b 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/collapsed_item_actions.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/collapsed_item_actions.tsx @@ -27,6 +27,7 @@ import { export type ComponentOpts = { item: AlertTableItem; onAlertChanged: () => void; + setAlertsToDelete: React.Dispatch>; } & BulkOperationsComponentOpts; export const CollapsedItemActions: React.FunctionComponent = ({ @@ -36,7 +37,7 @@ export const CollapsedItemActions: React.FunctionComponent = ({ enableAlert, unmuteAlert, muteAlert, - deleteAlert, + setAlertsToDelete, }: ComponentOpts) => { const { capabilities } = useAppDependencies(); @@ -116,10 +117,7 @@ export const CollapsedItemActions: React.FunctionComponent = ({ iconType="trash" color="text" data-test-subj="deleteAlert" - onClick={async () => { - await deleteAlert(item); - onAlertChanged(); - }} + onClick={() => setAlertsToDelete([item.id])} > void; onActionPerformed?: () => void; + setAlertsToDelete: React.Dispatch>; } & BulkOperationsComponentOpts; export const AlertQuickEditButtons: React.FunctionComponent = ({ @@ -30,7 +31,7 @@ export const AlertQuickEditButtons: React.FunctionComponent = ({ unmuteAlerts, enableAlerts, disableAlerts, - deleteAlerts, + setAlertsToDelete, }: ComponentOpts) => { const { toastNotifications } = useAppDependencies(); @@ -129,7 +130,7 @@ export const AlertQuickEditButtons: React.FunctionComponent = ({ onPerformingAction(); setIsDeletingAlerts(true); try { - await deleteAlerts(selectedItems); + setAlertsToDelete(selectedItems.map((selected: any) => selected.id)); } catch (e) { toastNotifications.addDanger({ title: i18n.translate( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.test.tsx index 30a065479ce33..074e2d5147b5e 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.test.tsx @@ -125,8 +125,8 @@ describe('with_bulk_alert_api_operations', () => { const component = mount(); component.find('button').simulate('click'); - expect(alertApi.deleteAlert).toHaveBeenCalledTimes(1); - expect(alertApi.deleteAlert).toHaveBeenCalledWith({ id: alert.id, http }); + expect(alertApi.deleteAlerts).toHaveBeenCalledTimes(1); + expect(alertApi.deleteAlerts).toHaveBeenCalledWith({ ids: [alert.id], http }); }); // bulk alerts diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.tsx index 4b348b85fe5bc..0ba590ab462a7 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/with_bulk_alert_api_operations.tsx @@ -14,7 +14,6 @@ import { enableAlerts, muteAlerts, unmuteAlerts, - deleteAlert, disableAlert, enableAlert, muteAlert, @@ -31,14 +30,24 @@ export interface ComponentOpts { unmuteAlerts: (alerts: Alert[]) => Promise; enableAlerts: (alerts: Alert[]) => Promise; disableAlerts: (alerts: Alert[]) => Promise; - deleteAlerts: (alerts: Alert[]) => Promise; + deleteAlerts: ( + alerts: Alert[] + ) => Promise<{ + successes: string[]; + errors: string[]; + }>; muteAlert: (alert: Alert) => Promise; unmuteAlert: (alert: Alert) => Promise; muteAlertInstance: (alert: Alert, alertInstanceId: string) => Promise; unmuteAlertInstance: (alert: Alert, alertInstanceId: string) => Promise; enableAlert: (alert: Alert) => Promise; disableAlert: (alert: Alert) => Promise; - deleteAlert: (alert: Alert) => Promise; + deleteAlert: ( + alert: Alert + ) => Promise<{ + successes: string[]; + errors: string[]; + }>; loadAlert: (id: Alert['id']) => Promise; loadAlertState: (id: Alert['id']) => Promise; loadAlertTypes: () => Promise; @@ -102,7 +111,7 @@ export function withBulkAlertOperations( return disableAlert({ http, id: alert.id }); } }} - deleteAlert={async (alert: Alert) => deleteAlert({ http, id: alert.id })} + deleteAlert={async (alert: Alert) => deleteAlerts({ http, ids: [alert.id] })} loadAlert={async (alertId: Alert['id']) => loadAlert({ http, alertId })} loadAlertState={async (alertId: Alert['id']) => loadAlertState({ http, alertId })} loadAlertTypes={async () => loadAlertTypes({ http })} diff --git a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/of.tsx b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/of.tsx index 954e584d52a87..fdf68cc49572f 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/of.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/of.tsx @@ -125,7 +125,9 @@ export const OfExpression = ({ onChangeSelectedAggField( selectedOptions.length === 1 ? selectedOptions[0].label : undefined ); - setAggFieldPopoverOpen(false); + if (selectedOptions.length > 0) { + setAggFieldPopoverOpen(false); + } }} /> diff --git a/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/alerts.ts b/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/alerts.ts index b4dd3bb5baa51..7e5825d88ec13 100644 --- a/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/alerts.ts +++ b/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/alerts.ts @@ -332,6 +332,7 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { }); it('should delete single alert', async () => { + await createAlert(); const createdAlert = await createAlert(); await pageObjects.common.navigateToApp('triggersActions'); await pageObjects.triggersActionsUI.searchAlerts(createdAlert.name); @@ -339,8 +340,16 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { await testSubjects.click('collapsedItemActions'); await testSubjects.click('deleteAlert'); + await testSubjects.existOrFail('deleteIdsConfirmation'); + await testSubjects.click('deleteIdsConfirmation > confirmModalConfirmButton'); + await testSubjects.missingOrFail('deleteIdsConfirmation'); - expect(await pageObjects.triggersActionsUI.isAnEmptyAlertsListDisplayed()).to.be(true); + const toastTitle = await pageObjects.common.closeToast(); + expect(toastTitle).to.eql('Deleted 1 alert'); + await pageObjects.common.navigateToApp('triggersActions'); + await pageObjects.triggersActionsUI.searchAlerts(createdAlert.name); + const searchResultsAfterDelete = await pageObjects.triggersActionsUI.getAlertsList(); + expect(searchResultsAfterDelete.length).to.eql(0); }); it('should mute all selection', async () => { @@ -449,8 +458,16 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { await testSubjects.click('bulkAction'); await testSubjects.click('deleteAll'); + await testSubjects.existOrFail('deleteIdsConfirmation'); + await testSubjects.click('deleteIdsConfirmation > confirmModalConfirmButton'); + await testSubjects.missingOrFail('deleteIdsConfirmation'); - expect(await pageObjects.triggersActionsUI.isAnEmptyAlertsListDisplayed()).to.be(true); + await pageObjects.common.closeToast(); + + await pageObjects.common.navigateToApp('triggersActions'); + await pageObjects.triggersActionsUI.searchAlerts(createdAlert.name); + const searchResultsAfterDelete = await pageObjects.triggersActionsUI.getAlertsList(); + expect(searchResultsAfterDelete.length).to.eql(0); }); }); }; diff --git a/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/connectors.ts b/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/connectors.ts index 9d656b08a3abd..c2013ba3502e2 100644 --- a/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/connectors.ts +++ b/x-pack/test/functional_with_es_ssl/apps/triggers_actions_ui/connectors.ts @@ -123,9 +123,9 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { expect(searchResultsBeforeDelete.length).to.eql(1); await testSubjects.click('deleteConnector'); - await testSubjects.existOrFail('deleteConnectorsConfirmation'); - await testSubjects.click('deleteConnectorsConfirmation > confirmModalConfirmButton'); - await testSubjects.missingOrFail('deleteConnectorsConfirmation'); + await testSubjects.existOrFail('deleteIdsConfirmation'); + await testSubjects.click('deleteIdsConfirmation > confirmModalConfirmButton'); + await testSubjects.missingOrFail('deleteIdsConfirmation'); const toastTitle = await pageObjects.common.closeToast(); expect(toastTitle).to.eql('Deleted 1 connector'); @@ -164,9 +164,9 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { await find.clickByCssSelector('.euiTableRowCellCheckbox .euiCheckbox__input'); await testSubjects.click('bulkDelete'); - await testSubjects.existOrFail('deleteConnectorsConfirmation'); - await testSubjects.click('deleteConnectorsConfirmation > confirmModalConfirmButton'); - await testSubjects.missingOrFail('deleteConnectorsConfirmation'); + await testSubjects.existOrFail('deleteIdsConfirmation'); + await testSubjects.click('deleteIdsConfirmation > confirmModalConfirmButton'); + await testSubjects.missingOrFail('deleteIdsConfirmation'); const toastTitle = await pageObjects.common.closeToast(); expect(toastTitle).to.eql('Deleted 1 connector');