From 95b9851a08f5a2809a4960df09359adff8995e8b Mon Sep 17 00:00:00 2001
From: Melissa Alvarez <melissa.alvarez@elastic.co>
Date: Fri, 5 Oct 2018 12:44:07 +0100
Subject: [PATCH] [ML] Ensure Calendar creation navigation tabs are
 keyboard/screen reader accessible (#23832)

* Calendar nav links keyboard accessible

* Prevent default click behavior

* use event default value

* remove unnecessary default param
---
 .../components/new_event_modal/new_event_modal.html         | 6 +++---
 .../new_event_modal/new_event_modal_controller.js           | 6 +++++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal.html b/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal.html
index 6c114923518b5..4cae3ab705be7 100644
--- a/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal.html
+++ b/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal.html
@@ -23,9 +23,9 @@ <h3 class="euiTitle">Create new event</h3>
     <div class="main-container row1">
       <div class="tabs-container">
         <ul class="nav nav-pills nav-stacked">
-          <li ng-class="{ active: ui.rangeType === '0' }"><a ng-click="ui.setRangeType('0')"> Single day</a></li>
-          <li ng-class="{ active: ui.rangeType === '1' }"><a ng-click="ui.setRangeType('1')"> Day range</a></li>
-          <li ng-class="{ active: ui.rangeType === '2' }"><a ng-click="ui.setRangeType('2')"> Time range</a></li>
+          <li ng-class="{ active: ui.rangeType === '0' }"><a href="#" ng-click="ui.setRangeType('0', $event)"> Single day</a></li>
+          <li ng-class="{ active: ui.rangeType === '1' }"><a href="#" ng-click="ui.setRangeType('1', $event)"> Day range</a></li>
+          <li ng-class="{ active: ui.rangeType === '2' }"><a href="#" ng-click="ui.setRangeType('2', $event)"> Time range</a></li>
         </ul>
       </div>
       <div
diff --git a/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal_controller.js b/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal_controller.js
index 0bd47e582f043..6213f32ba71e2 100644
--- a/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal_controller.js
+++ b/x-pack/plugins/ml/public/settings/scheduled_events/components/new_event_modal/new_event_modal_controller.js
@@ -42,7 +42,11 @@ module.controller('MlNewEventModal', function (
       start: moment().startOf('day'),
       end: moment().startOf('day').add(1, 'days')
     },
-    setRangeType(i) {
+    setRangeType(i, event) {
+      if (event && event.preventDefault) {
+        event.preventDefault();
+      }
+
       $scope.ui.rangeType = i;
       let width = MODAL_WIDTH_SMALL;
       if (i === RANGE_TYPE.SINGLE_DAY) {