diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.test.tsx index b31be7ecb9a79d..b87aaacb3ec0e2 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.test.tsx @@ -86,7 +86,7 @@ describe('alert_form', () => { uiSettings: deps!.uiSettings, }} > - {}} errors={{ name: [] }} /> + {}} errors={{ name: [], interval: [] }} /> ); @@ -165,7 +165,7 @@ describe('alert_form', () => { uiSettings: deps!.uiSettings, }} > - {}} errors={{ name: [] }} /> + {}} errors={{ name: [], interval: [] }} /> ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx index 1fa620c5394a12..598fa4b81bbf1a 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx @@ -48,7 +48,7 @@ export function validateBaseProperties(alertObject: Alert) { }) ); } - if (!alertObject.schedule.interval) { + if (alertObject.schedule.interval.length < 2) { errors.interval.push( i18n.translate('xpack.triggersActionsUI.sections.alertForm.error.requiredIntervalText', { defaultMessage: 'Check interval is required.', @@ -81,11 +81,15 @@ export const AlertForm = ({ alert, canChangeTrigger = true, dispatch, errors }: ); const [alertTypesIndex, setAlertTypesIndex] = useState(undefined); - const [alertInterval, setAlertInterval] = useState( - alert.schedule.interval ? parseInt(alert.schedule.interval.replace(/^[A-Za-z]+$/, ''), 0) : 1 + const [alertInterval, setAlertInterval] = useState( + alert.schedule.interval + ? parseInt(alert.schedule.interval.replace(/^[A-Za-z]+$/, ''), 0) + : undefined ); const [alertIntervalUnit, setAlertIntervalUnit] = useState( - alert.schedule.interval ? alert.schedule.interval.replace(alertInterval.toString(), '') : 'm' + alert.schedule.interval + ? alert.schedule.interval.replace((alertInterval ?? '').toString(), '') + : 'm' ); const [alertThrottle, setAlertThrottle] = useState( alert.throttle ? parseInt(alert.throttle.replace(/^[A-Za-z]+$/, ''), 0) : null @@ -344,19 +348,27 @@ export const AlertForm = ({ alert, canChangeTrigger = true, dispatch, errors }: - + 0} + error={errors.interval} + > 0} compressed - value={alertInterval} + value={alertInterval || ''} name="interval" data-test-subj="intervalInput" onChange={e => { - const interval = e.target.value !== '' ? parseInt(e.target.value, 10) : null; - setAlertInterval(interval ?? 1); + const interval = + e.target.value !== '' ? parseInt(e.target.value, 10) : undefined; + setAlertInterval(interval); setScheduleProperty('interval', `${e.target.value}${alertIntervalUnit}`); }} /> @@ -366,7 +378,7 @@ export const AlertForm = ({ alert, canChangeTrigger = true, dispatch, errors }: fullWidth compressed value={alertIntervalUnit} - options={getTimeOptions(alertInterval)} + options={getTimeOptions(alertInterval ?? 1)} onChange={e => { setAlertIntervalUnit(e.target.value); setScheduleProperty('interval', `${alertInterval}${e.target.value}`); 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 791712fa244893..d8f6a33b5d66cf 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 @@ -62,7 +62,12 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { await fieldOptions[1].click(); // need this two out of popup clicks to close them await nameInput.click(); - await testSubjects.click('intervalInput'); + const intervalInput = await testSubjects.find('intervalInput'); + await intervalInput.click(); + await intervalInput.clearValue(); + const validationError = await find.byCssSelector(`.euiFormErrorText`); + expect(validationError.isDisplayed).to.be(true); + await intervalInput.type(1); await testSubjects.click('.slack-ActionTypeSelectOption'); await testSubjects.click('createActionConnectorButton');